Ajax - 使用JSON向服务器发送数据

合集下载

json使用场景及使用方法

json使用场景及使用方法JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，常用于Web应用中的数据传输和存储。

以下是JSON 的使用场景和使用方法：1. 数据传输：JSON常用于前后端之间的数据传输。

前端可以将数据序列化为JSON格式，通过AJAX请求发送给后端，后端则可以解析JSON数据，并根据需要进行处理和返回相应的数据。

2. 存储配置信息：JSON可以用来存储和配置应用程序的设置和参数。

通过将配置信息保存为JSON文件，可以实现动态修改和更新配置，而无需修改源代码。

3. API接口：许多Web服务和API都使用JSON作为数据交换的格式。

前端通过调用API接口获取JSON数据，然后解析和展示数据。

4. 数据存储：JSON也可以用来存储数据，特别适用于非关系型数据库或文档数据库。

在这种情况下，可以将JSON作为文档的格式，存储和检索数据。

使用JSON的方法如下：1. 序列化：将对象转换为JSON字符串的过程称为序列化。

可以使用编程语言中提供的JSON库或API来将对象转换为JSON格式。

2. 解析：将JSON字符串转换为对象的过程称为解析。

同样，可以使用JSON库或API来解析JSON字符串，并将其转换为对象或其他数据结构。

3. 访问和修改：一旦将JSON数据转换为对象，就可以通过点号或方括号来访问和修改其中的属性和值。

例如，对于以下JSON数据：```{"name": "John","age": 25,"email":"****************"}```可以使用``或`object["name"]`来访问和修改`name`属性的值。

总之，JSON在Web开发中被广泛应用于数据交换和存储，通过序列化和解析的方式可以方便地处理JSON数据。

ajax中的success方法

ajax中的success方法1.引言1.1 概述概述:AJAX（Asynchronous JavaScript and XML）是一种基于前端的技术，通过使用JavaScript和XML或JSON来实现与服务器之间的异步通信。

它的出现极大地改变了Web开发的方式，使得页面能够实现动态的数据更新，无需重新加载整个页面。

在AJAX中，success方法是作为回调函数之一，用于处理异步请求成功后返回的数据。

当请求成功时，success方法会被调用，并将服务器返回的数据作为参数传递给该方法。

本文将重点介绍和探讨AJAX中的success方法，包括其使用方法、参数和常见的应用场景。

通过深入了解success方法，读者将能够更好地理解AJAX的工作原理，并能够灵活运用这一方法来处理异步请求的返回数据。

接下来的章节将依次介绍AJAX的简介以及其中的success方法，以帮助读者更好地理解和运用该方法。

本文的目的是帮助读者掌握AJAX技术中的关键概念和方法，以便能够在实际的Web开发中灵活运用AJAX 来提升用户体验和页面的性能。

在结论部分，我们将对AJAX中的success方法进行总结，并展望其在未来的应用前景。

通过对success方法的深入学习，读者将能够更好地应用这一方法来处理异步请求返回的数据，提供更好的用户体验，同时也能够更好地理解和应用AJAX技术。

1.2文章结构文章结构是指文章的组织形式和内容安排方式。

一个良好的文章结构可以使读者更容易理解和吸收文章内容，并且可以让作者更清晰地表达自己的观点和论据。

在本篇文章中，我们将按照以下结构组织内容：1. 引言1.1 概述：介绍AJAX（Asynchronous JavaScript and XML）的基本概念和作用，以及它在现代Web开发中的重要性。

1.2 文章结构：说明本篇文章的整体结构和内容安排。

1.3 目的：阐述写作本文的目的，即介绍AJAX中的success方法的作用、用法和实际应用场景。

jQuery使用ajax传递json对象到服务端及contentType的用法示例

jQuery使⽤ajax传递json对象到服务端及contentType的⽤法⽰例⽬录0、⼀般情况下，通过键值对的⽅式将参数传递到服务端0.1 客户端代码：0.2 服务端代码：0.3 在浏览器的⽹络中查看此次请求：1、ajax 传递复杂json对象到服务端1.1 ⽅法⼀：通过formdata传值，服务端通过key获取值；1.2 ⽅法⼆：通过formdata⽅式传值，服务端读取Request.InputStream;2、content-Type 对 mvc项⽬的重要性2.1 客户端代码：2.2 服务端代码：2.3 解决⽅案：（设置contentType）2.4 其他的解决⽅案：（修改服务端代码）本⽂实例讲述了jQuery使⽤ajax传递json对象到服务端及contentType的⽤法。

分享给⼤家供⼤家参考，具体如下：0、⼀般情况下，通过键值对的⽅式将参数传递到服务端0.1 客户端代码：$.ajax({url: 'TestHandler.ashx',type: 'post',data: {name: "admin",age: 10},dataType: 'text',success: function (data) {alert(data);}})0.2 服务端代码：public void ProcessRequest(HttpContext context){string bodyText = string.Empty;using (var bodyReader = new System.IO.StreamReader(context.Request.InputStream)){bodyText = bodyReader.ReadToEnd();}string name= context.Request["name"].ToString();// "admin"string age = context.Request["age"].ToString();// "10"context.Response.ContentType = "text/plain";context.Response.Write(bodyText);// "name=admin&age=10"}0.3 在浏览器的⽹络中查看此次请求：从上⾯的截图中可以看出，post请求，是将formdata中键值对⽤符号“&”相连，拼接成⼀个字符串，传递到服务端，服务端可以通过key来获取值，或从request的body中读取整个字符串；1、ajax 传递复杂json对象到服务端1.1 ⽅法⼀：通过formdata传值，服务端通过key获取值；客户端代码：var user1 = {username: 'admin',age: 10};var user2 = {username: 'test',age: 11};var userArr = [];userArr.push(user1);userArr.push(user2);$.ajax({url: 'TestHandler.ashx',type: 'post',//contentType: 'application/json',//contentType:"application/x-www-form-urlencoded; charset=UTF-8",data: {Users: JSON.stringify(userArr)},dataType: 'text',success: function (data) {alert(data);}})服务端代码：public void ProcessRequest(HttpContext context){string contentType= context.Request.ContentType;// "application/x-www-form-urlencoded; charset=UTF-8"string users = context.Request["Users"].ToString();dynamic obj = JsonConvert.DeserializeObject(users);context.Response.ContentType = "text/plain";context.Response.Write(obj[0].username);// "admin"}1.2 ⽅法⼆：通过formdata⽅式传值，服务端读取Request.InputStream;前端代码：var user1 = { username: 'admin', age: 10 };var user2 = { username: 'test', age: 11 };var userArr = [];userArr.push(user1);userArr.push(user2);$.ajax({url: 'TestHandler.ashx',type: 'post',//contentType: 'application/json',//contentType:"application/x-www-form-urlencoded; charset=UTF-8",data: JSON.stringify(userArr),dataType: 'text',success: function (data) {alert(data);}})服务端代码：public void ProcessRequest(HttpContext context){string contentType= context.Request.ContentType;//"application/x-www-form-urlencoded; charset=UTF-8"string bodyText = string.Empty;using (var bodyReader = new System.IO.StreamReader(context.Request.InputStream)){bodyText = bodyReader.ReadToEnd();// [{"username":"admin","age":10},{"username":"test","age":11}]}dynamic obj = JsonConvert.DeserializeObject(bodyText);context.Response.ContentType = "text/plain";context.Response.Write(obj[0].username);// "admin"}通过浏览器查看此次请求：从图中可以看出，content-Type 为application/x-www-form-urlencoded，所以浏览器尝试将传输的数据解析成key-value的形式，但实际在ajax中的data中设置的是⼀个json字符串，⽆法解析成key-value的形式，故在服务端⽆法通过key来获取值；只能从Request.InputStream获取。

jQuery操作Ajax和Json

jQuery操作Ajax和Json嗯，自己学SSH和做项目也已有两个月了。

自己今天来整理一下自己在项目中利用jQuery操作过的Ajax和Json。

当时我对于jQuery操作Ajax几乎不怎么了解，但是项目中有需求，所以自己也是必须要去使用，因此现在来详细讲解一下自己在项目中的操作。

功能中，有一个下拉框，里面存储的是服务商的信息，首选项是“--请选择--”，当我选择第一个下拉框中服务商信息之后，后面紧接着将会得到这个选定的服务商下的所有产品。

做一个联动操作。

虽然我不会用jQuery操作Ajax，但是我第一反应就是想到利用这块技术，于是自己就开始查找对应的资料了。

首先，我在Action中，将服务商的信息从数据库查找出来，保存到List集合中，将集合转发到JSP界面上，利用的是struts2标签：<div><s:select name="provider.iscenicid"list="#request.providerList"listKey="i scenicid"listValue="szcenicname"headerKey=""headerValue="--请选择"onchange="onChangeOptionScenic(this)"id="scenicType"/></s:select><span id="productInfo"></span></div>（ps:其实这个里面，本不应该设置headerKey和headerValue，应该在Action中在List集合中去增加一行再进行操作。

）中间的span标签就是将要利用jQuery操作Ajax把产品信息增加到span标签里面！其次，进行jQuery操作Ajax了：<script>function onChangeOptionScenic(_this) {// 获取下拉框中的listKey值var iscenic =$(_this).val();// 设置一个变量，来进行下面的操作var htmltv ="";// 设置URL地址var url ="/tips/travelmessage.action";// Ajax操作开始$.ajax ({// 设定URLurl : url,// 设置提交方式，这里为posttype : "post",// 设置数据类型为JsondataType : "json",// 设置传过去的值的属性名data : {"iscenicid" : iscenic},// 成功返回之后的操作方法success : function(result) {// 获取Action中传回来的result的值var json =eval("("+result+")");// 循环将服务商下的产品以复选框形式拼接出来for(var i=0; i<json.length; i++) {// 将产品信息以复选框形式拼接起来htmltv +="<input type='checkbox' name='productNa me'value='"+json[i].productId+"'/>"+json[i].prod uctName;}// 添加到上面的span标签中$("#productInfo").val(htmltv);}});}</script>最后，将result进行一个映射文件的配置，配置信息如下（根据公司的一些设定而操作）：<action name="travelmessage"class="com.web.system.tips.TravelMessageAction" method="trav elMessage"><result type="json"><param name="root">result</param></result></action>在TravelMessageAction中，需要将内容返回到result中，部分代码如下：List productList = travelMessageService.getProductInfo(product);JSONArray json =new JSONArray().fromObject(productList);result = json.toString();return SUCCESS;至此，一个完整的操作已完成，这就是自己的一点点整理，希望以后有更多的有技术的知识与大家分享！。

使用JSON进行网络数据交换传输详细

使用JSON进行网络数据交换传输详细JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，常用于前端与后端的网络数据传输。

它以键值对的形式组织数据，并以简洁易读的方式表示复杂的数据结构。

在网络通信中，JSON可以作为通过HTTP请求传输数据的一种格式，而JSON解析器可以将接收到的JSON文本转换为对应的数据结构。

本文将详细介绍使用JSON进行网络数据交换传输的过程。

首先，需要明确网络数据交换传输的两个角色：发送方和接收方。

发送方负责将需要传输的数据封装成JSON格式，然后通过网络发送给接收方。

接收方接收到JSON数据后，通过JSON解析器将其解析成对应的数据结构，从而能够对数据进行处理。

发送方的工作流程如下：1.确定需要传输的数据：发送方首先需要明确想要传输的数据，例如用户的姓名、年龄等。

2. 组织数据成JSON格式：将需要传输的数据按照键值对的方式组织成JSON格式。

例如，{"name": "Tom", "age": 20} 是一个包含姓名和年龄的JSON对象。

3.发送JSON数据：使用网络通信协议（如HTTP）将JSON数据发送给接收方。

可以使用编程语言提供的网络通信库来实现。

接收方的工作流程如下：1.接收JSON数据：接收方通过网络接收到发送方发送的JSON数据。

2.解析JSON数据：使用JSON解析器将接收到的JSON数据解析成对应的数据结构。

不同编程语言提供了各自的JSON解析器，可以根据实际需求选择合适的解析器。

3.处理数据：接收方可以根据需要对解析后的数据进行处理，例如存储到数据库、展示在前端界面等。

JSON的优势及其适用场景：1.简洁易读：JSON使用键值对的格式组织数据，使其更易于理解和阅读。

2.跨平台、跨语言：JSON是一种独立于编程语言和平台的数据格式，可以在不同的系统和编程语言中进行数据交换。

ajax传值,jQuery.ajax,json格式转化和前台后台传值

1.ajax传输用字符串，后台接收参数用request.getParameter，所以前台必须有Parameter 如"/FirstServlet/regPage?countryId=" + countryId2.后台向前台传参数通过response，PrintWriter pw = resp.getWriter();pw.print(“df”);前台接收参数用var txt = xhr.responseText;3.如果用json字符串传输前台用jQuery.ajax是如下data : {'mydata':jsonStr},jQuery.ajax({type: "post",url: url,dataType : 'json',data : {'mydata':jsonStr},success: function(data,textStatus){alert("操作成功");},error: function(xhr,status,errMsg){alert("操作失败!");}});后台一样用request如String jsonStr = ServletActionContext.getRequest().getParameter("mydata");4.后台向前台传值一样用response如pw.print(jsonList.toString());前台接收jQuery用success: function(data,textStatus)data就是一个json（自动将json字符串转化为了json）5.json与json字符串之间的转化json的格式两种：数组["hello", 12, true , null];和对象{ "color": "red", "doors" : 4, "paidFor" : true };前台：json-json字符串JSON.stringify(jsonobj);$("#form").serialize()//表单转化为json字符串json字符串-jsoneval('(' + jsonstr + ')');JSON.parse(jsonstr);使用Function对象来进行返回解析function(data,textStatus){后台：json-json字符串jsonObj.toString()json字符串-jsonJSONObject obj1 = JSONObject.fromObject("{'dsaf':'uuuu'}");JSONObject obj = JSONObject.fromObject(address);//把对象转化为json。

利用JSON实现客户端与服务器端通信

2018.04 V 电B 纗程技巧与维护
实用第一/ 智慧密集
Android客户端首先获取用户的位置生成JSON格式的数据并将数据发送给服务器，服务器解析数据之后根据解析结果提供的条件对数据库中的数据进行操作获得符合条件的数据并封装为JSON格式返回至Android客户端。 Android端通过 org.json包解析数据并进行U I处理后呈现给用户。在 Android中 JSON数组格式可以用 JSONArray类处理。详细过程如图1 所示。
用户通过 Android客户端完成实例中的业务时，
基金项目：湖北省高等学校2017年省级大学生创新创业训练计划项目（No.201710488024)。作者简介：金鸣（1998-)，女，本科，研究方向：软件工程；袁嵩（1976-)，男，副教授，研究方向：软件工程；刘荣（1997-)，女，本科，研究方向：软件工程。收稿日期：2018-01-16
由于服务器端和客户端打交道的实际上是JSON协议，而 JSON是跨语言的，所以一方面在服务器端可以采用多种技术，如 JSP、Java等；另一方面，服务器端/ 客户端接口设计好之后，使用任意一种技术的服务器，使其响应的 JSON格式可以提供多种客户端使用，如 Android客户端、基于 JavaScript的网页客户端等[3]。
图 1 Android端与服务器端交互过程
具体代码实现如下： (1) Android端获取用户位置并向服务器端发送请求； p「ivate B oolean「epo「tAdd「ess () th「ows I〇Exception, NETWo「kException {

Ajax请求传递data数据三种格式：

Ajax请求传递data数据三种格式：ajax有三种传递传递data的⽅式：1、json格式2、标准参数模式3、json字符串格式1.json对象格式：{“username”:”chen”,”nickname”:”alien”}$.ajax({type:"post",url:"/test/saveUser",data:{"username":"chen","nickname":"alien"},dataType:"json", //指定响应的data数据类型为JSON对象。

success: function(data){console.log(data);}});如：当前的Ajax请求是⼀个POST请求，对请求体中的数据使⽤默认的数据编码，格式如：key1 = value2&key2 = value2 a中的数据变成这样的格式：key1 = value2&key2 = value2 ，包装在Http请求体中传送给后台。

dataType:"json"dataType:“json” ：⽤来指定服务器返回的data数据类型必须是JSON类型。

然后jQuery就会把后端返回的json字符串尝试通过JSON.parse()解析为js对象。

如果不指定dataType，jQuery 将⾃动根据 HTTP 包的 MIME 信息来智能判断，若MIME信息的值为JSON，则jQuery会⾃动的把data数据转换成JS对象的json，接着Script把data传递给回调函数进⾏JS的脚本操作。

2、标准参数模式形如：“username=Liudehua & age=50”$.ajax({type:"post",url:"/test/saveUser",data:"username=chen&nickname=alien",dataType:"json",success: function(data){console.log(data);}});$(“#form1”).serialize() 就是把表单的数据拼成这个格式（key1 = value2&key2 = value2）的字符串，然后放在Http请求体中传给后台！3.json字符串 ————>只⽤于post请求形如：“{“username”:”chen”,”nickname”:”alien”}”————>JSON对象格式的字符串或者JSON.stringify({“username”:”chen”,”nickname”:”alien”})————>把JSON对象转成JSON格式的字符串。

$.ajax使用方法

$.ajax使用方法$.ajax是jQuery中的一个方法，用于执行异步HTTP（Ajax）请求。

以下是$.ajax的基本使用方法：1.创建请求：```javascript$.ajax({url:"example.php",//请求的URL地址type:"GET",//请求方式，GET或POST dataType:"json",//预期服务器返回的数据类型，可以是xml、json、script、html等success:function(data){//请求成功后的回调函数console.log(data);//输出服务器返回的数据},error:function(){//请求失败时的回调函数console.log("请求失败");}});```2.发送数据：```javascript$.ajax({url:"example.php",type:"POST",data:{foo:"bar"},//要发送到服务器的数据，以键值对的形式表示dataType:"json",success:function(data){console.log(data);},error:function(){console.log("请求失败");}});```3.处理服务器响应：在成功回调函数中，服务器返回的数据作为参数传递给回调函数。

可以根据需要处理这些数据，例如更新页面内容或执行其他操作。

4.配置选项：$.ajax方法接受一个配置对象作为参数，其中包含以下选项：-`url`：请求的URL地址。

-`type`：请求方式，默认为"GET"。

-`dataType`：预期服务器返回的数据类型，默认为"html"。

jqueryajax调用springboot接口发送json数据示例，兼容跨域调用，解决m。。。

jqueryajax调⽤springboot接⼝发送json数据⽰例，兼容跨域调⽤，解决m。

本⽂主要解决三个问题：1.解决maven项⽬中引⽤本地lib⽬录的jar包时打包失败的问题2.解决spring boot开发的微服务接⼝中的跨域问题3.ajax 发送json数据的问题昨天研究 office 外接程序开发时，发现在插件中调⽤后台由 Spring boot 开发的接⼝并传递json时总是失败，调试了半天，尝试了$.ajax，$.post等⽅法服务端均⽆法获取到正确的请求，发送到后端的请求的格式是application/www-urlencode，⽽后端接受的是application/json格式的数据，由于⽤postman测试接⼝可以正常返回，应该可以说明后台接⼝没有问题。

1.解决maven项⽬中引⽤本地lib⽬录的jar包时打包失败的问题其实在⼀开始编写后台接⼝时，也遇到了⼀些问题，因为接⼝中引⽤了⼀个项⽬本地的lib⽬录中的jar包，⽽这个jar包并未⽤maven管理，所以调试和打包上遇到了⼀些问题，以前使⽤mvn clean install就可以完成的动作，现在⼀直报错，在pom中这样修改就可以解决了：<build><resources><resource><directory>lib</directory><targetPath>/BOOT-INF/lib/</targetPath><includes><include>**/*.jar</include></includes></resource></resources><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-compiler-plugin</artifactId><configuration><skip>true</skip></configuration></plugin><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-surefire-plugin</artifactId><configuration><skip>true</skip></configuration></plugin></plugins></build>2.解决spring boot开发的微服务接⼝中的跨域问题由于服务端⽇志中⼀直观察不到ajax调⽤的正确请求，于是祭出终极⼤杀器——抓包，打开WireShark，选择对应的⽹卡，参数设置成：ip.dst_host== 你接⼝服务器的ip && tcp.dstport ==你接⼝服务监听的端⼝抓包后发现，第⼀个HTTP请求竟然不是POST，⽽是OPTIONS：这不是我嘞个⼤擦了么…… ⽴马拿出万能钥匙——⾕歌搜索引擎开始解决问题，输⼊关键字“http options request”，看到第⼀条就应该是我要的答案了：沿着指路明灯给出的航向继续前进（）：OPTIONSThe HTTP OPTIONS method requests permitted communication options for a given URL or server. A client can specify a URL with thismethod, or an asterisk (*) to refer to the entire server.继续往下翻，看到了这段⽂字：In , a is sent with the OPTIONS method so that the server can respond if it is acceptable to send the request. In this example, we will request permission for these parameters:The header sent in the preflight request tells the server that when the actual request is sent, it will have a request method.The header tells the server that when the actual request is sent, it will have the X-PINGOTHER and Content-Type headers.我恍然⼤悟，原来是跨域调⽤的问题。

ajax的send方法

ajax的send方法Ajax的send方法是在前端开发中经常使用的一种技术，用于向服务器发送请求并获取响应数据。

本文将详细介绍Ajax的send方法的用法和相关注意事项。

我们需要了解什么是Ajax。

Ajax是一种在不重新加载整个页面的情况下，通过与服务器进行少量数据交换来更新部分网页的技术。

通过Ajax，我们可以实现页面的异步加载，从而提升用户体验。

在使用Ajax时，我们常常需要使用到send方法。

该方法用于将请求发送到服务器，并返回服务器响应的数据。

下面是send方法的基本用法：```javascriptxhr.send(data);```其中，xhr是一个XMLHttpRequest对象，用于创建和发送HTTP 请求。

data是可选的参数，用于向服务器发送数据。

在使用send方法时，我们需要注意以下几点：1. 请求方法的选择：在发送请求之前，我们需要确定使用何种请求方法。

常见的请求方法有GET和POST。

GET方法用于从服务器获取数据，而POST方法用于向服务器发送数据。

根据实际需要选择合适的请求方法。

2. 请求头的设置：在发送请求之前，我们可以设置一些请求头信息，例如设置Content-Type、Accept等。

这些请求头信息可以帮助服务器正确处理请求。

3. 请求参数的处理：如果需要向服务器发送数据，我们需要将数据以特定的格式传递给send方法。

可以使用URL编码、JSON格式等方式进行数据传递。

4. 异步与同步：默认情况下，send方法是以异步方式发送请求的，即不会阻塞页面的加载。

但也可以通过设置xhr的async属性为false，将请求设置为同步方式发送。

5. 响应数据的处理：send方法返回的是一个XMLHttpRequest对象，我们可以通过该对象的属性和方法来获取服务器的响应数据。

常用的属性有status、statusText、responseText等，用于获取服务器返回的状态码、状态文本和响应内容。

使用JSON进行数据传输的使用技巧及注意事项

使用JSON进行数据传输的使用技巧及注意事项JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，常用于前后端数据传输和存储。

它可读性强，易于解析和生成，广泛应用于Web开发和移动应用程序。

本文将讨论使用JSON进行数据传输的一些使用技巧和注意事项。

一、什么是JSON？JSON是一种文本格式，通过对值和对象的集合进行编码，使得数据可以在不同的系统之间进行传输和解析。

与XML相比，JSON的格式更加简洁，不含多余的标签和属性，因此更加轻量级，解析速度也更快。

二、JSON的基本结构JSON由键值对组成，使用大括号{}表示一个对象，每个键值对之间用逗号分隔。

键名必须是字符串，且必须用双引号括起来；键值可以是字符串、数字、布尔值、数组、对象或null。

以下是一个示例：```json{"name": "John","age": 30,"isEmployed": true,"hobbies": ["reading", "running"],"address": {"street": "123 Main St","city": "New York"},"spouse": null}```三、使用技巧及注意事项1. 保持数据结构简洁：在设计JSON数据结构时，尽量保持简洁，只包含必要的键值对。

避免冗余和重复的数据，这样可以减小传输的数据量，提高效率。

2. 使用合适的数据类型：JSON支持多种数据类型，包括字符串、数字、布尔值、数组、对象和null。

在选择数据类型时，应根据实际情况进行判断。

例如，对于日期和时间，可以使用字符串类型来表示；对于列表，可以使用数组类型。

C#开发的WebService使用JSON格式传递数据+Ajax测试

C#开发的WebService使⽤JSON格式传递数据+Ajax测试0 2因為⼀些因素，必須改寫WebService，很傳統，但是很多公司還在⽤..因為XML 的關係，不想讓他傳遞資料的時候過度肥⼤，所以我必須要盡量乾淨的JSON..於是開始我的改寫旅程..0 2⾸先，網路上好多好多好多⽂件，可能因為狀況不同，測試過許多也讓我搞混很多次..最後有找到答案..筆記⼀下..0 2⾸先我開了三個不同的WebMethod 來測試三種不同的輸出..0 2GetUserInfoString –取得字串GetOneUserInfo - 取得⼀個物件GetUsers - 取得物件們0 2using System.Collections.Generic;using System.Web.Script.Services;using System.Web.Services;namespace JsonServiceSample{public class User{public string Name { get; set; }public int Age { get; set; }}[WebService(Namespace = "", Description = "For Donma Test")][ponentModel.ToolboxItem(false)][ScriptService]public class Service1 : WebService{[WebMethod][ScriptMethod(ResponseFormat = ResponseFormat.Json)]public string GetUserInfoString(string name, int age){return name + "," + age;}[WebMethod][ScriptMethod(ResponseFormat = ResponseFormat.Json)]public User GetOneUserInfo(string name, int age){return (new User { Name = name, Age = age });}[WebMethod][ScriptMethod(ResponseFormat = ResponseFormat.Json)]public User[] GetUsers(string name, int age){List<User> res = new List<User>();res.Add(new User { Name = name + "1", Age = age });res.Add(new User { Name = name + "2", Age = age });return res.ToArray();}}}0 2如這篇 0 2 0 2 我先移除xml namespace再來⼀個重點，在每⼀個Method 上⽅我都會加上0 20 2[WebMethod][ScriptMethod(ResponseFormat = ResponseFormat.Json)]因為基於有時候我會需要使⽤GET ⽅式傳遞所以我在Web Config 中加⼊在system.web 中加⼊0 2<webServices><add name="HttpGet"/><add name="HttpPost" /><add name="Documentation" /></protocols></webServices>0 2Web.Config 全⽂:0 2<?xml version="1.0"?><configuration><configSections><sectionGroup name="applicationSettings" type="System.Configuration.ApplicationSettingsGroup, System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" ><section name="JsonServiceSample.Properties.Settings" type="System.Configuration.ClientSettingsSection, System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" requirePermission="false" </sectionGroup></configSections><system.web><compilation debug="true" targetFramework="4.0" /><httpHandlers></httpHandlers><webServices><protocols><add name="HttpGet"/><add name="HttpPost" /><add name="Documentation" /></protocols></webServices></system.web><applicationSettings><JsonServiceSample.Properties.Settings><setting name="JsonServiceSample_JTestService_Service1" serializeAs="String"><value>http://localhost:5403/Service1.asmx</value></setting></JsonServiceSample.Properties.Settings></applicationSettings></configuration>0 2這樣試跑⼀下0 20 2奇怪為什麼不是JSON ，別緊張…我們繼續使⽤ JQuery 來呼叫看看..0 2JQuery Code :0 20 2<input type="button" id="ipt1" value="test" /><script type="text/javascript">1: 0 22: function GetInfo() {3: var $res;4: $.ajax({5: type: "POST",6: url: "Service1.asmx/GetOneUserInfo",7: contentType: "application/json; charset=utf-8",8: async: false,9: cache: false,10: dataType: 'json',11: data: "{name:'當⿇',age:29}",12: success: function (data) {13: if (data.hasOwnProperty("d")) {14: $res = data.d;15: }16: else17: $res = data;18: }19: });20: return $res;21: }22:24: $('#ipt1').click(function () {25: var res = GetInfo();26: alert();27: });28:29:</script>按鈕按下去之後我讓他呼叫 GetOneUserInfo 這 method並且使⽤POST看下結果..0 20 2恩恩..的確是JSON，但是多了⼀個 d 0 2 跟 __type 基本上 0 2 __type 不要去動他是不影響，但是 0 2 d 這東西必須得處理..所以我參考這⼀篇 :進⾏改寫..實測過上⾯三種不同的回傳值..都 OK~~0 2這樣對於傳統的 WebService Reference 呼叫 0 2 WebService 不會有影響..也可以透過JQuery 呼叫傳遞透過JSON…筆記⼀下..給需要的⼈…。

使用jQuery的ajax方法向服务器发出get和post请求的方法

使⽤jQuery的ajax⽅法向服务器发出get和post请求的⽅法打算写个ajax系列的博⽂，主要是写给⾃⼰看，学习下ajax的相关知识和⽤法，以更好的在⼯作中使⽤ajax。

假设有个⽹站A，它有⼀个简单的输⼊⽤户名的页⾯，界⾯上有两个输⼊框，第⼀个输⼊框包含在⼀个form表单⾥⽤来实现form提交，第⼆个输⼊框是单独的、没有包含在form⾥，下⾯就⽤这两个输⼊框来学习下jQuery的ajax。

1，前端的html和javascript代码页⾯html<main style="text-align: center; margin: 200px auto;"><h2>输⼊⽤户名</h2><form class="" action="demo01.php" method="post" style="margin-bottom: 20px;"><input id="user-name" type="text" name="username" placeholder="请填写您的⽤户名"><input type="submit" name="submit1" value="form提交1" class="input"></form><input id="user-name2" type="text" name="username2" placeholder="请填写您的⽤户名"><input type="button" name="submit2" value="ajax提交2"><div class="box"></div></main><script src="../../js/jquery-3.1.0.min.js"></script><script src="demo.js"></script>页⾯中引⼊的demo01.js代码，注意此处实现的是⼀个简单的GET请求。

浅谈JSON在Ajax数据交换中的应用

的有效性。
【键词】ｊ；ＯＮ；关：ＡａＪｘＳＸＭＬ
当微软在Ｉ中添加了用于执行ＪｖＳｒｔＥａａｃｉ的ｒｙ）ｐａ。下面是一个ＪＯＳＮ格式的数据示例：ＡｔｅＭＬ１Ｐ对象以后．ｊｘ术得到了很ｃｉＸＸＨ＿ｖｒＡａ技｛ｅ：ｉｍｓｔ［大的发展。通过Ａａ技术．Ｂ应用程序实现了ｉｘＷＥ｛ｉ ” １，ｎｌｅ：ａｐｅ，ｐｓｗｒ ” ” ｐｌ１３｝ ” ： ” ” ａｌ” ” ｐｌ ” ” ａｓｏｄ：ａｐｅ２ ”，ｄ ” ｌ页面的局部刷新．减少因传输数据量大而造成的用户等待时间．面更加友好。其中以Ｘ界ＭＬ标准］ｌ；编码的数据发挥了较大的作用．Ｘ但ＭＬ也有很大应用ＸＭＬ表达上面的示例相比较为复杂．这的局限性．文通过比较ＪＯ本ＳＮ和Ｘ．明使用里就不做阐述ＭＬ证
２１０２年第７期
福建电
脑 Βιβλιοθήκη １９５浅谈ＪＯＳＮ在Ａａ据交换中的应用ｊｘ数
谭恒松
（浙江工商职业技术学院浙江宁波３５１１０２）
【摘要】本文介绍了ａａ术，并比较了ＸＩＪＯＮ，讨论了两种数据传输格式在：ｊｘ技ＮＬ和Ｓｊｘ数ａａ据交换中的不同．通过实例证明使用ＪＯＮ代替ＸＭＬ作为Ａａ据传输中的数据格式Ｓｊｘ数

向服务器请求数据的五种技术

向服务器请求数据的五种技术在现代Web开发中，向服务器请求数据是非常常见的操作。

为了实现这个功能，开发人员可以利用各种技术与服务器进行通信，并获取所需的数据。

以下是五种常见的向服务器请求数据的技术：1. AJAX（Asynchronous JavaScript and XML）：AJAX是一种基于浏览器端的技术，可以在不重新加载整个页面的情况下与服务器通信。

它通过使用JavaScript和XML或JSON（JavaScript Object Notation）来进行数据交换。

开发人员可以使用AJAX向服务器发送HTTP请求，然后在结果返回后更新页面内容，实现无需刷新页面的动态更新。

AJAX被广泛应用于Web应用程序中，使用户体验更加流畅。

2. Fetch API：Fetch API是一种现代的Web API，专门用于向服务器发送和接收HTTP请求。

它提供了一组简洁的接口，使开发人员可以轻松地进行数据的异步获取。

Fetch API具有强大的功能，支持各种请求方法（例如GET、POST、PUT、DELETE等），并可以处理不同类型的数据格式。

与传统的AJAX相比，Fetch API更加简洁易用，并且内置了Promise 对象，使异步操作更为直观。

3. WebSocket：WebSocket是一种全双工的通信协议，可在客户端和服务器之间实现实时的双向数据传输。

与传统的HTTP请求不同，WebSocket使用单个持久连接与服务器进行通信，并可以在连接建立后进行任意数量的数据传输。

这使得开发人员可以轻松地实现实时消息传递、聊天应用程序等功能。

WebSocket常用于需要实时更新的应用程序，如游戏、股票交易等。

4. Server-Sent Events（SSE）：Server-Sent Events是一种服务器推送技术，用于从服务器传输实时数据到客户端。

与WebSocket相比，SSE是一种单向的通信协议，仅允许服务器向客户端发送数据，而不支持客户端向服务器发送数据。

使用JSON进行网络数据交换传输详细

使用JSO‎N进行网络‎数据交换 - Andro‎i d2011年‎05月11‎日星期三15:04在开发客户‎端与服务端‎的应用当中‎，数据交换接‎口通常都是‎通过XML‎格式来进行‎数据交换的‎。

近年来，随着AJA‎X技术的兴‎起，JSON作‎为一种轻量‎级的数据交‎换格式，以其易于阅‎读和编写的‎优点，也越来越多‎的被使用到‎各个项目中‎。

在OPho‎n eSDK‎中，也提供了J‎S ON的类‎库方便对J‎S ON格式‎的数据进行‎处理。

本文将快速‎讲解JSON格‎式，并通过代码‎示例演示如‎何分别在客‎户端和服务‎器端进行JSON 格式数据的‎处理。

什么是JS‎O NJSON（JavaS‎c ript‎Objec‎t Nota‎t ion）是一种轻量‎级的数据交‎换格式，易于阅读和‎编写，同时也易于‎机器解析和‎生成，非常适合于‎服务器与客‎户端的交互‎。

JSON采‎用与编程语‎言无关的文‎本格式，但是也使用‎了类C语言‎的习惯，这些特性使‎J SON成‎为理想的数‎据交换格式‎。

和XML 一样，JSON 也是基于纯‎文本的数据‎格式。

由于JSON 天生是为 JavaS‎c ript‎准备的，因此，JSON的‎数据格式非‎常简单，您可以用JSON 传输一个简‎单的 Strin‎g，Numbe‎r，Boole‎a n，也可以传输‎一个数组，或者一个复‎杂的Obj‎e ct 对象。

Strin‎g，Numbe‎r和 Boole‎a n 用JSON 表示非常简‎单。

例如，用JSON 表示一个简‎单的字符串‎“‎abc‎”，其格式为："abc"。

除了字符"，\，/ 和一些控制‎符（\b，\f，\n，\r，\t）需要编码外‎，其他 Unico‎d e 字符可以直‎接输出。

下图是一个‎Strin‎g的完整表示‎结构：图1.Strin‎g的完整表‎示结构一个 Numbe‎r可以根据整‎型或浮点数‎表示如下：图2.Numbe‎r的表示结构‎这与绝大多‎数编程语言‎的表示方法‎一致，例如：12345‎（整数）-3.9e10（浮点数）Boole‎a n 类型表示为‎true 或 false‎。

Ajax（form表单文件上传、请求头之contentType、Ajax传递json数据、。。。

Ajax（form表单⽂件上传、请求头之contentType、Ajax传递json数据、。

form表单⽂件上传上菜file_put.html<form action="" method="post" enctype="multipart/form-data">{# 这⾥必须要请求头格式才能把上传⽂件的对象传过去 enctype="multipart/form-data"#}姓名 <input type="text" name="user">头像 <input type="file" name="head"><input type="submit" ></form>views.pydef file_put(request):if request.method == 'POST':print('post',request.POST) #只有 contenType== urlencoded request 才能拿到这个值print(request.FILES)file_obj = request.FILES.get('head')with open(file_,'wb') as f:for line in file_obj:f.write(line)return HttpResponse('ok')上⾯这个基于form 到表单上传，在传递对象到时候必须要定义请求头格式 nctype="multipart/form-data" 否则传递过来只是⼀个⽂件名称，在服务端接收模版提交的内容必须使⽤ request.FILES 否则拿不到数据，通过创建⽂件句柄，将传递数据循环读取并写⼊⽂件，⽂件名称就是接收⽂件的name值。

ajax发送json数据时为什么需要设置contentType：applicationjson”

ajax发送json数据时为什么需要设置contentType：applicationjson”1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别？contentType: "application/json”，⾸先明确⼀点，这也是⼀种⽂本类型（和text/json⼀样），表⽰json格式的字符串，如果ajax中设置为该类型，则发送的json对象必须要使⽤JSON.stringify进⾏序列化成字符串才能和设定的这个类型匹配。

同时，对应的后端如果使⽤了Spring，接收时需要使⽤@RequestBody来注解，这样才能将发送过来的json字符串解析绑定到对应的 pojo 属性上。

另外，需注意⼀点，json字符串在书写时名称部分需要加上“”双引号，以免⼀些json解析器⽆法识别。

如ajax 请求时不设置任何contentType，默认将使⽤contentType: "application/json”application/x-www-form-urlencoded，这种格式的特点就是，name/value 成为⼀组，每组之间⽤ & 联接，⽽ name与value 则是使⽤ = 连接。

如： /query?user=username&pass=password 这是get请求, ⽽ post 请求则是使⽤请求体，参数不在 url 中，在请求体中的参数表现形式也是: user=username&pass=password的形式。

使⽤这种contentType 时，对于简单的json对象类型，如：{“a”:1,"b":2,"c":3} 这种，将也会被转成user=username&pass=password 这种形式发送到服务端。

⽽服务端接收时就按照正常从from表单中接收参数那样接收即可，不需设置@RequestBody之类的注解。