JSONP跨域

浏览器同源策略

同源策略

同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源。所以xyz.com下的js脚本采用ajax读取abc.com里面的文件数据是会被拒绝的。

同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的重要安全机制。

只有协议，域名，端口，都相同才属于同源；

jsonp跨域

原理：src属性不受同源策略限制
通过接口文档把回调函数名称传递过去，后台处理后处理并返回函数立即执行的形式传入过来。

<button id="btn">点击</button>
    <button id="btn1">点我</button>
    <script>
        var obtn = document.getElementById('btn');
        obtn.onclick = function(){
            var oscript = document.createElement('script');
            oscript.src = 'http://vip.chanke.xyz/git/chanke/demo.txt';
            document.body.appendChild( oscript);
        }
        function cbs(data){
            console.log(data);
        }
        var obtn = document.getElementById('btn1');
        obtn.onclick = function(){
            var oscript = document.createElement('script');
            oscript.src = 'https://www.baidu.com/sugrec?pre=1&p=3&ie=utf-8&json=1&prod=pc&from=pc_web&wd=baidu&bs=%E7%99%BE%E5%BA%A6&csor=5&pwd=b&cb=callbacks&_=1561540850499'
            document.body.appendChild(oscript);
        }
        // 以接口文档为主，把回到函数作为参数传递给后台
        function callbacks(data){
            console.log(data);
        }
    </script>