通过脚本注入（JSONP）解决跨域访问原理分析

还记得之前为了解决跨域问题实现了一个简单的IIS，因为被说与需求不符合要求改成跨域访问的方式，所以必须要修改，于是就又进入了跨域访问的问题里，后来发现其实有一个更简单的跨域方法，也就是JSONP。给大家一个例子。

 $.ajax({
    type: "POST",
    url: " http://127.0.0.1:8890?link=1&jsoncallback=success",
    data: undefined,
    contentType: "application/json; charset=utf-8",
    async: true,
    dataType: "script",
    error: function(msg) {
        isClose = true;
    },
    success: function(data) { isClose = true; }
})

当然首先用jquery访问他帮我们处理了很多问题

function success(data) {
   alert(data);
}

脚本端就这些东西，然后是服务端的东西，在服务端如何丢数据出去？

Response.Write("success('123')");

“123”就是你希望抛给客户脚本端方法的数据还有要调用的方法。

看看是不是跨域访问时也alert出来了，顺便说一下，在实现IIS功能时发现jquery打包的请求，都是get包，那怕你前面设置为post最终收到的还是get包，查看jquery实现发现jquery为了解决跨域访问的问题在发现为跨域访问时强制改成了get包而不管你如何设置。这个也给我一个提醒，如果要跨域时必须使用get包，这点也要注意。

之前没有弄明白jsonp的原理，以为jsoncallback这个东西是关键其实不是，通过跟踪jquery发现，其原理其实非常的简单。

在所有的标签里script是可以跨域访问的，这个方法其实也就是利用了这一点。比如，下面的例子，我们希望跨域得到 www.abc.com的返回内容，为了做到这一点我们用script标签，并将标签的src属性设置为跨域地址，如下
<script src=' www.abc.com/ccc.aspx'>

大家发现没有通常情况下script的src属性一般指向js文件这次指向一个aspx文件，大家从这里可能已经发现问题的关键了，其实所谓脚本注入简单的讲就是通过访问一个地址这个地址的程序会向目标发送脚本比如(success('aaa'))，这样当脚本载入完毕就会执行，也就跨域调用到了方法（因为脚本内容是另一个域中的程序写的，但是却在我的域中来执行）。这个也同时解释了为什么跨域访问时我的服务端每次收到的都是get包了。