Office.js网络WORD加载项:window.open()方法不适用于"about:blank"网址 [英] Office.js web WORD add-in: window.open() method is not working with "about:blank" URL
问题描述
摘要:
window.Open('')
或window.Open('about:blank')
与普通html文件中的JavaScript配合使用,可以进行测试此 Office.js WORD加载项项目,与我的Microsoft Office Home and Student 2016
版本完美配合.在同一项目中,然后在home.js
文件中创建了一个新按钮btnTest
.当我单击btnTest
时,它将成功调用以下MyTest
方法,并使用window.Open('some URL')
打开一个新窗口.
但是在调用window.Open('about:blank')
的相同MyTest
方法中,它不会打开此处. 问题:如何使window.Open('about:blank')
方法起作用?
function MyTest() {
Word.run(function (context) {
// window.open('https://www.google.com/'); this works
var myWindow = window.open('about:blank'); //this does not work and, instead, displays the default Windows 10 message shown in screenshot below
myWindow.document.write('<!DOCTYPE html><html><head></head><body><p>This is just a paragraph</p></body></html>');
// Synchronize the document state by executing the queued commands,
// and return a promise to indicate task completion.
return context.sync().then(function () {
//following (after un-commenting) does not work either
//var myWindow = window.open('about:blank');
//myWindow.document.write('<!DOCTYPE html><html><head></head><body><p>This is just a paragraph</p></body></html>');
});
})
.catch(function (error) {
console.log('Error: ' + JSON.stringify(error));
if (error instanceof OfficeExtension.Error) {
console.log('Debug info: ' + JSON.stringify(error.debugInfo));
}
});
}
window.open('about:blank');
被调用时,Windows后续消息框弹出,并且确定"按钮显示为灰色:
注意:在同一桌面上,我随后创建了新的此 UWP AP with Javascript
项目,在其项目的以下方法中,我取消了对其代码的注释,并添加了window.open('about:blank');
.当我在其中调用以下方法时,它将成功在那里打开默认的空白页.
function sayHello() {
//var messageDialog = new Windows.UI.Popups.MessageDialog("Hello, world!", "Alert");
//messageDialog.showAsync();
window.open('about:blank');
}
更新:
如何通过对话框使其正常工作?我尝试了以下操作,但没有成功:我创建了此对话框插件.它按原样工作.然后,我在新项目的加载项的Form.js
文件中注释了submit()
函数的代码,并添加了window.open('https://www.google.com/');
行.当我单击对话框的提交"按钮时,它会在默认浏览器中成功打开google网站.但是如果我将上面的行替换为
var myWindow = window.open('about:blank');
myWindow.document.write('html here'');`
显示与上图相同的警告窗口
import {POP_UP_HEIGHT, POP_UP_WIDTH} from '../constants';
/**
* Handles interaction with the Office API for Common shared API.
*/
export default class Office {
constructor(office) {
this.office = office;
this.dialog = null;
this.callback = null;
}
/**
* Store the callback function that will be invoked to
* after pop-up message is received.
* @param {string} url
* @param {function} callback
*/
openPopUp(url, callback) {
this.callback = callback;
this.office.context.ui.displayDialogAsync(url,
{height: POP_UP_HEIGHT, width: POP_UP_WIDTH}, this.dialogCallback.bind(this)); // THIS IS WHAT YOU NEED
}
/**
* Send the message from the child window (pop-up window)
* To the parent window (Task pane window)
* @param {string} message
*/
messageFromPopUp(message) {
this.office.context.ui.messageParent(message);
}
/**
* The parent window will close the child window (pop-up)
* and invoke the callback functionality
* with a given message from the child window
* @param {Object} event
*/
dialogHandler(event) {
this.dialog.close();
this.callback(event.message);
}
/**
* Store the child window (pop-up window) and create
* an event handler to notify the parent window when
* the child window sends a message to it
* @param {Object} asyncResults
* @param {string} asyncResults.status Status of the result, preferably 'succeeded'
* @param {string} asyncResults.value
*/
dialogCallback(asyncResults) {
if (asyncResults.status === 'succeeded') {
this.dialog = asyncResults.value;
this.dialog.addEventHandler(this.office.EventType.DialogMessageReceived,
this.dialogHandler.bind(this));
}
else {
console.error(`Error: ${asyncResults.error.message}`);
}
}
}
Summary:
window.Open('')
or window.Open('about:blank')
works with JavaScript in a normal html file as can be tested here. But it does not seem to work in an Office.js add-in.
Details:
On my Windows 10 desktop
with VS2017
I created this Office.js WORD add-in project that works perfectly with my Microsoft Office Home and Student 2016
edition. In the same project, I then created a new button btnTest
in the home.js
file. When I click btnTest
it successfully calls the following MyTest
method and opens a new window with window.Open('some URL')
.
But in the same MyTest
method when I call window.Open('about:blank')
it does not open a blank page; instead, it opens windows 10 message box shown in screenshot below.
The goal here is that my code creates HTML string based on some content from WORD document
and then use window.document.write(...)
method to dynamically open that html in the browser as explained (and you can test) here. Question: How can I make window.Open('about:blank')
method work?
function MyTest() {
Word.run(function (context) {
// window.open('https://www.google.com/'); this works
var myWindow = window.open('about:blank'); //this does not work and, instead, displays the default Windows 10 message shown in screenshot below
myWindow.document.write('<!DOCTYPE html><html><head></head><body><p>This is just a paragraph</p></body></html>');
// Synchronize the document state by executing the queued commands,
// and return a promise to indicate task completion.
return context.sync().then(function () {
//following (after un-commenting) does not work either
//var myWindow = window.open('about:blank');
//myWindow.document.write('<!DOCTYPE html><html><head></head><body><p>This is just a paragraph</p></body></html>');
});
})
.catch(function (error) {
console.log('Error: ' + JSON.stringify(error));
if (error instanceof OfficeExtension.Error) {
console.log('Debug info: ' + JSON.stringify(error.debugInfo));
}
});
}
Windows following message box pops up with OK button grayed out when window.open('about:blank');
is called:
NOTE: On the same desktop, I then created new this UWP AP with Javascript
project and in the following method of their project, I un-commented their code and added window.open('about:blank');
. When I call the following method there it successfully opens the default blank page there.
function sayHello() {
//var messageDialog = new Windows.UI.Popups.MessageDialog("Hello, world!", "Alert");
//messageDialog.showAsync();
window.open('about:blank');
}
UPDATE:
How can I make it work from dialog? I tried the following but it did not work: I created this dialog Add-In. It works as it is. Then I commented out the code of submit()
function in Form.js
file of the add-in in the new project and added window.open('https://www.google.com/');
line instead. When I click the Submit button of the dialog, it successfully opens the google website in default browser. But if I replace the above line with
var myWindow = window.open('about:blank');
myWindow.document.write('html here'');`
it shows the same warning window shown in image above
import {POP_UP_HEIGHT, POP_UP_WIDTH} from '../constants';
/**
* Handles interaction with the Office API for Common shared API.
*/
export default class Office {
constructor(office) {
this.office = office;
this.dialog = null;
this.callback = null;
}
/**
* Store the callback function that will be invoked to
* after pop-up message is received.
* @param {string} url
* @param {function} callback
*/
openPopUp(url, callback) {
this.callback = callback;
this.office.context.ui.displayDialogAsync(url,
{height: POP_UP_HEIGHT, width: POP_UP_WIDTH}, this.dialogCallback.bind(this)); // THIS IS WHAT YOU NEED
}
/**
* Send the message from the child window (pop-up window)
* To the parent window (Task pane window)
* @param {string} message
*/
messageFromPopUp(message) {
this.office.context.ui.messageParent(message);
}
/**
* The parent window will close the child window (pop-up)
* and invoke the callback functionality
* with a given message from the child window
* @param {Object} event
*/
dialogHandler(event) {
this.dialog.close();
this.callback(event.message);
}
/**
* Store the child window (pop-up window) and create
* an event handler to notify the parent window when
* the child window sends a message to it
* @param {Object} asyncResults
* @param {string} asyncResults.status Status of the result, preferably 'succeeded'
* @param {string} asyncResults.value
*/
dialogCallback(asyncResults) {
if (asyncResults.status === 'succeeded') {
this.dialog = asyncResults.value;
this.dialog.addEventHandler(this.office.EventType.DialogMessageReceived,
this.dialogHandler.bind(this));
}
else {
console.error(`Error: ${asyncResults.error.message}`);
}
}
}
这篇关于Office.js网络WORD加载项:window.open()方法不适用于"about:blank"网址的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!