菜鳥的 asp.net jsonp簡單應用

簡單介紹下，jsonp是一種用來進行跨域傳輸信息的方法，不是json的親戚。

 

具體方法如下

客戶端：

                $.ajax({
                    url: "testPage.aspx",
                    jsonp: "callback",
                    type: "get",
                    dataType: "jsonp",
                    data: { "studentCode": "5", "batch": "2001" },
                    success: function (result) {
                        alert(result.message);
                    },
                    error: function () {
                        alert("發送失敗");
                    }
                });

看起來只是像普通的ajax方法，不過里面加上了回傳函數的方法名“jsonp”參數

這是用來用jsonp的形式回傳信息用的，jquery會根據這個callback參數取其中的內容。

 

客戶端方法：

        protected void Page_Load(object sender, EventArgs e)
        {
            string studentCode = Request.QueryString["studentCode"];
            string batch = Request.QueryString["batch"];
            string callback = Request.QueryString["callback"];

            var msg = new {message="收到！" };
            string result = new JavaScriptSerializer().Serialize(msg);
            Response.Write(callback+"("+result+")" );
        }

注意在使用jsonp的時候要注意接收 ajax中寫好的方法名參數，剛才上面寫的是"jsonp:'callback'"所以在服務端要取callback

在回傳的時候要以  ajax中的jsonp參數+(+結果值+) 的形式返回，

 

運行一下剛才的網頁，會發現jquery會以

testPage?callback=jQuery110207458065936286827_1445175684208&studentCode=5&batch=2001&_=1445175684213 HTTP/1.1

的方式像服務端發送請求，此時jquery已經將callback值寫好

callback=jQuery110207458065936286827_1445175684208

這樣jsonp就可以正常工作了

 

注意：

我在剛用ajax的時候沒有注意大小寫，$.ajax()方法的參數名對大小寫還是很敏感的，尤其是dataType，一定要Type大寫data小寫

否則會不起作用，怎么寫都回傳的是字符串格式。當時還疑惑為啥別人回傳jsonp是json格式 result.message就可以取值了，而我寫的

jsonp返回來的是callback(result:message)，當時就是寫的datatype的結果。

 

注意返回值一定是json格式，並且在斷點調試的時候 獲得的jsonp參數值也就是上面的callback，一定能夠取到值類似"jQuery110207458065936286827_1445175684208"，而不是 null，如果是null 那么說明你的ajax方法寫的有問題，趕緊去貼個

方法再試試，否則會走很多彎路。