使用 CORS 处理另一个站点上的重新身份验证

Using CORS to handle reauthentication on another site

我正在尝试使用不同的授权网站处理重新身份验证,同时在我的主网站的单页应用程序 (SPA) 中。这两个网站都是客户网站的内部网站。

我不能使用标准 "redirect" 方法,因为我会失去我的 SPA JavaScript 上下文。

我已经调查并在 Auth 网站上设置了 CORS,所以它现在返回 Access-Control-Allow-Origin: https://www.mywebsite.com。当我尝试将 Auth 页面加载到 JQuery UI 对话框时,它失败了,因为脚本都尝试在主页网站的上下文中加载。


来自我的网站 https://www.mywebsite.com/static/
我正在加载 https://www.auth.com/login.html.

当加载到 JQuery UI 对话框时,它会尝试将其脚本加载为 https://www.mywebsite.com/static/scripts/authscript.js
而不是
https://www.auth.com/scripts/authscript.js

我还尝试通过更改 src 标记将 Auth 页面加载到 iframe,但它只是重新加载了页面。

有没有办法在我尝试显示的 CORS 网页的上下文中更改源目录?

所以我无法将页面正确加载到标准 jQuery 模态对话框中,而且我无法控制我正在连接的 Auth 页面。为了解决这个问题,我调查了我在使用 iframe 时遇到的问题,并使用 HTML5 功能 sandbox 来修复它。

Auth 页面使用 "break out" 脚本重新加载页面,如果它被加载到 iframe 中,显然这破坏了我的 SPA 上下文。 HTML5 允许您限制 iframe 的内容。

<iframe src="" id="my_auth" sandbox="allow-forms allow-scripts allow-same-origin"></iframe>

  • allow-forms 允许 formsubmit
  • allow-scripts让它运行JavaScript
  • allow-same-origin 让它认为 Origin 与脚本(即 Auth 网站)相同,这是启用 cookies 所必需的
  • 值得注意的是,我没有包括 allow-top-navigation,这是允许重新加载页面和丢失我的 JavaScript 上下文
  • 的原因

瞧,授权页面显示在 jQuery 模态对话框(包含 iframe)中,无需弹出另一个 window。

CORS 是允许重定向到 Auth 网站所必需的(在 JavaScript 参与之前发生在浏览器中)。您也可以捕获 "Access-control-allow-origin" 异常。

具有 Siteminder 登录名的 iframe 正在访问我网站上的一个页面,该页面在用户登录后在 localStorage 中设置了一个值。该应用程序只是在后台轮询 localStorage 以查看用户是否已成功登录。

希望这对某人有用。