Interaction between Ajax and WCF-the beauty of WCF

Source: Internet
Author: User

In the previous blog <security issues and solutions for Ajax access to Xml Web Services>, I talked about ajax security issues between xml web Services and the old and new architectures of wcf, and concluded that, however, there is no specific verification. This article aims to verify that the separation of the new architecture MEX node from the business endpoint is more conducive to service security, this section briefly describes how to use ajax to interact with wcf in vs2008.

Step 1: create a website in vs2008.

In vs2008, if you select.. Net Framework 3.5 template. the configuration is automatically configured with ajax in config. this is mentioned above. in addition, the right toolbox also contains the Ajax control bar.

However, if the. net framework 2.0 website is created by default, web. config does not support ajax, but there are also solutions.

Step 2: Create a wcf Service AjaxWcfService. svc that can be used for ajax interaction. The method is as follows:

The service code generated by modifying the template is as follows:

[OperationContract]

Public int IntAdd (int a, int B)

{

// Add operation implementation here

Return a + B;

}

When you browse AjaxWcfService. svc in a browser, the following results will be displayed:

 

Step 3: Well, the following step is inconsistent with the interaction method between the original xml web service and ajax. The steps are as follows:

Visit the AjaxWcfService. svc URL that is opened in step 2 to add the/js URL ,:

Haha, you can download to the js proxy used to access the wcf Service. save the file. Here I name it AjaxWcfScript. js, and then add it to the root directory of the project (other locations are also acceptable, the location is optional ).

Step 4: By the end of step 3, the WCF-related operations have basically been completed. The following describes ajax development.

Add scriptmanager in default. aspx, drag a ScriptManager control from the Toolbox on the Right To default. aspx, and add ScriptReference. The ScriptManager code is as follows:

<Asp: ScriptManager ID = "ScriptManager1" runat = "server">

<Scripts>

<Asp: ScriptReference Path = "~ /AjaxWcfScript. js "/>

</Scripts>

</Asp: ScriptManager>

Step 5: Step 4: Implement page default. aspx supports scriptmanager and adds access to the WCF Service AjaxWcfService. svc configuration, the following process is very easy, in default. add the following element to aspx:

<H2> example of interaction between ajax and wcf
<P> a: <input id = "txtA" type = "text"/> </p>

<P> B: <input id = "txtB" type = "text"/> </p>

<Input id = "Button1" type = "button" value = "Submit"/>

Add the following script in <Script type = "text/javascript">

Function intAdd ()

{

Var a = $ get ("txtA"). value;

Var B = $ get ("txtB"). value;

AjaxWcfService. IntAdd (a, B, onSuccess, onFailed );

}

Function onSuccess (res)

{

Alert (res );

}

Function onFailed (res)

{

Alert (res );

}

</Script>

Then, specify the onclick of Button1 as intAdd.

<Input id = "Button1" type = "button" value = "Submit" onclick = "intAdd ()"/>

Step 6: Well, now everything is ready. I only need to test it. In the browser, browse default. aspx, enter a number in the input box, and click Submit. The result is as follows:

Well, the end of a perfect ajax and wcf is now.

International Convention, finally presented with sample code:
/Files/jillzhang/AjaxWcf.rar

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.