跨域问题产生的原因和解决方法

一. 产生的原因

1. 什么是跨域

跨域是指A网页想要获取B网页的资源，如果A、B页面的协议、域名、端口号、子域名不同，所进行的访问都是跨域的，而浏览器一抖为了安全都限制了跨域访问。

跨域是指浏览器不执行其他页面脚本，是由于同源策略造成的，是对Javascript的一种安全限制

2. 什么是同源策略

同源是指协议、域名、端口都保持一致

http://www.baidu.com:8080/index.html （http协议，www.baidu.com 域名、8080 端口 ，只要这三个有一项不一样的都是跨域，这里不一一举例子）

http://www.baidu.com:8080/matsh.html（不跨域）

http://www.baidu.com:8081/matsh.html（端口不一样，跨域）

注意：localhost 和127.0.0.1 虽然都指向本机，但也属于跨域

二. 解决方案

1. JSONP

• JSONP是一个非官方协议，它允许在服务器集成script tags返回客户端，通过javascript callback的形式实现跨域访问
• 基本思想：网页通过添加一个<script>元素，向服务器请求JSON数据，这种做法不受同源策略限制；服务器收到请求后，将数据放在一个指定名字的回调函数里穿回来。

    <script type="text/javascript">
        function jsonpCallback(result){
            //alert(result);
            for(var i in result){
                alert(i + ":" + result[i]);     //循环输出
            }
        }
        var JSONP = document.createElement("script");
        JSONP.type = "text/javascript";
        JSONP.src = "http://crossdomain.com/services.php?callback=jsonpCallback";
        document.getElementsByTagName("head")[0].appendChild(JSONP);
    </script>

• 缺点：get请求，前后端都要修改

2. 修改配置实现Chrome跨域访问

右键chrome.exe，选择属性，选择快捷方式，在目标输入框加上 --disable-web-security --user-data-dir=D:chromeCache ，注意需要增加一个空格。