您的位置：首页 > 其它

利用iframe解决一个跨域问题

2014-06-09 09:49 411 查看

今天碰到的问题

两个页面原来都在一个站点 a.com

现在业务拆分，需要把一部分重要的业务放在b.com

但是b.com 需要每次a.com登入登出信息。因为跨域不能调用localStorage等。

想出的解决方案:

每次a.com登入登出时候，新建iframe，src设置一个 b.com 域下“中间页”加入参数并且接收存储到localStorage.代码如下

a.com

var iframe = document.createElement('iframe.html');
iframe.src = 'b.com/info?info=111';

b.com/info.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
//此页面尽可能简洁，减少手机游览器iframe的开销
<script type="text/javascript">
var href = location.href;
var index = href.indexOf("?");
var paramsStr = href.substr(index + 1);
var temp = paramsStr.split('=');

if (temp[0] == 'info') {
localStorage.setItem("INFO", temp[1]);
}
</script>
</body>
</html>

这样就完美解决了问题。

测试结果：

Android上：UC游览器，qq游览器，chrome，FF 全部通过

IOS:UC通过。但是Safari不通过。

关于Safari不通过，调了一会，发现居然不能用 localStorage！！！（我想Safari没那么弱吧，都是webkit内核，行为不一样）。

报错:"QUOTA_EXCEEDED_ERR: DOM Exception 22: An attempt was made to add something to storage that exceeded the quota."

谷歌之，原来别人也碰到过。

原文：https://github.com/marcuswestin/store.js/issues/42

发现，游览器还有 private browsing mode（隐私/私密/无痕游览模式，各种翻译不同）一说。

在这个模式下面，将会禁止一些特性，特别是会留缓存写硬盘的事件，比如 history， localstorage, sessionstorage。

各种游览器开启方式：http://browsers.about.com/od/faq/tp/Private-Browsing.htm

有想过用 cookie取代，但是很有肯能有人禁cookie（事实上还有人禁js）。

所以不能两全其美，暂时先用这个方案，有更好的方案就会替代之（//TODO，呵呵）。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航