解决跨域问题的几种方式

首先,非常感谢阿亮在这一问题的处理上教予我的多种解决方案,有不足之处,望指正。

关于ajax跨域问题,相信是老生常谈的话题了。处理跨域问题的方法也有很多。既然要说一种全新的解决跨域问题的方法,首先要说的就是什么是跨域,为什么会存在跨域的问题。

什么是跨域

跨域问题之所以存在,是因为有同源策略的存在,所谓同源策略,就是协议、域名、端口号三者必须相同。

- 举个栗子
- http:// www . google : 8080 / script/jquery.js
- http://(协议号)
- www    (子域名)
- google (主域名)
- 8080   (端口号)

这是一种约定,在各浏览器之间,执行脚本的时候检测脚本是来自哪一方,只有同源的脚本才能正常执行。这就是跨域问题的存在。

跨域问题的几种解决办法及优劣

flash URLLoader插件

flash有一套自己的安全策略,服务器可以通过crossdomain.xml文件来声明能被哪些域的SWF文件访问,SWF也可以通过API来确定自身能被哪些域的SWF加载。

缺点: 这种方法相比较来说比较古老,而且不能够实现iOS跨域。

DOM

利用文本对象模型来解决跨域的问题。

图像PING__

比如说img标签,它有一个src属性,该属性下的图片可以是一个HTTP:// … .jpg的图片,实际上这已经是跨域操作了,但该src下既然可以放一个图片,思维放大一些,是不是也可以 .html? 或许会出现一个裂的图片格式,但再在脚本里用DOM createElement一个img元素,onerror抛出异常,onload加载出页面。(有兴趣的童鞋可以试一下,没毛病。)

同理,既然img标签可以,那么iframe,link,script这些标签是不是也可以实现呢?答案是肯定的。利用script标签,就有了下面要说的JSONP

JSONP

也许有同学会问了,因为同源策略,非同源的脚本文件是阻止加载的,那为什么还会有利用script脚本来解决跨域的?这页正是JSONP的秘密所在。

首先,JSONP的基本原理就是利用script的历史遗迹(没有跨域限制)来实现的。
要解决跨域问题时,在本站script中创建一个地址指向第三方的API网址,并提供一个回调函数来指向接收的数据,这样本站就可以解析callback函数传递并解析数据了。

缺点 : 上述几种方法,都只能用于get请求不能用于post,且也不能传递cookie。

Cors

通过设置access-Control-allow-origin.简单来说,就是将需要的请求放在请求头,使用自定义的HTTP头部让浏览器进行沟通,只需要处理onerror和onload来确定失败或是成功。请求头是多个的,所以可以有效的解决跨域问题。

缺点 : 不能传递cookie。

下面说的这种方法,个人感觉不但可以完美的解决跨域问题(或者说都不存在跨域问题).
而且无论是get还是post请求都可以,当然了,cookie也是可以传递的。

反向代理

反向代理,是指以代理服务器来接收internet上的链接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给Internet上请求链接的客户端。

我用反向代理是借用的nginx服务器。下面就是服务器的配置了。

注意代码缩进。

>  location /ltf/{ #代理
    proxy_pass http://192.168.199.241:80/php-h5/v1.0/;
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }