1. 程式人生 > >jquery呼叫Web API提示"parseerror"

jquery呼叫Web API提示"parseerror"

win7+vs2015

介面是:ASP.NET Core1.0  Web API專案 方法是

[HttpGet]
        public List<Person> Get()
        {
            List<Person> list = new List<Person>() { new Person { tname = "ffdfd", name = "name" }, new Person { tname = "fdfd", name = "name2" } };
           
            return list;
        }

public class Person
    {
        public string tname { get; set; }
        public string name { get; set; }
    }

新建一個web專案

建立一個index.html呼叫api介面

方法是:$.ajax({
                url: url, //請求的url
                dataType: "json",
                //jsonpCallback: "jsonpCallback",
                success: function (json) {
                    alert(json[0].tname);
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                            alert(XMLHttpRequest.status);
                            alert(XMLHttpRequest.readyState);
                            alert(textStatus);
                        }
            });

但是status=0  readyState=0 請求失敗

通過在網上查詢發現很多的方法提示需要跨域請求如

 $.ajax({
                url: url,
                dataType: 'jsonp',
                jsonp: 'callback',//回撥函式名字
                jsonpCallback: 'success_jsonpCallback',//可以不寫,也可以自定義,用來取代 jQuery 自動生成的隨機函式名,不寫將由jq自動生成,每次生成的結果都不一樣
                // processData: true,
                type: 'get',
                success: function (json) {
                    console.log(json);
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.status);
                    alert(XMLHttpRequest.readyState);
                    alert(textStatus);
                }
            });

結果是:status=200 readyState=4,響應成功但是提示“parseerror”,一直以為的是html頁面的ajax請求有問題,試了很多方法,大同小異,都是parseerror

今天在群裡有人提示我是不是在Web API裡沒有設定跨域的問題呢?

在網上找到一段程式碼,在web.confign檔案裡的<system.webServer>里加上以下程式碼

<httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="*" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE" />
      </customHeaders>
    </httpProtocol>

,然後用 $.ajax({
                url: url, //請求的url
                dataType: "json",
                success: function (json) {
                    alert(json[0].tname);
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                            alert(XMLHttpRequest.status);
                            alert(XMLHttpRequest.readyState);
                            alert(textStatus);
                        }
            });

再次請求,就可以得到json裡的資料了。