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

时间:2016-08-15 16:57:43

标签: javascript ajax cors single-page-application siteminder

我尝试使用其他授权网站处理重新认证,而在我的主页网站的单页应用程序(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目录?

1 个答案:

答案 0 :(得分:2)

所以我无法将页面正确加载到标准的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网站)相同,这是启用cookie所必需的
  • 值得注意的是,我不包括允许重新加载页面和丢失JavaScript上下文的allow-top-navigation

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

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

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

希望这对某人有用。