JS跨域操作

很多网站只在登录的时候使用HTTPS协议来确保用户名和密码的安全传输，登录后的其他页面都采用HTTP。我也尝试将HTTPS登录的页面转到HTTP页面，点击登录按钮时，浏览器报如下的错误：

行: 17
字符: 58141
代码: 0
URI: https://192.168.0.35/test/gzip_N429717143/bundles/test.js

很是纳闷，一番搜索后，原来是因为浏览器不允许跨域操作。

什么是跨域操作
跨域操作就是post、get的url不是你当前的网站，域名不同。例如在aaa.com/a.html里面，表单的提交action是bbb.com/b.html。这个是浏览器的同源策略，浏览器会根据Domain name和协议(HTTP, HTTPS)来判断是否同源，具体请参考：http://en.wikipedia.org/wiki/Same_origin_policy。下表展现了各个URL是否与http://www.example.com/dir/page.html同源：

如何跨域
1. 跨域代理
所有需要从另外一个服务器上获取的数据，全部由后台从其他站点来获取数据，然后返回给客户端。这种方法会消耗服务器的性能。
2. document.domain，iframe
对于主域相同而子域不同的例子，可以通过设置document.domain的办法来解决。
3. 动态script标签
直接用JavaScript创建一个新的脚本标签，然后设置它的src属性为不同域的URL。www.a.com/a.html中的script 

var dynScript = document.createElement('script');
dynScript.src = 'http://www.b.com/b.js';
dynScript.setAttribute("type", "text/javascript");
document.getElementsByTagName('head')[0].appendChild(dynScript);

通过动态标签注入的必须是可执行的JavaScript代码，因此无论是你的数据格式是啥（xml、json等），都必须封装在一个回调函数中。一个回调函数如下： 

function dynCallback(data){
alert(data.content);
}

在这个例子中，www.b.com/b.js需要将数据封装在上面这个dynCallback函数中。

补充一下，只有登录使用HTTPS并不能达到保护用户名和密码的目的，因为后续的页面传输使用了HTTP，包含用户认证信息的Cookie仍然是未加密的。如果硬要从HTTPS页面跳转到HTTP页面，建议使用单点登录(SSO)。

本文参考：

http://www.2cto.com/kf/201111/110813.html

http://en.wikipedia.org/wiki/Same_origin_policy