正是“同源策略”导致客户端脚本无法跨域请求数据,而解决问题的是JSONP(JSON with Padding)。JSONP是一个非官方的协议，它允许在服务器端集成Script tags返回至客户端，通过javascript callback的形式实现跨域访问（这仅仅是JSONP简单的实现形式）。

理解同源策略限制

同源策略是对于客户端脚本(如JavaScript)的重要安全度量标准。其目的是阻止代码获得或者更改从另一个域名下获得的文件或者信息，也就是说我们 的请求地址必须和当前网站的域相同。这个策略首先出自Netscape Navigator2.0，之后历经Navigator2.01和Navigator2.02的修正完善。

JSONP如何使用

1. 在客户端调用提供JSONP支持的URL Service，获取JSONP格式数据。
假设donmain-A的接口http://www.domain-A.com/api.php?jsonp=###用以提供数据，返回数据形如{"name":"ckqee"}。
这个“jsonp”是服务提供端规定好了参数，“###”是调用者回调的函数，是调用者决定的，请求地址可以像这些：
    http://www.domain-A.com/api.php?jsonp=show_name
    http://www.domain-A.com/api.php?jsonp=pop_name
然后我们从服务端收到的真正返回数据是:
    show_name({"name":"ckqee"})
    pop_name({"name":"ckqee"})

在客户端需要做的就是定义好show_name或者pop_name

    function show_name(jsondata) {
        document.getElementById("name").innerHTML = jsondata.name;
    }

 服务器返回的这个字符串被嵌入在一个<script>标签里执行，可以调用这样的代码：
<script type="text/javascript" src="http://www.domain-A.com/api.php?jsonp=show_name" />

我们可以选择动态插入Javascript代码（Dynamic Javascript Insertion）自由地控制何时获取服务器数据。动态插入的js代码加载执行的时候，同源策略不会限制。

所谓的动态插入代码：
<script>
    var url = "http://www.domain-A.com/api.php?jsonp=show_name";
    var script = document.createElement('script');
    script.setAttribute('src', url);
    document.getElementsByTagName('head')[0].appendChild(script);
</script>

jQuery从1.2以后，可以使用ajax进行跨域请求，其实时就是使用了JSONP+动态插入代码。jQuery会在window对象中加载一个全局的函数，当代码插入时函数执行，执行完毕后就会被移除。同时jQuery还对非跨域的请求进行了优化，如果这个请求是在同一个域名下，那么他就会像正常的Ajax请求一样工作。