使用jsonp跨域请求

一、异步对象，不能实现跨域请求

在站点A中访问站点B的数据：

站点A代码：

    window.onload = function () {
            document.getElementById("btnAjax").onclick = doAjax;
        }
        function doAjax() {
            var xhr = new XMLHttpRequest();
            xhr.open("get", "http://www.ruanmou.net/C01Target.ashx", true);
            xhr.setRequestHeader("If-Modified-Since", "0");
            xhr.onreadystatechange = function () {

                if (xhr.readyState == 4 && xhr.status == 200) {
                    var res = xhr.responseText;
                    alert(res);
                }
            };
            xhr.send(null);
        }

<input type="button" value="使用异步请求跨域请求是错的" id="btnAjax" />

站点B代码：

C01Target.ashx中：

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Write(“hello world”);
        }

二、使用script标签实现跨域请求

站点A代码：

 <script type="text/javascript" src="http://www.ruanmou.net/C01Target.ashx?callback=showData"></script>

 function showData(data) {
            for (var key in data) {
                alert(data[key]);
            }
        }

站点B代码：

C01Target.ashx中：

public void ProcessRequest(HttpContext context)
        {
            string funName = context.Request.Params["callback"];
            context.Response.ContentType = "text/plain";
            string strDate = funName+"({"name":"Xuj","age":"18"})";//返回数据为json格式
            context.Response.Write(strDate);
        }

 三、jquery使用jsonp实现跨域请求

站点A代码：

window.onload = function () {
            document.getElementById("btnAjax").onclick = doAjax;
        }
        function doJq() {
            $.ajax("http://www.ruanmou.net/C01Target.ashx"), {
                type: "get",//内部就是创建一个script标签
                jsonp:"callback",//传的参数名，和服务器端一致
                dataType: "jsonp",//指定回调的函数名
                jsonCallback: "showData",
                success: function () {
                    alert("11111");
                }
            });
        }

function showData(data) {
            for (var key in data) {
                alert(data[key]);
            }
        }