http://www.cnblogs.com/xiaozhuang/archive/2007/12/07/987092.html

首先我们打开我们的VS 新建一个Asp.Net WebApplication Project,(不要给我说新建网站,我讨厌那个东东) 命名为ExtJSAndWCFChapter1 如图:

ExtJS调用WCF-----实现JSON传递
接下来我们在该项目中新建一个实体类文件和一个AJAX—Enabled WCF SERVICE,分别命名为Employee.cs 和EmployeeService.svc
ExtJS调用WCF-----实现JSON传递
下面去ExtJS.Com网站下载一个ExtJS 2.0 ,解压缩后拷贝至Default.aspx相同目录下,并包括在项目中。如图:
ExtJS调用WCF-----实现JSON传递
下面开始编写代码:先编写Employee.cs的代码,代码如下:
ExtJS调用WCF-----实现JSON传递using System;
ExtJS调用WCF-----实现JSON传递
using System.Data;
ExtJS调用WCF-----实现JSON传递
using System.Configuration;
ExtJS调用WCF-----实现JSON传递
using System.Linq;
ExtJS调用WCF-----实现JSON传递
using System.Web;
ExtJS调用WCF-----实现JSON传递
using System.Web.Security;
ExtJS调用WCF-----实现JSON传递
using System.Web.UI;
ExtJS调用WCF-----实现JSON传递
using System.Web.UI.HtmlControls;
ExtJS调用WCF-----实现JSON传递
using System.Web.UI.WebControls;
ExtJS调用WCF-----实现JSON传递
using System.Web.UI.WebControls.WebParts;
ExtJS调用WCF-----实现JSON传递
using System.Xml.Linq;
ExtJS调用WCF-----实现JSON传递
using System.Runtime.Serialization;
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递
namespace ExtJSAndWCFChapter1

接下来编写EmployeeService.cs的代码,代码如下:
ExtJS调用WCF-----实现JSON传递using System;
ExtJS调用WCF-----实现JSON传递
using System.Linq;
ExtJS调用WCF-----实现JSON传递
using System.Runtime.Serialization;
ExtJS调用WCF-----实现JSON传递
using System.ServiceModel;
ExtJS调用WCF-----实现JSON传递
using System.ServiceModel.Activation;
ExtJS调用WCF-----实现JSON传递
using System.ServiceModel.Web;
ExtJS调用WCF-----实现JSON传递
using System.Collections.Generic;
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递
namespace ExtJSAndWCFChapter1

主 要就是这一句        [WebInvoke(BodyStyle = WebMessageBodyStyle.Wrapped, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, UriTemplate = "/Create")] 
意思就是说这个方法传递输入和输出参数都是Json形式,并且可以用后面加Create的形式来访问该方法,至于前面那个BodyStyle = WebMessageBodyStyle.Wrapped是什么意思留着下节详细说明

接下来修改Web.Config文件,其实只是是把<enableWebScript /> 替换为<webHttp/>代码如下(一部分)


ExtJS调用WCF-----实现JSON传递<system.serviceModel>
ExtJS调用WCF-----实现JSON传递        
<behaviors>
ExtJS调用WCF-----实现JSON传递            
<endpointBehaviors>
ExtJS调用WCF-----实现JSON传递                
<behavior name="ExtJSAndWCFChapter1.EmployeeServiceAspNetAjaxBehavior">
ExtJS调用WCF-----实现JSON传递                    
<!--<enableWebScript />-->
ExtJS调用WCF-----实现JSON传递                    
<webHttp/>
ExtJS调用WCF-----实现JSON传递                
</behavior>
ExtJS调用WCF-----实现JSON传递            
</endpointBehaviors>
ExtJS调用WCF-----实现JSON传递        
</behaviors>
ExtJS调用WCF-----实现JSON传递        
<serviceHostingEnvironment aspNetCompatibilityEnabled="true"/>
ExtJS调用WCF-----实现JSON传递        
<services>
ExtJS调用WCF-----实现JSON传递            
<service name="ExtJSAndWCFChapter1.EmployeeService">
ExtJS调用WCF-----实现JSON传递                
<endpoint address="" behaviorConfiguration="ExtJSAndWCFChapter1.EmployeeServiceAspNetAjaxBehavior" binding="webHttpBinding" contract="ExtJSAndWCFChapter1.EmployeeService"/>
ExtJS调用WCF-----实现JSON传递            
</service>
ExtJS调用WCF-----实现JSON传递        
</services>
ExtJS调用WCF-----实现JSON传递    
</system.serviceModel>

现在可以编译并访问那个EmployeeService.svc文件,后面加上 UriTemplate的值:例如http://localhost:1481/EmployeeService.svc/get。会得到“Method not allowed”的提示。如果访问出现错误,请确认修改的Web.Config是否正确。
接下来编写Default.aspx的代码:代码如下
ExtJS调用WCF-----实现JSON传递<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ExtJSAndWCFChapter1._Default" %>
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递
<html xmlns="http://www.w3.org/1999/xhtml" >
ExtJS调用WCF-----实现JSON传递
<head runat="server">
ExtJS调用WCF-----实现JSON传递    
<title>Untitled Page</title>
ExtJS调用WCF-----实现JSON传递    
<link rel="stylesheet" type="text/css" href="ExtJS/resources/css/ext-all.css" />
ExtJS调用WCF-----实现JSON传递    
<!-- GC -->
ExtJS调用WCF-----实现JSON传递    
<!-- LIBS -->
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递    
<script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js"></script>
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递    
<script type="text/javascript" src="ExtJS/ext-all-debug.js"></script>
ExtJS调用WCF-----实现JSON传递    
<script type="text/javascript" src="ExtJS/ext-all.js"></script>
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递    
<!-- ENDLIBS -->
ExtJS调用WCF-----实现JSON传递
ExtJS调用WCF-----实现JSON传递    
<script type="text/javascript" language="javascript">

最终的运行效果:
ExtJS调用WCF-----实现JSON传递
源代码下载在这里 

相关文章: