我打开 SSO 的 Office 对话框,登录后我使用以下代码成功从 URL 获取代码:
const currentUrl = window.location.href;
console.log(currentUrl);
const getCodeFromUrl = (currentUrl) => {
const params = new URLSearchParams(currentUrl.split('?')[1]);
return params.get('code');
};
const code = getCodeFromUrl(currentUrl);
console.log('Code:', code);
Office.onReady(function (officeContext) {
if (officeContext) {
if (code) {
Office.context.ui.messageParent(JSON.stringify(code));
} else {
console.log("code not found");
}
} else {
console.log('Office context not available.');
}
});
获取代码后,桌面上的对话框成功关闭。但是,当我们在 Outlook Web 上测试相同的内容时,对话框不会关闭并给出以下警告和错误:
警告:Office.js 在 Office 客户端之外加载
当我重定向到我的 html 时,我得到了代码,但这里出现错误
redirect.html?code=RIaDfTxLDxUvRWLZWNox0EcIeUz9FT:52
Uncaught TypeError: Cannot read properties of undefined (reading 'messageParent')
at redirect.html?code=RIaDfTxLDxUvRWLZWNox0EcIeUz9FT:52:39
at office.js:76:25549
at t (office.js:76:24950)
at s (office.js:76:32645)
at c (office.js:76:4373)
at f.waitForFunction (office.js:76:4462)
at z (office.js:76:33109)
at HTMLScriptElement.m (office.js:76:6525)
:3000/favicon.ico:1
**Failed to load resource**: the server responded with a status of 404 (Not Found)
这是我的office.js代码:
let dialog;
Office.onReady(function (info) {
if (info.host === Office.HostType.Outlook) {
if (Office.context && Office.context.ui) {
Office.context.ui.displayDialogAsync(
authorizationUrl,
{ height: 80, width: 40, requireHTTPS: true, promptBeforeOpen: false },
function (asyncResult) {
if (asyncResult.status === Office.AsyncResultStatus.Succeeded) {
dialog = asyncResult.value;
dialog.addEventHandler(Office.EventType.DialogMessageReceived, function (arg) {
const code = arg.message;
dialog.close();
// Invoke callback with the received code
callback(code);
});
} else {
console.log('Failed to open dialog:', asyncResult.error.message);
}
}
);
} else {
console.log('Office context or UI not available.');
}
} else {
console.log('Office host is not Outlook.');
}
});
如何解决这个问题?
我不确定您为什么会遇到这个问题。看起来我的代码和你的代码之间的区别在于你使用 onReady 而我使用初始化。
这是我的工作 SSO 对话框
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Activate</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/png" href="/assets/images/icon32.png" />
<script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"
type="text/javascript"></script>
<script type="text/javascript">
Office.initialize = function () {
function getHashStringParameter(paramToRetrieve) {
var hash = location.hash.substring(1);
if (!hash) return null; // No hash available
const urlParams = new URLSearchParams(hash);
return urlParams.get(paramToRetrieve);
}
var idToken = getHashStringParameter("id_token");
var accessToken = getHashStringParameter("access_token");
var code = getHashStringParameter("code");
if (idToken) {
var messageObject = {};
if (idToken !== null) {
messageObject = {
isSuccess: true,
idToken: idToken,
accessToken: accessToken,
code: code,
search: window.location.href,
};
} else {
messageObject = { isSuccess: false, error: "idToken was null" };
}
// Tell the task pane about the outcome.
Office.context.ui.messageParent(JSON.stringify(messageObject));
}
};
</script>