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如何做到前端和后台完全分离的。
目录
相关文章
|
6月前
|
XML JSON 前端开发
Ajax技术【Ajax技术详解、 Ajax 的使用、Ajax请求、 JSON详解、JACKSON 的使用 】(一)-全面详解(学习总结---从入门到深化)
Ajax技术【Ajax技术详解、 Ajax 的使用、Ajax请求、 JSON详解、JACKSON 的使用 】(一)-全面详解(学习总结---从入门到深化)
161 1
|
6月前
|
编解码 JavaScript 前端开发
TypeScript【第三方声明文件、自定义声明文件、tsconfig.json文件简介、tsconfig.json 文件结构与配置】(六)-全面详解(学习总结---从入门到深化)
TypeScript【第三方声明文件、自定义声明文件、tsconfig.json文件简介、tsconfig.json 文件结构与配置】(六)-全面详解(学习总结---从入门到深化)
336 0
|
3月前
|
JSON 数据格式
langchain 入门指南 - JSON 形式输出大模型的响应
langchain 入门指南 - JSON 形式输出大模型的响应
137 0
|
5月前
|
JSON 数据格式 Python
python3 服务端使用CGI脚本处理POST的Json数据
python3 服务端使用CGI脚本处理POST的Json数据
70 6
|
6月前
|
XML JSON 前端开发
Ajax – JSON入门指南
Ajax – JSON入门指南
58 1
|
11月前
|
数据采集 JSON JavaScript
C# 解析“JSON“格式数据和网络实战案例 入门
C# 解析“JSON“格式数据和网络实战案例 入门
|
存储 JSON Go
Go 语言快速入门指南:Go 语言解析 JSON(上)
本文将说明如何利用 Go 语言将 JSON 解析为结构体和数组,如果解析 JSON 的嵌入对象,如何将 JSON 的自定义属性名称映射到结构体,如何解析非结构化的 JSON 字符串。
|
JSON 数据格式
02zTree - 最简单的入门例子(JSON 数据)
02zTree - 最简单的入门例子(JSON 数据)
82 0
|
存储 JSON 数据格式
Python快速上手系列--JSON--入门篇
Python快速上手系列--JSON--入门篇
83 0
|
JSON Java 关系型数据库
springboot基础入门之json转换框架 、全局异常捕捉以及JPA连接数据库
springboot基础入门之json转换框架 、全局异常捕捉以及JPA连接数据库
下一篇
无影云桌面