JSON入門指南--服務端處理JSON

平時公司使用的ASP.NET MVC3來開發Web項目，其實在ASP.NET中已經原生的支持JSON。因此基本不須要引進Newtonsoft.Json.dll。下面看在MVC4中，後臺生成JSON數據，前端使用Ajax調用。而後就是前端使用POST請求，發送JSON格式，後臺程序來處理。

1.後臺生成JSON格式數據，前端使用Ajax調用

後臺代碼:

public JsonResult GetList() { ArrayList eventlist = new ArrayList(); for (int i = 0; i < 3; i++) { Hashtable ht = new Hashtable(); ht.Add("eventid", i + 1); ht.Add("eventname", "測試活動"); ht.Add("eventdata", "2014-04-02"); ht.Add("eventlocation", "公司"); eventlist.Add(ht); } return Json(new { list = eventlist, count = eventlist.Count }, JsonRequestBehavior.AllowGet); }

 前端調用代碼：

$.ajax({ url: "/Home/GetList", success: function (data) { var eventlist =data.list; for(var index in eventlist){ console.log(eventlist[index].eventname); } console.log(data.count); } });

2.前端使用POST請求，發送JSON格式數據給後臺

 頁面放置一個button，代碼片斷爲：<input type="button" id="btn_send" value="Send" />

$("#btn_send").click(function () { var person1 = new Object(); person1.Name = "Superman"; person1.Age = 20; var person2 = new Object(); person2.Name = "BBB"; person2.Age = 22; var arr = []; arr.push(person1); arr.push(person2); $.ajax({ url: '/Home/AddUser', type: "POST", data: JSON.stringify(arr), success: function (data) { console.log(data); } }); });

後臺代碼： 

[HttpPost] public JsonResult AddUser() { string json = string.Empty; using(var reader=new StreamReader(HttpContext.Request.InputStream)) { json = reader.ReadToEnd(); } bool result = false; string message = string.Empty; var personlist = new JavaScriptSerializer().Deserialize<List<Person>>(json); foreach(Person p in personlist){ result = true; message += p.Name + ":" + p.Age; } return Json(new { result=result,message=message}); } public class Person { public string Name { get; set; } public int Age { get; set; } }

 不少人會問我，使用了MVC3，爲何不在前端使用Model，而後綁定數據，這樣後臺處理方便，而已編輯的時候，前端基本不要作什麼事情。其實這樣考慮是爲了把前端和後臺徹底分離出來，前端使用AngularJS作數據的綁定。前端和後臺數據的傳輸格式就使用JSON。後面咱們會研究ASP.NET Web API如何作到前端和後臺徹底分離的。

 參考網址： http://www.dotblogs.com.tw/kevintan1983/archive/2012/12/26/86013.aspx