jsonp 知识整理

在 localhost 这个域名下的应用，如果想直接访问 127.0.0.1 这个域名下的应用是不可以的，这是基于浏览器的安全机制，我就引出了应用间跨域访问的问题。

<script type="text/javascript">
    function getData(data){
        alert(data.username + " => " + data.password);
    }
</script>
<script type="text/javascript" src="http://124.232.163.178:8080/liwei02/02.js"></script>

代码片段1

其中 http://124.232.163.178:8080/liwei02/02.js 这个 js 里面的内容是

getData({"username":"liwei","password":"123456"});

上面的这行代码相当于调用了一个函数，这个函数是 代码片段1 中定义的 getData 函数。

如果我们使用 jquery 的 ajax 函数，也是可以支持 jsonp 的调用，下面的示例代码：

<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
<script type="text/javascript">
    $.ajax({
        type: "POST",
        dataType: "jsonp",
        url: "http://124.232.163.178:8080/liwei02/02.js",
        jsonpCallback: "getData",
        success: function(data){
            alert("成功获取：" + data.username + " ** " + data.password);
        }, 
        error: function (XMLHttpRequest, textStatus, errorThrown) { 
            alert("获取失败"); 
        } 
    });

jquery 还提供了一个 getJSON 函数可以实现 jsonp “协议的调用”。