跨域jQuery Ajax请求& WCF REST服务

时间:2012-04-10 21:04:42

标签: jquery wcf rest jsonp

我正在调用(Ajax请求)WCF REST服务,该请求是跨域请求。

如果我在同一个域中部署我的服务,一切都像奶油一样。最终在生产中,该服务将位于不同的域中。

我正在使用jQuery 1.5.2。我的服务给我一个错误说:

errorThrown: "jQuery15208493315000087023_1334089616458 was not called"
textStatus: "parsererror"

虽然在Firefox中我可以看到JSON值,但执行属于Ajax请求的错误处理程序。

我的Ajax请求是:

function CallService() {
    $.ajax({
        type: "GET", 
        url: "http://SomeService/EmpService.svc/GetValues?dv=1455",
        contentType: "application/json; charset=utf-8",
        dataType: "jsonp", 
        processdata: false,            
        success: function (data) {
            ServiceSucceeded(data);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            debugger;
            alert("Service Error");
            ServiceFailed(jqXHR, textStatus, errorThrown);
        }
    });
}

在WCF服务端,我已将CrossDomainScriptAccess配置为true:

<webHttpBinding>
  <binding name="webHttpBindingWithJsonP"
           crossDomainScriptAccessEnabled="true" />
</webHttpBinding>

我从服务器获得的JSON响应是:

[{"Message": "Stop On Duty", "MessageTime": "\/Date(1334068773893-0500)\/"},
 {"Message": "Start On Duty", "MessageTime": "\/Date(1334068763540-0500)\/"},
 {"Message": "App_testing_4102012924am", "MessageTime": "\/Date(1334068533627-0500)\/"},
 {"Message": "Kunal_testing_4102012924am", "MessageTime": "\/Date(1334067945510-0500)\/"},
 {"Message": "Alert: Door Open", "MessageTime": "\/Date(1334066280963-0500)\/"}]

我在设置中遗漏了什么。如果将服务移动到同一个域,则整个代码可以正常工作。

我调查了类似的帖子,但无法完成这项工作。

3 个答案:

答案 0 :(得分:5)

我自己想通了。解决方案是修改包含服务详细信息的配置文件

我在配置文件中添加了标准端点和绑定

<standardEndpoints>
      <webScriptEndpoint>
       <standardEndpoint crossDomainScriptAccessEnabled="true">
       </standardEndpoint>
      </webScriptEndpoint>
      </standardEndpoints>



  <bindings>

  <webHttpBinding>
    <binding name="webHttpBindingWithJsonP"
             crossDomainScriptAccessEnabled="true" />
  </webHttpBinding> 

答案 1 :(得分:2)

我还需要添加<webHttpEndpoint>才能让它发挥作用:

<standardEndpoints>
    <webHttpEndpoint>
        <standardEndpoint crossDomainScriptAccessEnabled="true"></standardEndpoint>
    </webHttpEndpoint>
    <webScriptEndpoint>
         <standardEndpoint crossDomainScriptAccessEnabled="true"></standardEndpoint>
    </webScriptEndpoint>
</standardEndpoints>

<bindings>
    <webHttpBinding>
        <binding name="webHttpBindingWithJsonP" crossDomainScriptAccessEnabled="true" />
    </webHttpBinding>
</bindings>

答案 2 :(得分:0)

 [OperationContract]
    [WebGet( ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Bare, RequestFormat=WebMessageFormat.Json,
    UriTemplate = "GetEmployeeJson")]
     List<EmployeeData> GetEmployeeJson();

Web.config

  <bindings>
      <webHttpBinding>
          <binding name="webHttpBindingWithJsonP"
                   crossDomainScriptAccessEnabled="true" />
      </webHttpBinding>
  </bindings>
  <behaviors>
      <serviceBehaviors>
          <behavior name="WcfExample.Service1Behavior">
              <serviceMetadata httpGetEnabled="true"/>
              <serviceDebug includeExceptionDetailInFaults="true"/>
          </behavior>
      </serviceBehaviors>
      <endpointBehaviors>
          <behavior name="WebBehavior">
              <webHttp/>
          </behavior>
      </endpointBehaviors>
  </behaviors>
  <services>
      <service behaviorConfiguration="WcfExample.Service1Behavior" name="WcfExample.Service1">
          <endpoint address="" binding="webHttpBinding" contract="WcfExample.IService1" bindingConfiguration="webHttpBindingWithJsonP" behaviorConfiguration="WebBehavior" />
      </service>
  </services>

Jquery ajax调用wcf服务

  $.ajax({
            type: "GET",
            contentType: "application/javascript",
            crossDomain: true,
            dataType: 'jsonp',
            cache: true,
            url: 'http://localhost:49349/Service1.svc/GetEmployeeJson',
            success: function (data) {
                var html = [];

                alert(data[0].lastname);


                $.each(data, function (index, value) {
                    $("#TableID").append("<tr><td>" + value.HREmpId + "</td><td>" + value.firstName + "</td><td>" + value.lastname + "</td><td>" + value.address + "</td><td>" + value.city + "</td></tr>");

                });


            },

            error: function (xhr, ajaxOptions, thrownError) {
                alert("here error");
                alert(thrownError);
                if (xhr != null) {

                    var err = JSON.parse(xhr.responseText); //you can throw a code-behinde Exception and it will automatically                                                 //render to a valid JSON string when we rerieve the responseText
                    alert("ErrorMessage: " + err.Message + " StackTrace: " + err.StackTrace);

                }
            }
        });