参考链接:http://www.cnblogs.com/lori/p/3555737.html
简单的了解到RESTful架构后,跟着以上链接做了一个小练习。
Step1:
新建WebApi项目,新建controller命名为TestController
在TestController中的代码如下:
1 public class TestController : ApiController 2 { 3 /// <summary> 4 /// User Data List 5 /// </summary> 6 7 private readonly List<Users> _userList = new List<Users> 8 { 9 new Users{ UserID=1,UserName="Admin",UserEmail="bfyxzls@sina.com"}, 10 new Users {UserID = 2, UserName = "Spiderman", UserEmail = "Spiderman@cnblogs.com"}, 11 new Users {UserID = 3, UserName = "Batman", UserEmail = "Batman@cnblogs.com"} 12 }; 13 14 /// <summary> 15 /// 得到列表对象 16 /// </summary> 17 /// <returns></returns> 18 19 public IEnumerable<Users> Get() 20 { 21 return _userList; 22 } 23 24 /// <summary> 25 /// 得到一个实体,根据主键 26 /// </summary> 27 /// <param name="id"></param> 28 /// <returns></returns> 29 30 public Users Get(int id) 31 { 32 return _userList.FirstOrDefault(i => i.UserID == id); 33 } 34 35 /// <summary> 36 /// 添加 37 /// </summary> 38 /// <param name="form">表单对象,它是唯一的</param> 39 /// <returns></returns> 40 41 public Users Post([FromBody] Users entity) 42 { 43 _userList.Add(entity); 44 return entity; 45 } 46 47 /// <summary> 48 /// 更新 49 /// </summary> 50 /// <param name="id">主键</param> 51 /// <param name="form">表单对象,它是唯一的</param> 52 /// <returns></returns> 53 54 public Users Put(int id, [FromBody] Users entity) 55 { 56 var user = _userList.FirstOrDefault(i => i.UserID == id); 57 if (user!=null) 58 { 59 user.UserName = entity.UserName; 60 user.UserEmail = entity.UserEmail; 61 } 62 return user; 63 } 64 65 /// <summary> 66 /// 删除 67 /// </summary> 68 /// <param name="id">主键</param> 69 /// <returns></returns> 70 71 public void Delete(int id) 72 { 73 _userList.Remove(_userList.FirstOrDefault(i => i.UserID == id)); 74 } 75 76 }
Step2:
新建html页面,在html中代码如下:
1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <title></title> 6 <script src="../../Scripts/jquery-1.10.2.min.js"></script> 7 <script src="../../Scripts/jquery-1.10.2.js"></script> 8 </head> 9 <body> 10 <fieldset> 11 <legend> 12 测试Web Api 13 </legend> 14 <a href="javascript:add()">添加(post)</a> 15 <a href="javascript:update(1)">更新(put)</a> 16 <a href="javascript:deletes(1)">删除(delete)</a> 17 <a href="/api/test">列表(Get)</a> 18 <a href="/api/test/1">实体(Get)</a> 19 </fieldset> 20 <script> 21 function add() { 22 $.ajax({ 23 url: "/api/Test/", 24 type: "POST", 25 data: { "UserID": 4, "UserName": "test", "UserEmail": "Parry@cnblogs.com" }, 26 success: function (data) { alert(JSON.stringify(data)); } 27 }); 28 } 29 30 //更新 31 function update(id) { 32 $.ajax({ 33 url: "/api/Test?id=" + id, 34 type: "Put", 35 data: { "UserID": 1, "UserName": "moditest", "UserEmail": "Parry@cnblogs.com" }, 36 success: function (data) { alert(JSON.stringify(data)); } 37 }); 38 } 39 function deletes(id) { 40 $.ajax({ 41 url: "/api/Test/1", 42 type: "DELETE", 43 success: function (data) { alert(data); } 44 }); 45 } 46 </script> 47 </body> 48 </html>
总结:
从练习中学习到RESTful标准相比较传统的webService方式,在前端提交到后台服务上,更加方便快捷,并且以上练习,让人很清晰可以根据以前掌握的ajax提交,只是改变了URL和type方式,其它的方式都更加亲切,所以更加的通俗易懂。