Jquery Ajax Access WCF services and Cross-domain access WCF

The code is as follows

Copy Code

Using jquery ajax call WCF service Get/post/put/delete Http://www.codeproject.com/Articles/254714/Implement-CRUD-operations-using-RESTful-WCF-Servic Using POST method Retrieve a representation of the addressed member of the collection, in the example below, create a new entry in the Colle Ction. Collapse | Copy Code $.ajax ({ Type: "POST", URL: "services/efservice.svc/members/", Data: "{Email: ' test@test.com ', screenname: ' TestUser '}", ContentType: "Application/json; Charset=utf-8 ", DataType: "JSON", Success:function (data) {//Play with response returned in JSON format}, Error:function (msg) { Alert (msg); } }); Using Put method Update the entire collection with another collection, in the example below, update the addressed. Collapse | Copy Code $.ajax ({ Type: "Put", URL: "services/efservice.svc/members/", Data: "{Email: ' test@test.com ', screenname: ' TestUser '}", ContentType: "Application/json; Charset=utf-8 ", DataType: "JSON", Success:function (data) {//Play with response returned in JSON format}, Error:function (msg) { Alert (msg); } }); Using DELETE method Delete the entire collection or a specific collection, in the example below, and delete member with id=1. Collapse | Copy Code $.ajax ({ Type: "DELETE", URL: "Services/efservice.svc/members (1)", Data: "{}", ContentType: "Application/json; Charset=utf-8 ", DataType: "JSON", Success:function (data) {//Play with response returned in JSON format}, Error:function (msg) { Alert (msg); } });

JQuery Ajax invoke WCF services across domains

Here is the contract layer interface:

The code is as follows

Copy Code

Namespace Valor.ValorCom.Contracts { [ServiceContract (Name = "Navservice", Namespace = "www.valorcomm.com")] public interface Inavservice { <summary> Add Order </summary> <param name= "OrderId" > Order number </param> <returns></returns> [WebInvoke (method = ' get ', bodystyle = webmessagebodystyle.wrappedrequest, Responseformat = Webmessageformat.json, Requestformat = Webmessageformat.json)] String Addorderfornav (int orderId); } }

1th Note: The specified service can be invoked through get, and the format of the request and response is JSON.

The following are service classes:

The code is as follows

Copy Code

Namespace Valor.ValorCom.Services { [Aspnetcompatibilityrequirements ( Requirementsmode = aspnetcompatibilityrequirementsmode.allowed)] [Javascriptcallbackbehavior (Urlparametername = "Jsoncallback")] public class Navservice:inavservice { Public Navservice () { } <summary> Add Order </summary> <param name= "OrderId" > Order number </param> <returns></returns> public string Addorderfornav (int orderId) { string result = ""; if (Common.turnnav ()) { Add Order related code } Else { result = "The interface for synchronizing orders with the NAV system is not open"; } return result; } } }

2nd note, must add [Javascriptcallbackbehavior (urlparametername = "Jsoncallback")], for JavaScript callback use, Urlparametername Sets the name of the URL query string parameter used for Cross-domain scripting access. [Aspnetcompatibilityrequirements (Requirementsmode = aspnetcompatibilityrequirementsmode.allowed)] For ASP.net pipeline compatibility, this service can be invoked across domains through jquery ajax, and ASP.net programs can also be invoked by the agents that generate the service. The following are profile information

The code is as follows

Copy Code

<?xml version= "1.0"?> <configuration> <system.web> <compilation debug= "true"/> </system.web> <appSettings> </appSettings> <system.serviceModel> <behaviors> <endpointBehaviors> <behavior name= "Webbehavior" > <!--must be set up here--> <!--<webhttp/>--> <enablewebscript/> </behavior> </endpointBehaviors> <serviceBehaviors> <behavior name= "Navmetadatabehavior" > <servicemetadata httpgetenabled= "true" httpgeturl= "Http://wcf.9valor.com/NAVService.svc/metadata"/> </behavior> </serviceBehaviors> </behaviors> <services> <service behaviorconfiguration= "Navmetadatabehavior" name= "Valor.ValorCom.Services.NAVService" > <endpoint binding= "webhttpbinding" address= "Http://127.0.0.1:90/NAVService/web" Webbehavior "bindingconfiguration=" webbinding "contract=" Valor.ValorCom.Contracts.INAVService "/>" <endpoint address= "Http://127.0.0.1:90/NAVService" binding= "BasicHttpBinding" Valor.ValorCom.Contracts.INAVService "></endpoint> </service> </services> <bindings> <webHttpBinding> <binding name= "webbinding" crossdomainscriptaccessenabled= "true" > </binding> </webHttpBinding> </bindings> <servicehostingenvironment multiplesitebindingsenabled= "true" aspnetcompatibilityenabled= "true" > <baseAddressPrefixFilters> <add prefix= "string"/> </baseAddressPrefixFilters> </serviceHostingEnvironment> </system.serviceModel> <startup> <supportedruntime version= "v4.0" sku= ". netframework,version=v4.0 "/> </startup> </configuration>

3rd Note:

code is as follows

copy code

<service behaviorconfiguration= "Navmetadatabehavior" name= "Valor.ValorCom.Services.NAVService"      <endpoint binding= "webhttpbinding" address= "Http://www.111cn.net/n96/NAVService/web" behaviorconfiguration= "Webbehavior" bindingconfiguration= "webbinding" contract= " Valor.ValorCom.Contracts.INAVService "/>     <endpoint address=" http://127.0.0.1:90 /navservice "binding=" BasicHttpBinding "contract=" Valor.ValorCom.Contracts.INAVService "></ENDPOINT>    </service>

There are two endpoints configured here, and the first endpoint is configured for jquery Ajax to invoke the service as a web, specifying that the endpoint is bound to webhttpbinding, and we look at the configuration of the behaviorconfiguration,

Behaviorconfiguration= "Webbehavior", the following figure configuration, <enablewebscript/> configuration specifies that Web script access is allowed.

The code is as follows	Copy Code
<endpointBehaviors> <behavior name= "Webbehavior" > <!--must be set up here--> <!--<webhttp/>--> <enablewebscript/> </behavior> </endpointBehaviors>

Next we look at the bindingconfiguration configuration, bindingconfiguration= "Webbinding", detailed configuration of the following figure, crossdomainscriptaccessenabled Specifies that scripts can be accessed across domains.

The code is as follows	Copy Code
<webHttpBinding> <binding name= "webbinding" crossdomainscriptaccessenabled= "true" > </binding> </webHttpBinding>

The configuration of the second endpoint is provided to the ASP.net through the service proxy.

The last is the client call (Note: Get mode is normal in each browser, post mode only in IE can pass, other browsers for security reasons to reject Cross-domain post submission)

The code is as follows

Copy Code

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > <meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/> <title></title> <link href= "~/styles/site.css" rel= "stylesheet" type= "Text/css"/> <script type= "Text/javascript" src= "Scripts/jquery-1.4.1.min.js" ></script> <script type= "Text/javascript" > $ (function () { $ ("#btnExcute"). Click (function () { var url = $ ("#txtServiceUrl"). Val (); url = + "&orderid=" +$ ("#txtOrderId"). Val (); $.ajax ({ Type: "Get", DataType: "JSON", Url:url, Success:function (returndata) { alert (returndata); } }); }); }); </script> <body> Modify a single product <p> WCF Service url:<input type= "text" style= "width:700px" id= "Txtserviceurl" name= "Txtserviceurl" Value= "http://127.0.0.1:90/AspNavService/web/AddOrderForNAV?jsoncallback=?"/> </p> <p> Order id:<input type= "text" id= "Txtorderid" name= "Txtorderid" value= "11665369"/> <br/> <input type= "button" id= "Btnexcute" name= "Btnexcute" value= "Modify"/> </p> </body>