我有一个 Web 应用程序,我正在尝试使用 Twitter 的 OAuth 功能。该应用程序有一个链接,提示用户输入 Twitter 凭据。当用户单击此链接时,将通过 JavaScript 打开一个新窗口。该窗口用作对话框。这是这样完成的:
主页:
<div id="promptDiv"><a href="#" onclick="launchDialog('twitter/prompt.aspx');">Provide Credentials</a></div>
...
function launchDialog(url) {
var specs = "location=0,menubar=0,status=0,titlebar=0,toolbar=0";
var dialogWindow = window.open(url, "dialog", specs, true);
}
当用户单击该链接时,他们会从prompt.aspx 页面重定向到Twitter 网站。在 Twitter 网站上,用户可以选择输入其 Twitter 凭据。当他们提供凭据后,他们会被重定向回我的网站。这是通过回调 URL 来完成的,该 URL 可以为 Twitter 站点上的应用程序设置。
当回调发生时,用户将被重定向到对话窗口中我网站上的“/twitter/confirm.aspx”。发生这种情况时,我想更新“promptDiv”的内容以显示“您已成功连接 Twitter”以替换链接并关闭对话框。这样做的目的是通知用户他们已成功完成此步骤。我可以成功关闭对话框窗口。但是,当我尝试更新 HTML DOM 时,收到一条错误消息“错误:获取属性 Window.document 的权限被拒绝”。为了尝试更新 HTML DOM,我尝试在“/twitter/confirm.aspx”中使用以下脚本:
// Error is thrown on the first line.
var confirmDiv = window.opener.document.getElementById("confirmDiv");
if (confirmDiv != null)
{
// Update the contents
}
window.close();
然后我尝试读取 HTML,看看是否可以通过以下脚本访问 DOM:
alert(window.opener.document.body.innerHTML);
当我尝试这样做时,我仍然收到“权限被拒绝”错误。我知道这与跨站点脚本有关。但是,我不知道如何解决。我该如何解决这个问题?我的申请结构是否不正确?用户重定向回我的网站后,如何更新 HTML DOM?
感谢您的帮助!