ajax,json学习笔记（四）跨域

1、域名

    域名的组成：http://   www .    abc.com : 8080   /   scripts/jquery.js
            协议      子域名   主域名    端口号     请求资源路径

    当协议、子域名、主域名、端口号中的任意一个不相同，都算作不同域
    不同域之间相互请求资源，就算作‘跨域’
    比如 http://www.abc.com/index.html 请求 http://www.efg.com/service.php
     localhost和127.0.0.1也不是一个域名

    例子：已拦截跨源请求：同源策略禁止读取位于 http://127.0.0.1:8080/MyFirstSSM/jQUeryTest 的远程资源

2、跨域

    JavaScript处于安全方面的考虑，不允许跨域调用其他页面的对象，其实就是因为浏览器同源策略的限制
    a.com域名下的js无法操作b.com域名下的对象

3、处理方法一——代理

    在同域名的web服务器端创建一个代理
    在后端创建一个代理请求b处的资源，再返回到a处的前端

4、处理方法二——JSONP

    JSONP 可用于解决主流浏览器的跨域数据访问的问题，只能处理get请求
    例子
        在www.aaa.com页面中;声明
        <script>
            function jsonp(){
                alert(json["name"])'
            }
        </script>
        <script src="http://www.bbb.com/jsonp.js"></script>

        在www.bbb.com中;调用
        jsonp({'name':'洪七','age':24})
    通过script的跨域载入另外一个域名的js

    jQuery的ajax本身支持JSONP的跨域处理

        前端改造：ajax中    dataType:'jsonp',
                    jsonp:'callback',//任意值
        后台改造：java中    // 获取jsonp
                        String Jsonp = request.getParameter("callback");
                    // 把jsonp和要返回的数据拼接就好了
                    String data = Jsonp+"("+jsonResult+")"
        实际上传递过去的jsonp是jQuery1113037598283385923337_1510404839158
        最终得到的是jQuery1113037598283385923337_1510404839158([{"id":1,"name":"category1"}])
    但是只能处理get请求，就算写成post最终为get请求

5、处理方法三——XHR2

    HTML5提供的XMLHttpRequest level2 实现了跨域访问异界其他功能，IE10以下不支持
    在服务端改造即可
        response.setHeader("Access-Control-Allow-Origin", "*");//*所有域名都能访问
        response.setHeader("Access-Control-Allow-Methods", "POST,GET");