WebAPI 從入門到精通

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

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

3、為Json格式的數(shù)據(jù)進(jìn)行傳輸，Controllers中的Controller對(duì)應(yīng)于WebService來(lái)說(shuō)是一個(gè)Resource，用于提供服務(wù)。和普通的MVC一樣，Global.asax用于配置路由規(guī)則（二）Models和WCF中的數(shù)據(jù)契約形成鮮明對(duì)比的是，MVC WebAPI中的Model就是簡(jiǎn)單的POCO，沒(méi)有任何別的東西，如，你可以創(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反序列化時(shí)的賦值（三）ControllersMVC WebAPI中的Controllers和普通MVC的Controllers類似，不過(guò)不再繼承于Controller，而改為繼承API的ApiController，一個(gè)Controller可以包含多個(gè)Action，這些Action響應(yīng)請(qǐng)求的方法與Global中配置的路由規(guī)則有關(guān)，在后面結(jié)束Global時(shí)統(tǒng)一說(shuō)明（四）Global默認(rèn)情況下，模板自帶了兩個(gè)路由規(guī)則，分別對(duì)應(yīng)于WebAPI和普通MVC的Web請(qǐng)求，默認(rèn)的WebAPI路由規(guī)則如下1 routes.MapHttpRoute(2 nam

5、e: "DefaultApi",3 routeTemplate: "api/controller/id",4 defaults: new id = RouteParameter.Optional 5 );可以看到，默認(rèn)路由使用的固定的api作為Uri的先導(dǎo)，按照微軟官方的說(shuō)法，用于區(qū)分普通Web請(qǐng)求和WebService的請(qǐng)求路徑：可以看到，默認(rèn)的路由規(guī)則只指向了Controller，沒(méi)有指向具體的Action，因?yàn)槟J(rèn)情況下，對(duì)于Controller中的Action的匹配是和Action的方法名相關(guān)聯(lián)的：具體來(lái)說(shuō)，如果使用上面的路由規(guī)則，對(duì)應(yīng)下面的Co

6、ntroller：public class UserController : ApiController public List<UserModel> allModeList = new List<UserModel>() new UserModel() Id=1,UserName="zhang", PassWord="123", new UserModel() Id=2,UserName="lishi", PassWord="123456", new UserModel() Id=3,Us

7、erName="wang", PassWord="1234567" ; /Get api/User/ public IEnumerable<UserModel> GetAll() return allModeList; /Get api/User/1 public IEnumerable<UserModel> GetOne(int id) return allModeList.FindAll(m) => return m.Id = id; ); /POST api/User/ public bool PostNew(User

8、Model user) try allModeList.Add(user); return true; catch return false; /Delete api/User/ public int DeleteAll() return allModeList.RemoveAll(mode) => return true; ); /Delete api/User/1 public int DeleteOne(int id) return allModeList.RemoveAll(m) => return m.Id = id; ); /Put api/User public in

9、t PutOne(int id, UserModel user) List<UserModel> upDataList = allModeList.FindAll(mode) => return mode.Id = id; ); foreach (var mode in upDataList) mode.PassWord = user.PassWord; mode.UserName = user.UserName; return upDataList.Count; 則，會(huì)有下面的對(duì)應(yīng)關(guān)系： URL HttpMethod 對(duì)應(yīng)的Action名 /api/User GET Get

10、ALL /api/User/1 GET GetOne /api/User POST PostNew /api/User/1 DELETE DeleteOne /api/User DELETE DeleteALL /api/User PUT PutOne(5) 客戶端JS調(diào)用 function getAll() $.ajax( url: "api/User/", type: 'GET', success: function (data) document.getElementById("modes").innerHTML = "&

11、quot; $.each(data, function (key, val) var str = val.UserName + ': ' + val.PassWord; $('<li/>', html: str ).appendTo($('#modes'); ); ).fail( function (xhr, textStatus, err) alert('Error: ' + err); );function find() $.ajax( url: "api/User/1" , type: 

12、9;GET', success: function (data) document.getElementById("modes").innerHTML = "" $.each(data, function (key, val) var str = val.UserName + ': ' + val.PassWord; $('<li/>', html: str ).appendTo($('#modes'); ); ).fail( function (xhr, textStatus, err

13、) alert('Error: ' + err); ); function add() $.ajax( url: "api/User/", type: "POST", dataType: "json", data: "Id":4,"UserName": "admin", "PassWord": "666666", success: function (data) getAll(); ).fail( function (x

14、hr, textStatus, err) alert('Error: ' + err); ); function removeUser() $.ajax( url: "api/User/3", type: 'DELETE', success: function (data) document.getElementById("modes").innerHTML = "" getAll(); ).fail( function (xhr, textStatus, err) alert('Error:

15、' + 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

16、( url: "api/User/1", type: 'PUT', dataType: "json", data: Id: 1, "UserName": "admin", "PassWord": "666666" , success: function (data) document.getElementById("modes").innerHTML = "" getAll(); ).fail( function (xh

17、r, textStatus, err) alert('Error: ' + err); ); 這樣就實(shí)現(xiàn)了最基本的CRUD操作。擴(kuò)展需求問(wèn)題1：我想按照用戶名稱（UserName)進(jìn)行查詢，怎么辦？辦法：第一步：在UserController類中加一個(gè)方法名稱叫：GetUserByName，如下所示： public UserModel GetUserByName(string userName) return allModeList.Find(m) => return m.UserName.Equals(userName); );第二步：在客戶端index.cshtml中

18、調(diào)用 function getUserByName() $.ajax( url: "api/User/zhang", type: 'GET', success: function (data) document.getElementById("modes").innerHTML = "" var str = data.UserName + ': ' + data.PassWord; $('<li/>', html: str ).appendTo($('#modes&#

19、39;); ).fail( function (xhr, textStatus, err) alert('Error: ' + err); );如果URL是： url: "api/User/zhang",將會(huì)報(bào)錯(cuò)：Bad Request原因是他會(huì)自動(dòng)調(diào)用我們的GetOne(int id) 這個(gè)方法，類型轉(zhuǎn)換出錯(cuò)解決辦法：改變URL為： url: "api/User/?userName=zhang",問(wèn)題2：我想按用戶名稱(UserName) 和用戶密碼(PassWord)一起來(lái)進(jìn)行查詢，怎么辦？解決辦法第一步：UserController

20、類中，可以重載一個(gè)GetUserByName的方法，如下所示： public UserModel GetUserByName(string userName) return allModeList.Find(m) => return m.UserName.Equals(userName); ); 第二步：客戶端調(diào)用： function getUserByName() $.ajax( url: "api/User/?userName=zhang&passWord=123", /這里尤其需要注意 type: 'GET', success: func

21、tion (data) document.getElementById("modes").innerHTML = "" var str = data.UserName + ': ' + data.PassWord; $('<li/>', html: str ).appendTo($('#modes'); ).fail( function (xhr, textStatus, err) alert('Error: ' + err); );（6） 路由規(guī)則擴(kuò)展和普通的MVC一樣，MVC

22、 WebAPI支持自定義的路由規(guī)則，如：在上面的操作中，路由規(guī)則使用"api/controller/id"則限定了使用GET方式利用URL來(lái)傳值時(shí)，controller后面的接收參數(shù)名為id，但是在Controller中，如果GetOne方法的接收參數(shù)名為key，是不會(huì)被匹配的，這是只需要新增一個(gè)新的路由規(guī)則，或修改原先的路由規(guī)則為："api/controller/key",如下所示： config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/co

23、ntroller/key", defaults: new key = RouteParameter.Optional );當(dāng)然，可以對(duì)路由進(jìn)行更深的擴(kuò)展，如：擴(kuò)展成和普通MVC一樣的路由："api/controller/action/id"這樣，就要求同時(shí)使用Action和HTTP方法進(jìn)行匹配當(dāng)然，根據(jù)微軟的說(shuō)法，這種使用是不被推薦的，因?yàn)檫@不符合大家對(duì)WebService的一般認(rèn)知：(7) 使用Attribute聲明HTTP方法 HttpGet public IEnumerable<TestUseMode> FindAll() HttpGet pub

24、lic IEnumerable<TestUseMode> FindByKey(string key) HttpPost public bool Add(TestUseMode mode) HttpDelete public int RemoveByKey(string key) HttpDelete public int RemoveAll() HttpPut public int UpdateByKey(string key, string value) NonAction public string GetPrivateData()當(dāng)然，我只列出了方法名，而不是這些方法真的沒(méi)有

25、方法體.方法體是不變的，NoAction表示這個(gè)方法是不接收請(qǐng)求的，即使以GET開(kāi)頭。如果感覺(jué)常規(guī)的GET，POST，DELETE，PUT不夠用，還可以使用AcceptVerbs的方式來(lái)聲明HTTP方法，如：AcceptVerbs("MKCOL", "HEAD")public int UpdateByKey(string key, string value) List<TestUseMode> upDataList = allModeList.FindAll(mode) => if (mode.ModeKey = key) return

26、 true; return false; ); foreach(var mode in upDataList) mode.ModeValue = value; return upDataList.Count;附：什么是REST風(fēng)格？ 參考：什么是REST風(fēng)格第二部分：綜合示例：應(yīng)用ASP.NET MVC4+WebAPI+FluentData開(kāi)發(fā)Web應(yīng)用第一步：創(chuàng)建數(shù)據(jù)庫(kù)NorthWind數(shù)據(jù)庫(kù)的Customers表Create DataBase NorthWindGoUse NorthWindGoCREATE TABLE dbo.Customers(CustomerID nchar(5) N

27、OT 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,Country nvarchar(15) NULL,Phone nvarchar(24) NULL,Fax nvarchar(24) NULL, CONSTRAINT PK_Custome

28、rs 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.Entity層，創(chuàng)建Customer實(shí)體類namespace FluentData.Entity public class Customer public string CustomerID g

29、et; 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; set; public string PostalCode get; set; public string Country get; set; public string Phone get

30、; set; public string Fax get; set; 第三步：利用FluentData做數(shù)據(jù)的持久化首先引入FluentData.cs (見(jiàn)附件)其次：創(chuàng)建DBHelper類，代碼如下： public class DBHelper public static IDbContext Context() /return new DbContext().ConnectionString("server=;uid=sa;pwd=sa;database=TestDB", new SqlServerProvider(); return new DbCo

31、ntext().ConnectionStringName("connString", new SqlServerProvider(); 然后不要忘記修改ASP.NET MVC層所在的Web.config,加入數(shù)據(jù)庫(kù)連結(jié)字符串： <connectionStrings> <add name="connString" connectionString="server=;database=Northwind;uid=sa;pwd=sa;"/> </connectionStrings>第三步

32、：創(chuàng)建 CustomerService數(shù)據(jù)持久化類，代碼如下：public class CustomerService private IDbContext context = DBHelper.Context(); public Customer Select(string customerId) return context.Select<Customer>("*").From("Customers").Where("CustomerID=0").Parameters(customerId) .QuerySingle(

33、); public List<Customer> SelectAll() return context.Select<Customer>("*").From("Customers").QueryMany(); public List<Customer> SelectAll(string sortExpression) if (String.IsNullOrEmpty(sortExpression) return null; return context.Select<Customer>("*&qu

34、ot;).From("Customers").OrderBy(sortExpression).QueryMany(); public List<Customer> SelectAll(int currentPageIndex,int maxRows, string sortExpression) var select = context.Select<Customer>("*").From("Customers"); if (maxRows > 0) if (currentPageIndex = 0) c

35、urrentPageIndex = 1; select.Paging(currentPageIndex, maxRows); if (!string.IsNullOrEmpty(sortExpression) select.OrderBy(sortExpression); return select.QueryMany(); public int CountAll() return context.Sql("select count(*) from Customers").QuerySingle<int>(); public int Insert(Custome

36、r customer) return context.Insert<Customer>("Customers", customer).Execute(); public int Update(Customer customer) return context.Update<Customer>("Customers", customer).Where("CustomerID", customer.CustomerID).Execute(); public int Delete(string customerId)

37、 return context.Delete("Customers").Where("CustomerID", customerId).Execute(); public int Delete(Customer customer) return this.Delete(customer.CustomerID); 第四步：Web API，創(chuàng)建CustomerController注意要引用：FluentData.Entity及FluentData.DAL 程序集public class CustomerController : ApiController p

38、rivate CustomerService customerService = new CustomerService(); /Select All public IEnumerable<Customer> Get() return customerService.SelectAll(); /Select By Id public Customer Get(string id) return customerService.Select(id); /Insert public void Post(Customer customer) customerService.Insert(

39、customer); /Update public void Put(string id, Customer obj) customerService.Update(obj); /Delete public void Delete(string id) customerService.Delete(id); 第五步：View層代碼namespace MyWebApI.Controllers public class HomeController : Controller public ActionResult Index() return View(); public ActionResult

40、 Test() return View(); public ActionResult CustomerManager() return View(); 然后創(chuàng)建View <table id="customerTable" border="1" cellpadding="3" style="width:700px"> <tr> <th>Customer ID</th> <th>Company Name</th> <th>Contact

41、 Name</th> <th>Country</th> <th>Actions</th> </tr> <tr> <td><input type="text" id="txtCustomerId" style="width:100px" size="5"/></td> <td><input type="text" id="txtCompanyName&

42、quot; style="width:150px" /></td> <td><input type="text" id="txtContactName" style="width:150px"/></td> <td><input type="text" id="txtCountry" style="width:150px"/></td> <td><i

43、nput type="button" name="btnInsert" value="Insert" style="width:150px"/></td> </tr> </table><script type="text/javascript"> $(function () $.getJSON("api/Customer", LoadCustomers); ); function LoadCustomers(data) $

44、("#customerTable").find("tr:gt(1)").remove(); $.each(data, function (key, val) var tableRow = '<tr>' + '<td>' + val.CustomerID + '</td>' + '<td><input type="text" value="' + val.CompanyName + '" /&

45、gt;</td>' + '<td><input type="text" value="' + val.ContactName + '" /></td>' + '<td><input type="text" value="' + val.Country + '" /></td>' + '<td><input type="butt

46、on" name="btnUpdate" value="修改" /> <input type="button" name="btnDelete" value="刪除" /></td>' + '</tr>' $('#customerTable').append(tableRow); ); $("inputname='btnInsert'").click(OnInsert)

47、; $("inputname='btnUpdate'").click(OnUpdate); $("inputname='btnDelete'").click(OnDelete); function OnInsert(evt) var customerId = $("#txtCustomerId").val(); var companyName = $("#txtCompanyName").val(); var contactName = $("#txtContactName

48、").val(); var country = $("#txtCountry").val(); var data = '"CustomerID":"' + customerId + '","CompanyName":"' + companyName + '","ContactName":"' + contactName + '","Country":"'

49、 + country + '"' $.ajax( type: 'POST', url: '/api/Customer/', data: data, contentType: "application/json; charset=utf-8", dataType: 'json', success: function (results) $("#txtCustomerId").val(''); $("#txtCompanyName").val(

50、9;'); $("#txtContactName").val(''); $("#txtCountry").val(''); $.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