WebAPI 從入門到精通

1、第1章 .實例快速上手 -ASP.NET 4.5新特性WebAPI從入門到精通 在新出的MVC4中，增加了WebAPI，用于提供REST風格的WebService，新生成的WebAPI項目和典型的MVC項目一樣，包含主要的Models、Views、Controllers等文件夾和Global.asax文件。Views對于WebAPI來說沒有太大的用途，Models中的Model主要用于保存Service和Client交互的對象，這些對象默認情況下會被轉換為Json格式的數(shù)據(jù)迚行傳輸，Controllers中的Controller對應于WebService來說是一個Resource，用于提供服務

2、。和普通的MVC一樣，Global.asax用于配置路由規(guī)則。（1） 環(huán)境準備 建議使用VS2012以上版本創(chuàng)建WebAPI，如果是使用VS2010，需要安裝VS2010 SP1升級包，MVC4升級包，打開VS2012創(chuàng)建如下：第一步：新建ASP.NET Web應用程序第二步：建議WebAPI新生成的WebAPI項目和典型的MVC項目一樣，包含主要的Models，Views，Controllers等文件夾和Global.asax文件注意：再次強調Views對于WebAPI來說沒有太大的用途，Models中的Model主要用于保存Service和Client交互的對象，這些對象默認情況下會被轉換

3、為Json格式的數(shù)據(jù)進行傳輸，Controllers中的Controller對應于WebService來說是一個Resource，用于提供服務。和普通的MVC一樣，Global.asax用于配置路由規(guī)則（二）Models和WCF中的數(shù)據(jù)契約形成鮮明對比的是，MVC WebAPI中的Model就是簡單的POCO，沒有任何別的東西，如，你可以創(chuàng)建如下的Model public class UserModel public int Id get; set; public string UserName get; set; public string PassWord get; set; 注意：Mod

4、el必須提供public的屬性，用于json或xml反序列化時的賦值（三）ControllersMVC WebAPI中的Controllers和普通MVC的Controllers類似，不過不再繼承于Controller，而改為繼承API的ApiController，一個Controller可以包含多個Action，這些Action響應請求的方法與Global中配置的路由規(guī)則有關，在后面結束Global時統(tǒng)一說明（四）Global默認情況下，模板自帶了兩個路由規(guī)則，分別對應于WebAPI和普通MVC的Web請求，默認的WebAPI路由規(guī)則如下1 routes.MapHttpRoute(2 nam

5、e: DefaultApi,3 routeTemplate: api/controller/id,4 defaults: new id = RouteParameter.Optional 5 );可以看到，默認路由使用的固定的api作為Uri的先導，按照微軟官方的說法，用于區(qū)分普通Web請求和WebService的請求路徑：可以看到，默認的路由規(guī)則只指向了Controller，沒有指向具體的Action，因為默認情況下，對于Controller中的Action的匹配是和Action的方法名相關聯(lián)的：具體來說，如果使用上面的路由規(guī)則，對應下面的Controller：public class Us

6、erController : ApiController public List allModeList = new List() new UserModel() Id=1,UserName=zhang, PassWord=123, new UserModel() Id=2,UserName=lishi, PassWord=123456, new UserModel() Id=3,UserName=wang, PassWord=1234567 ; /Get api/User/ public IEnumerable GetAll() return allModeList; /Get api/Us

7、er/1 public IEnumerable GetOne(int id) return allModeList.FindAll(m) = return m.Id = id; ); /POST api/User/ public bool PostNew(UserModel user) try allModeList.Add(user); return true; catch return false; /Delete api/User/ public int DeleteAll() return allModeList.RemoveAll(mode) = return true; ); /D

8、elete api/User/1 public int DeleteOne(int id) return allModeList.RemoveAll(m) = return m.Id = id; ); /Put api/User public int PutOne(int id, UserModel user) List upDataList = allModeList.FindAll(mode) = return mode.Id = id; ); foreach (var mode in upDataList) mode.PassWord = user.PassWord; mode.User

9、Name = user.UserName; return upDataList.Count; 則，會有下面的對應關系： URL HttpMethod 對應的Action名 /api/User GET GetALL /api/User/1 GET GetOne /api/User POST PostNew /api/User/1 DELETE DeleteOne /api/User DELETE DeleteALL /api/User PUT PutOne(5) 客戶端JS調用 function getAll() $.ajax( url: api/User/, type: GET, succes

10、s: function (data) document.getElementById(modes).innerHTML = ; $.each(data, function (key, val) var str = val.UserName + : + val.PassWord; $(, html: str ).appendTo($(#modes); ); ).fail( function (xhr, textStatus, err) alert(Error: + err); );function find() $.ajax( url: api/User/1 , type: GET, succe

11、ss: function (data) document.getElementById(modes).innerHTML = ; $.each(data, function (key, val) var str = val.UserName + : + val.PassWord; $(, html: str ).appendTo($(#modes); ); ).fail( function (xhr, textStatus, err) alert(Error: + err); ); function add() $.ajax( url: api/User/, type: POST, dataT

12、ype: json, data: Id:4,UserName: admin, PassWord: 666666, success: function (data) getAll(); ).fail( function (xhr, textStatus, err) alert(Error: + err); ); function removeUser() $.ajax( url: api/User/3, type: DELETE, success: function (data) document.getElementById(modes).innerHTML = ; getAll(); ).f

13、ail( function (xhr, textStatus, err) alert(Error: + err); ); function removeAll() $.ajax( url: api/User/, type: DELETE, success: function (data) document.getElementById(modes).innerHTML = ; getAll(); ).fail( function (xhr, textStatus, err) alert(Error: + err); ); function udpate() $.ajax( url: api/U

14、ser/1, type: PUT, dataType: json, data: Id: 1, UserName: admin, PassWord: 666666 , success: function (data) document.getElementById(modes).innerHTML = ; getAll(); ).fail( function (xhr, textStatus, err) alert(Error: + err); ); 這樣就實現(xiàn)了最基本的CRUD操作。擴展需求問題1：我想按照用戶名稱（UserName)進行查詢，怎么辦？辦法：第一步：在UserControlle

15、r類中加一個方法名稱叫：GetUserByName，如下所示： public UserModel GetUserByName(string userName) return allModeList.Find(m) = return m.UserName.Equals(userName); );第二步：在客戶端index.cshtml中調用 function getUserByName() $.ajax( url: api/User/zhang, type: GET, success: function (data) document.getElementById(modes).innerHTM

16、L = ; var str = data.UserName + : + data.PassWord; $(, html: str ).appendTo($(#modes); ).fail( function (xhr, textStatus, err) alert(Error: + err); );如果URL是： url: api/User/zhang,將會報錯：Bad Request原因是他會自動調用我們的GetOne(int id) 這個方法，類型轉換出錯解決辦法：改變URL為： url: api/User/?userName=zhang,問題2：我想按用戶名稱(UserName) 和用戶

17、密碼(PassWord)一起來進行查詢，怎么辦？解決辦法第一步：UserController類中，可以重載一個GetUserByName的方法，如下所示： public UserModel GetUserByName(string userName) return allModeList.Find(m) = return m.UserName.Equals(userName); ); 第二步：客戶端調用： function getUserByName() $.ajax( url: api/User/?userName=zhang&passWord=123, /這里尤其需要注意 type: GE

18、T, success: function (data) document.getElementById(modes).innerHTML = ; var str = data.UserName + : + data.PassWord; $(, html: str ).appendTo($(#modes); ).fail( function (xhr, textStatus, err) alert(Error: + err); );（6） 路由規(guī)則擴展和普通的MVC一樣，MVC WebAPI支持自定義的路由規(guī)則，如：在上面的操作中，路由規(guī)則使用api/controller/id則限定了使用GET

19、方式利用URL來傳值時，controller后面的接收參數(shù)名為id，但是在Controller中，如果GetOne方法的接收參數(shù)名為key，是不會被匹配的，這是只需要新增一個新的路由規(guī)則，或修改原先的路由規(guī)則為：api/controller/key,如下所示： config.Routes.MapHttpRoute( name: DefaultApi, routeTemplate: api/controller/key, defaults: new key = RouteParameter.Optional );當然，可以對路由進行更深的擴展，如：擴展成和普通MVC一樣的路由：api/contr

20、oller/action/id這樣，就要求同時使用Action和HTTP方法進行匹配當然，根據(jù)微軟的說法，這種使用是不被推薦的，因為這不符合大家對WebService的一般認知：(7) 使用Attribute聲明HTTP方法 HttpGet public IEnumerable FindAll() HttpGet public IEnumerable FindByKey(string key) HttpPost public bool Add(TestUseMode mode) HttpDelete public int RemoveByKey(string key) HttpDelete p

21、ublic int RemoveAll() HttpPut public int UpdateByKey(string key, string value) NonAction public string GetPrivateData()當然，我只列出了方法名，而不是這些方法真的沒有方法體.方法體是不變的，NoAction表示這個方法是不接收請求的，即使以GET開頭。如果感覺常規(guī)的GET，POST，DELETE，PUT不夠用，還可以使用AcceptVerbs的方式來聲明HTTP方法，如：AcceptVerbs(MKCOL, HEAD)public int UpdateByKey(string

22、key, string value) List upDataList = allModeList.FindAll(mode) = if (mode.ModeKey = key) return true; return false; ); foreach(var mode in upDataList) mode.ModeValue = value; return upDataList.Count;附：什么是REST風格？ 參考：什么是REST風格第二部分：綜合示例：應用ASP.NET MVC4+WebAPI+FluentData開發(fā)Web應用第一步：創(chuàng)建數(shù)據(jù)庫NorthWind數(shù)據(jù)庫的Custo

23、mers表Create DataBase NorthWindGoUse NorthWindGoCREATE TABLE dbo.Customers(CustomerID nchar(5) NOT NULL,CompanyName nvarchar(40) NOT NULL,ContactName nvarchar(30) NULL,ContactTitle nvarchar(30) NULL,Address nvarchar(60) NULL,City nvarchar(15) NULL,Region nvarchar(15) NULL,PostalCode nvarchar(10) NULL

24、,Country nvarchar(15) NULL,Phone nvarchar(24) NULL,Fax nvarchar(24) NULL, CONSTRAINT PK_Customers PRIMARY KEY CLUSTERED (CustomerID ASC)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON PRIMARY) ON PRIMARYGO第二步：創(chuàng)建 FluentData.En

25、tity層，創(chuàng)建Customer實體類namespace FluentData.Entity public class Customer public string CustomerID get; set; public string CompanyName get; set; public string ContactName get; set; public string ContactTitle get; set; public string Address get; set; public string City get; set; public string Region get;

26、set; public string PostalCode get; set; public string Country get; set; public string Phone get; set; public string Fax get; set; 第三步：利用FluentData做數(shù)據(jù)的持久化首先引入FluentData.cs (見附件)其次：創(chuàng)建DBHelper類，代碼如下： public class DBHelper public static IDbContext Context() /return new DbContext().ConnectionString(serve

27、r=;uid=sa;pwd=sa;database=TestDB, new SqlServerProvider(); return new DbContext().ConnectionStringName(connString, new SqlServerProvider(); 然后不要忘記修改ASP.NET MVC層所在的Web.config,加入數(shù)據(jù)庫連結字符串： 第三步：創(chuàng)建 CustomerService數(shù)據(jù)持久化類，代碼如下：public class CustomerService private IDbContext context = DBHelper.Cont

28、ext(); public Customer Select(string customerId) return context.Select(*).From(Customers).Where(CustomerID=0).Parameters(customerId) .QuerySingle(); public List SelectAll() return context.Select(*).From(Customers).QueryMany(); public List SelectAll(string sortExpression) if (String.IsNullOrEmpty(sor

29、tExpression) return null; return context.Select(*).From(Customers).OrderBy(sortExpression).QueryMany(); public List SelectAll(int currentPageIndex,int maxRows, string sortExpression) var select = context.Select(*).From(Customers); if (maxRows 0) if (currentPageIndex = 0) currentPageIndex = 1; select

30、.Paging(currentPageIndex, maxRows); if (!string.IsNullOrEmpty(sortExpression) select.OrderBy(sortExpression); return select.QueryMany(); public int CountAll() return context.Sql(select count(*) from Customers).QuerySingle(); public int Insert(Customer customer) return context.Insert(Customers, custo

31、mer).Execute(); public int Update(Customer customer) return context.Update(Customers, customer).Where(CustomerID, customer.CustomerID).Execute(); public int Delete(string customerId) return context.Delete(Customers).Where(CustomerID, customerId).Execute(); public int Delete(Customer customer) return

32、 this.Delete(customer.CustomerID); 第四步：Web API，創(chuàng)建CustomerController注意要引用：FluentData.Entity及FluentData.DAL 程序集public class CustomerController : ApiController private CustomerService customerService = new CustomerService(); /Select All public IEnumerable Get() return customerService.SelectAll(); /Sele

33、ct By Id public Customer Get(string id) return customerService.Select(id); /Insert public void Post(Customer customer) customerService.Insert(customer); /Update public void Put(string id, Customer obj) customerService.Update(obj); /Delete public void Delete(string id) customerService.Delete(id); 第五步

34、：View層代碼namespace MyWebApI.Controllers public class HomeController : Controller public ActionResult Index() return View(); public ActionResult Test() return View(); public ActionResult CustomerManager() return View(); 然后創(chuàng)建View Customer ID Company Name Contact Name Country Actions $(function () $.get

35、JSON(api/Customer, LoadCustomers); ); function LoadCustomers(data) $(#customerTable).find(tr:gt(1).remove(); $.each(data, function (key, val) var tableRow = + + val.CustomerID + + + + + + ; $(#customerTable).append(tableRow); ); $(inputname=btnInsert).click(OnInsert); $(inputname=btnUpdate).click(On

36、Update); $(inputname=btnDelete).click(OnDelete); function OnInsert(evt) var customerId = $(#txtCustomerId).val(); var companyName = $(#txtCompanyName).val(); var contactName = $(#txtContactName).val(); var country = $(#txtCountry).val(); var data = CustomerID: + customerId + ,CompanyName: + companyN

37、ame + ,ContactName: + contactName + ,Country: + country + ; $.ajax( type: POST, url: /api/Customer/, data: data, contentType: application/json; charset=utf-8, dataType: json, success: function (results) $(#txtCustomerId).val(); $(#txtCompanyName).val(); $(#txtContactName).val(); $(#txtCountry).val()

38、; $.getJSON(api/customers + new Date().getTime(), LoadCustomers); alert(添加成功!); ).fail( function (xhr, textStatus, err) alert(添加失敗，原因如下: + err); ); function OnUpdate(evt) var input; var customerId = $(this).parent().parent().children().get(0).innerHTML; input = $($(this).parent().parent().children().get(1).find(input); /input.removeAttr(disabled); var companyName = input.val(); input = $($(this).parent().parent().children().get(2).find(input