WCF远程跨域调用的研究

有段时间没写博客了,今天写一篇Jquery远程调用WCF的文章.

这篇文章也是参考了网上一些其它博客、贴子并同时结合自己在实际中使用之后,整理后得出的这样一篇文章,如有什么问题,大家可以一起拿出来讨论.

在使用Jquery远程调用WCF这个功能时候,我也在网上查了好些博客或贴子,很大一部分都是在项目中建立svc文件，并通过url: '/WCFservice.svc/Method'这种方式调用,后面经过一番努力后,

终于查到下面这篇文章,http://blog.csdn.net/xqf222/article/details/9565875.

后我将上面的源码下载下来后,按博客上所说,我一步步作实际验证.如看到此贴大家也可以按照上述链接去尝试.

之后我按照上述尝试后,还是不行,为什么不行，我下面一步一步来说.

1、看下面ICutomerService契约中定义的两个方法

[OperationContract] 
[WebInvoke(Method = "GET", UriTemplate = "Customer/{CustomerID}", BodyStyle = WebMessageBodyStyle.Wrapped, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)] 
Customer GetCustomerByCustomerID(string CustomerID); 

[OperationContract] 
[WebInvoke(Method = "GET", UriTemplate = "AllCustomers", BodyStyle = WebMessageBodyStyle.Wrapped, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)] 
IList<Customer> GetAllCustomer();

[OperationContract] 
[WebInvoke(Method = "GET", BodyStyle = WebMessageBodyStyle.Wrapped, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)] 
int InsertCustomer(string customer);

2、看Jquery Ajax函数

function getCustomerInfo() { 
    //var sendData = '{"CustomerID":"' + document.getElementById('CustomerID').value + '"}'; 
    $.ajax({ 
          type: "get", 
          url: http://172.16.4.169/WcfServiceTest/WcfService.svc/AllCustomers?jsoncallback=?, 
          contentType: "application/json; charset=utf-8", 
          dataType: "jsonp", 
          success: function (customers) { 
             $.each(customers, function (index, value) { 
               alert(index); 
               alert(value); 
            }) 
          }, 
          error: function (XMLHttpRequest, textStatus, errorThrown) { 
               alert(XMLHttpRequest.responseText);    ///输出返回什么东东，感觉是不符合json标准定义的字符串 
               alert(XMLHttpRequest.status); 
               alert(XMLHttpRequest.readyState); 
               alert(textStatus); 
          } 
    }); 
}

3、看下面契约具体的实现类中的定义的方法

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
[ServiceBehavior(InstanceContextMode = InstanceContextMode.PerCall)]
[JavascriptCallbackBehavior(UrlParameterName = "jsoncallback")]
public class CustomerService : ICustomerService

4、看web.config

<standardEndpoints> 
      <webHttpEndpoint> 
        <standardEndpoint crossDomainScriptAccessEnabled="true"/><!-- 跨域配置 –> 
      </webHttpEndpoint> 
  </standardEndpoints> 
  <bindings> 
     <webHttpBinding> 
       <binding name="webBinding"> 
       </binding > 
     </webHttpBinding> 
  </bindings> 
  <services> 
     <service behaviorConfiguration="ServiceBehavior" name="WcfService.WcfRestfulService.CustomerService"> 
       <endpoint behaviorConfiguration="endpointBehavior" binding="webHttpBinding" kind="webHttpEndpoint" 
          contract="WcfService.WcfRestfulService.ICustomerService" /> 
       <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" /> 
     </service > 
  </services>

上面四点很重要,分别解释下.

第1点使用http://172.16.4.169/WcfServiceTest/WcfService.svc这种跨域远程调用的方式,目前根据我的测试以及Artech的解说,只支持GET请求.

第2点看Jquery中的dataType="jsonp",这种就是远程跨域服务的数据类型,在我测试过程中如果使用其它dataType,如json,都无法返回正确数据.

这个是参考Artechr的文章http://www.cnblogs.com/artech/archive/2012/01/16/jsonp-wcf-rest.html

大家可以去看下.

第3点着重说下,JavascriptCallbackBehavior这个类,这个类的解释:可以使用此行为将 URL 查询字符串参数名称设置为不同于默认的“callback”的某个名称,

网上有的说这个一定要定义,其实不一定.

首先说不定义的,将第2点的url改为url: http://172.16.4.169/WcfServiceTest/WcfService.svc/AllCustomers,用firebug调试看下:

响应流中有返回有数据,但是但是Url变了,在AllCustomers后面自动加入了callback参数。

如果在CustomerService类中加入JavascriptCallbackBehavior定义,就需要如

url: http://172.16.4.169/WcfServiceTest/WcfService.svc/AllCustomers?jsoncallback=?进行设置,要不然自动产生的callback和jsoncallback不匹配,无法正常返回数据.

不过像这种GET方式,在Url中加入参数,是可以,但是如果稍微复杂的数据该如何处理呢?

看下InsertCustomer(string customer)这个方法,这个方法如果正确执行后,会返回1.

在Jquery Ajax的InsertCustomerInfo方法中,加上data请求数据如下图:

看下请求Url会变为上图中显示的那样.再看下图的响应数据

最后在Success方法中返回1.

最后看下数据库是否正确插入数据

最后说下第4点要配置crossDomainScriptAccessEnabled为ture,这样支持跨域远程调用,另外在<endpoint kind="webHttpEndpoint">,kind的意思在网上也查了下

kind:一个字符串，指定应用的标准终结点的类型。

将上述几点全部解决后，那就可以正确使用Jquery远程跨域调用WCF Restful.

这篇就讲到这里，如果各位看到后有何疑问，大家可以一起探讨.

posted on 2013-12-06 12:12 tzj19810812 阅读(559) 评论(1) 编辑收藏举报

刷新页面返回顶部

WCF远程跨域调用的研究

公告