大佬教程收集整理的这篇文章主要介绍了一个通过JSONP跨域调用WCF REST服务的例子（以jQuery为例），大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
JSONP（JSON with Padding）可以看成是JSON的一种“使用模式”，用以解决“跨域访问”的问题，这篇简单的文章给出一个简单的例子用于模拟如何通过jQuery以JSONP的访问调用一个WCF REST服务。[源代码从这里下载]
在这个例子中，我们将定义一个用于返回所有员工信息的服务，下面是用于表示员工信息的employee的类型和契约接口。契约接口Iemployees的GetAll操作用以返回所有员工列表，我们指定了Uri模板并将回复消息格式设置为JSON。
1: using System.Collections.Generic;
2: using System.serviceModel;
3: using System.serviceModel.Web;
4: namespace Artech.Wcfservices.service.Interface
5: {
6: [serviceContract]
7: public interface Iemployees
8: {
9: [WebGet(UriTemplate = "all",ResponseFormat =Webmessageformat.Json)]
10: IEnumerable<employee> GetAll();
11: }
12: public class employee
13: {
14: public String Id { get; set; }
15: public String Name { get; set; }
16: public String Department { get; set; }
17: public String Grade { get; set; }
18: }
19: }
在如下所示的服务类型employeesservice 中，我们直接让服务操作GetAll返回一个包含3个employee对象的列表。
1: using System.Collections.Generic;
2: using Artech.Wcfservices.service.Interface;
3: namespace Artech.Wcfservices.service
4: {
5: public class employeesservice : Iemployees
6: {
7: public IEnumerable<employee> GetAll()
8: {
9: return new List<employee>
10: {
11: new employee{ Id = "001",Name="张三",Department="开发部",Grade = "G6"},
12: new employee{ Id = "002",Name="李四",Department="人事部",Grade = "G7"},
13: new employee{ Id = "003",Name="王五",Department="销售部",Grade = "G8"}
14: };
15: }
16: }
17: }
我们通过控制台程序对服务进行寄宿。从下面的配置可以看到我们采用了标准终结点WebhttpEndpoint。为了让服务具有跨域支持的能力，我们必须将标准终结点的crossDomainScriptAccessEnabled属性设置为True。WebhttpBinding也具有同名的属性，如果直接使用WebhttpBinding也需要将该属性设置为True。
1: <configuration>
2: <system.serviceModel>
3: <standardEndpoints>
4: <webhttpEndpoint>
5: <standardEndpoint crossDomainScriptAccessEnabled="true"/>
6: </webhttpEndpoint>
7: </standardEndpoints>
8: <bindings>
9: <webhttpBinding>
10: <binding crossDomainScriptAccessEnabled="true" />
11: </webhttpBinding>
12: </bindings>
13: <services>
14: <service name="Artech.Wcfservices.service.employeesservice">
15: <endpoint kind="webhttpEndpoint"
16: address="http://127.0.0.1:3721/employees"
17: contract="Artech.Wcfservices.service.Interface.Iemployees"/>
18: </service>
19: </services>
20: </system.serviceModel>
21: </configuration>
在客户端，我们在一个Web页面中通过jQuery进行Ajax调用这个服务，并将得到的员工列表显示在一个表格中。出CSS之外的页面代码如下所示，需要注意的是在进行Ajax调用的使用将dataType选项设置成“jsonp”，而不是“json”。
1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2: <html xmlns="http://www.w3.org/1999/xhtml">
3: <head>
4: <title>员工列表</title>
5: <style type="text/css">
6: ...
7: </style>
8: <script src="Scripts/jquery-1.7.1.js" type="text/javascript"></script>
9: <script type="text/javascript">
10: $(function () {
11: $.ajax({
12: type: "get",
13: url: "http://127.0.0.1:3721/employees/all",
14: dataType: "jsonp",
15: success: function (employees) {
16: $.each(employees,function (index,value) {
17: var detailUrl = "detail.html?id=" + value.Id;
18: var html = "<tr><td>";
19: html += value.Id + "</td><td>";
20: html += "<a href='" + detailUrl + "'>" + value.Name + "</a></td><td>";
21: html += value.Grade + "</td><td>";
22: html += value.Department + "</td></tr>";
23: $("#employees").append(html);
24: });
25: $("#employees tr:odd").addClass("oddRow");
26: }
27: });
28: });
29: </script>
30: </head>
31: <body>
32: <table id="employees" width="600px">
33: <tr>
34: <th>ID</th>
35: <th>姓名</th>
36: <th>级别</th>
37: <th>部门</th>
38: </tr>
39: </table>
40: </body>
41: </html>
以上是大佬教程为你收集整理的一个通过JSONP跨域调用WCF REST服务的例子（以jQuery为例）全部内容，希望文章能够帮你解决一个通过JSONP跨域调用WCF REST服务的例子（以jQuery为例）所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。