ASP.NET Web API 跨域訪問

標籤：

情景：http://localhost:8080/的web應用下訪問http://localhost:8081下的Action時稱為跨域訪問。

        前提，啟動8080web應用執行個體，再啟動8081web應用執行個體利用ajax去訪問。 

 

首先，在自己的Web API應用中，添加NuGet服務包，聯機：

 

 然後選擇圖中的，安裝：

 

 

 在Web API應用的App_Start/WebApiConfig.cs下的

        public static void Register(HttpConfiguration config)        {}

下最後添加一句代碼： 

config.EnableCors(new EnableCorsAttribute("*", "*", "*") { SupportsCredentials = true, PreflightMaxAge = 600 });

 

然後在8080下的cshtml 或html頁面利用ajax訪問：

 

 

     <script type="text/javascript">
         $(function () {

            Index_Get();
        });
        
        Index_Get = function () {
            $.ajax({
                url: "http://localhost:1687/Api/Console/Index_Get",
                type: "post",
                data: JSON.stringify({}),
                //dataType: "json",//表示傳回值類型，不必須
                contentType: "application/json;charset=utf-8",//必須有,請求類型
                success: function (o) {
                    alert(o);
                },
                error: function (o) {
                    alert("您好，您做錯了");
                },
                processData: false
            });
        }
    </script>

 processData預設值: true。預設情況下，通過data選項傳遞進來的資料，如果是一個對象(技術上講只要不是字串)，都會處理轉化成一個查詢字串，以配合預設內容類型 "application/x-www-form-urlencoded"。如果要發送 DOM 樹資訊或其它不希望轉換的資訊，請設定為 false。

 

 

  $.ajax({

            url:url,
            data:JSON.stringify(data),
            success: function (data, textStatus, jqXHR) {
                if (typeof (success) == "function") {
                    success(data, textStatus, jqXHR)
                }
            },
            error:function(jqXHR, textStatus,errorThrown ){
                if(typeof(error)=="function"){
                    error(jqXHR,textStatus,errorThrown);
                }
            },
            xhrFields: {
                withCredentials: true
            },
            headers: {
                "Authorization": "PlatformAuth " + App.Setting.AuthToken,
            },
            contentType: "application/json",//請求類型為json格式
            cache: "false",
            type: "POST",
            processData: false,//是否將ajax中的JSON.stringify({})轉換為?a=f&b=g形式
        }) 

 

ASP.NET Web API 跨域訪問