c# jquery ajax 跨域 Get / Post調用webapi / webservice / wcf

1. 在webapi/webservice/wcf 項目中添加 Global.asax

2. 在Application_BeginRequest方法中添加如下代碼：

        protected void Application_BeginRequest(object sender, EventArgs e)
        {
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
            if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
            {
                HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept, Authorization");
                HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
                HttpContext.Current.Response.End();
            }
        }

3. 如果是webservice項目的話，在webconfig->system.web 節點下添加如下節點：

    <webServices>
      <protocols>
        <add name="HttpGet" />
        <add name="HttpPost" />
      </protocols>
    </webServices>

4. ajax get方式調用webapi：

$.ajax({  //ajax get方式調用webapi
                type: "GET",
                contentType: 'application/json',
                url: 'http://localhost:8082/api/Patient/GetPatientInfoById',
                data: { Id: "4343BF1C-5FD9-4ACE-BD90-26ED29C503C8" },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                },
                error: function (xhr) {
                    console.log(xhr.responseText);
                }
            })

5. ajax POST方式調用webapi

$.ajax({
                type: "POST",
                contentType: 'application/json',
                url: 'http://localhost:8082/api/Patient/SavePatient',
                data: JSON.stringify(model),
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                },
                error: function (xhr) {
                    console.log(xhr.responseText);
                }
            })

6. ajax get 調用webservice

$.ajax({      //ajax get 調用webservice
                type: "GET",
                contentType: 'application/x-www-form-urlencoded',
                url: 'http://localhost:8003/PatientService.asmx/GetPatientInfoByEmpiId',
                data: { empiId: "4343BF1C-5FD9-4ACE-BD90-26ED29C503C8" },        //encodeURI
                dataType: 'xml',
                success: function (data) {
                    console.log(data);
                },
                error: function (xhr) {
                    console.log(xhr.responseText);
                }
            })

7. ajax post 調用webservice

$.ajax({      //ajax post 調用webservice
                type: "POST",
                contentType: 'application/x-www-form-urlencoded',
                url: 'http://localhost:8003/PatientService.asmx/SavePatient',
                data: { patientInfoString: JSON.stringify(model) },        //encodeURI
                dataType: 'xml',
                success: function (data) {
                    console.log(data);
                },
                error: function (xhr) {
                    console.log(xhr.responseText);
                }
            })

 

8. ajax get 調用wcf

$.ajax({  //ajax get 調用wcf
                type: "GET",
                url: "http://localhost:36634/PatientService.svc/GetPatientInfoByEmpiId?empiId=209530010920",
                //data: JSON.stringify({ empiId: model.EmpiId }),
                contentType: "application/json",
                dataType: "json",
                processData: true,
                success: function (data, status, jqXHR) {
　　　　　　　　　　　　console.log(data);
                },
                error: function (xhr,data,b) {
                    console.log(xhr.responseText);
                }
            });

 

9. ajax post 調用wcf

$.ajax({   //ajax post 調用wcf
                type: "POST",
                url: "http://localhost:8081/PatientService.svc/SavePatient",
                data: JSON.stringify({ patientInfoString: JSON.stringify(model) }),
                contentType: "application/json",
                dataType: "json",
                success: function (data, status, jqXHR) {
                    var result = JSON.parse(data.d);
　　　　　　　　　　　　console.log(data);
                },
                error: function (xhr) {
                    console.log(xhr.responseText);
                }
            });