使用CORS处理另一个站点的重新认证

Question

我正在尝试使用其他授权网站处理重新认证，而在我的主页中的单页应用程序（SPA）中。这两个网站都是客户端站点的内部网站。

我无法使用标准的“重定向”方法，因为我将丢失SPA JavaScript上下文。

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

即 从我的网站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

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

有没有办法在我想要显示的CORS网页的上下文中更改Source目录？

Answer 1

所以我无法将页面正确加载到标准的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允许form和submit
• allow-scripts让它运行JavaScript
• allow-same-origin让它认为Origin与脚本（即Auth网站）相同，这是启用cookie所必需的
• 值得注意的是，我不包括allow-top-navigation，这是允许重新加载页面和丢失我的JavaScript上下文

Voilà，auth页面显示在jQuery模式对话框（包含iframe）中，无需弹出另一个窗口。

允许重定向到Auth网站（在JavaScript参与之前在浏览器中发生）需要CORS。您也可以捕获“Access-control-allow-origin”异常。

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

希望这对某人有用。