`
musuny
  • 浏览: 42470 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

ajax请求之JSON.stringify

阅读更多

问题提出:确保后台程序无问题,通过postman能成功提交表单,但是从前台页面用ajax提交却始终执行error的回调函数,debug一下,发现postman发送请求中携带的数据格式为json,但是debug前台页面发送时时一串的attribute1=value1&attribute2=value2&...问题出在哪里?

 

后台接口:

 

/*Controller请求url*/
var url = "${ctx}/developer/register";
/*约定数据格式*/
consume=MediaType.APPLICATION_JSON_VALUE

json数据

 

 

json_data = {
                "loginName": loginName,
                "password": password1,
                "name": name,
                "email": email,
                "sex": sex,
                "avatar": avatar,
                "description": description
            }

 

 

ajax请求代码-方式一

 

$.ajax({
    type: "POST",
    url: url,
    contentType: "application/json",
    dataType: "json",
    data: json_data,
    success: function () {
          window.alert("添加开发者成功");
    },
    error: function (XMLHttpRequest) {
          alert("请求出错:"+XMLHttpRequest.status+XMLHttpRequest.statusText);
    }
 });

ajax请求结果:每次都是执行error,错误码:400,Bad Request。

ajax请求代码-方式二

 

$.ajax({
    type: "POST",
    url: url,
    contentType: "application/json",
    dataType: "json",
    data: json_data,
    success: function () {
          window.alert("添加开发者成功");
    },
    error: function (XMLHttpRequest) {
          alert("请求出错:"+XMLHttpRequest.status+XMLHttpRequest.statusText);
    }
 });

ajax请求结果:弹出“添加开发者成功“对话框,问题解决之。

 

原因:Controller和前台约定传递json格式的数据,因此前台ajax必须传递json格式的数据,通过查文档知,data属性接收的参数类型为String,因此要用JSON.stringify将json对象转换成String类型。

 

附>>jQuery ajax方法链接:http://www.w3cschool.cn/ajax_ajax.html

 

分享到:
评论

相关推荐

    打印json对象的内容及JSON.stringify函数应用

    在上面提供的代码片段中,使用了jQuery的`ajax`方法发起一个POST请求,请求的类型是`json`。这意味着返回的数据类型是JSON格式。无论在请求成功还是发生错误时,都会通过回调函数返回一个JSON对象`msg`。这时开发者...

    jquery_json.rar_JSON_jquery_jquery-json_jquery.json_jquery.json.

    在实际应用中,例如,当需要从服务器获取JSON数据并将其显示在网页上时,`$.ajax`或`$.getJSON`等jQuery方法可以用来发送Ajax请求。收到JSON响应后,使用`$.parseJSON`将JSON字符串解析成JavaScript对象,然后可以...

    JSON.js

    8. 使用场景:JSON.js通常适用于Web开发中的数据交换、存储和恢复,如AJAX请求、本地存储(localStorage或IndexedDB)以及前后端数据交互。 9. 开发工具:对于开发过程中调试和检查JSON数据,可以使用在线工具如...

    JSON重要工具: json.js

    通过jQuery,我们可以轻松地从服务器请求JSON数据,并利用`json.js`进行解析,再使用jQuery强大的DOM操作能力来动态更新页面。 例如,我们可以使用`$.ajax`方法从服务器获取JSON数据,然后使用`JSON.parse()`解析...

    json.rar_json js_json map

    另一方面,当你从服务器接收到一个JSON响应,例如通过Ajax请求,你需要使用`JSON.parse()`方法将JSON字符串转换回JavaScript对象,这被称为反序列化。例如: ```javascript let data = '{"name":"John Doe","age":...

    Ajax中使用JSON传输数据

    JSON(JavaScript Object Notation)作为一种轻量级的数据交换格式,因其易读性、易写性和高效性,成为了Ajax通信中数据传输的首选格式。本篇文章将深入探讨在Ajax中如何使用JSON来传输数据,以及涉及到的相关工具和...

    ajax返回json对象.zip

    在IT行业中,Ajax...综上所述,"ajax返回json对象.zip"中的内容可能包含如何构建Ajax请求,如何处理JSON响应,以及相关的错误处理和安全性考量。通过学习这些,开发者可以有效地提升网页的交互性和用户体验。

    json ,json_parse.js

    此外,该文件可能还涉及到异步操作,如Ajax请求,获取JSON数据后使用`JSON.parse()`进行解析。 总结来说,JSON是一种重要的数据交换格式,`JSON.parse()`是JavaScript中解析JSON字符串的关键函数。`json_parse.js`...

    AJAX+JSON例子.rar

    3. 服务器端处理:服务器端脚本(可能是PHP、Node.js、Java等)负责接收AJAX请求,处理业务逻辑,然后以JSON格式返回数据。例如,一个简单的PHP脚本可能如下: ```php $data = array( 'name' => 'John Doe', 'age...

    jQuery+get/post+Ajax+Json

    jQuery的Ajax方法提供了一个统一的接口来处理所有类型的Ajax请求,包括GET、POST、PUT和DELETE等。在上述示例中,我们使用了$.ajax方法,设置type为'POST',data为JSON对象,dataType为'json',以发送JSON数据到...

    json.zip_JSON_ajax json

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它以其简洁明了的文本形式,易于人阅读和编写,同时也方便机器...同时,理解如何在AJAX请求中使用JSON,对于提升Web应用的性能和用户体验至关重要。

    Json.zip_JSON_JSON上传数据

    2. **JSON转换过程**:在JavaScript中,可以使用`JSON.stringify()`方法将JavaScript对象转换成JSON字符串。例如,如果你有一个JavaScript对象: ```javascript let obj = { name: 'John', age: 30, city: 'New ...

    前端项目-json2.zip

    在实际前端项目中,JSON常用于与服务器进行数据交互,如AJAX请求。例如,使用fetch API发送POST请求时,可以将数据转换为JSON格式: ```javascript let data = {name: "John", age: 30}; fetch('...

    深入理解 JSON.docx

    例如,JavaScript中的AJAX请求通常会使用JSON作为数据格式,前端通过JavaScript构建数据对象,然后将其转换为JSON字符串发送给服务器。服务器接收到JSON字符串后,会将其解析为相应的数据结构(如PHP的关联数组),...

    jquery-1.11.1.js+jqury.json.2.4.js.rar

    jQuery JSON插件可能提供了序列化和反序列化JavaScript对象为JSON格式的功能,这对于与服务器进行数据交互非常有用,尤其是涉及到AJAX请求时。 - JSON.parse()和JSON.stringify():这两个是JavaScript内置的JSON...

    AJAX和struts2传递JSON数组

    在前端,我们需要创建一个JSON数组并使用XMLHttpRequest对象或者更现代的fetch API来发送AJAX请求。以下是一个使用jQuery库的例子: ```javascript var data = [ { "name": "item1", "value": "1" }, { "name": ...

    平台java前端ajax,json请求

    xhr.send(JSON.stringify({key1: 'value1', key2: 'value2'})); ``` **4. 平台接收与处理**:在Java后端,使用如Spring MVC或Jersey等框架,可以方便地处理这些JSON请求。例如,在Spring MVC中,你可以创建一个控制...

    前台ajax与后台json传递

    xhr.send(JSON.stringify(data)); ``` 在这个例子中,我们创建了一个新的XMLHttpRequest对象,设置请求方法为POST,目标URL为'/api/data',并指定了Content-Type为'application/json',表示我们将发送Json格式的...

    12JavaScript异步Ajax与json总结.docx

    在Ajax请求中,通常使用`JSON.stringify()`将JavaScript对象转换为JSON字符串,然后发送给服务器,服务器处理后返回JSON数据,前端再通过`JSON.parse()`转换回JavaScript对象。 综上所述,JavaScript异步Ajax技术和...

Global site tag (gtag.js) - Google Analytics