跨域请求

同源策略

同源是指,域名,协议,端口相同.

ajax直接请求,浏览器不支持同源策略,但是script标签浏览器默认支持同源策略,所以投机取巧,构建script标签模拟同源策略

JSONP

原生的模拟同源策略:

    function foo(s) {
       console.log(s);
       JSON.parse(s)
    }

    function kua_yu(url) {
             // 生成   script标签
            var $ele_script=$("<script>");
            $ele_script.attr("src",url);
            $ele_script.attr("class","kuayu");
            // 添加到body中
            $("body").append($ele_script);   // 发送请求
            $(".kuayu").remove()
    }

    $(".b2").click(function () {
         kua_yu( "http://127.0.0.1:8002/ajax_send/?callback=foo")
    });

基于jquery的API实现跨域请求

jsonCallback参数 需要方法(function)配合,也可以用另外一种方式, success.

$(".b2").click(function () {

         $.ajax({
           url:'http://www.jxntv.cn/data/jmd-jxtv2.html?',
           dataType:"jsonp",
           jsonp: 'callback',
           jsonCallback:"list"
       });

     });

function list(data) {
        console.log(data.data);
        $.each(data.data,function (i,weekday) {
            //console.log(j);  // {week: "周日", list: Array(19)}
            $("body").append("<p>"+weekday.week+"</p>");
            console.log(weekday.list);
            $.each(weekday.list,function (j,show) {
               s="<p><a href='"+show.link+"'>"+show.name+"</a></p>"
                $("body").append(s);

            })
        })
    }

 

posted @ 2018-03-01 21:44  丶迷城  阅读(49)  评论(0)    收藏  举报