关于ajax、axios的请求格式后端接收的注意点-白红宇

关于ajax、axios的请求格式后端接收的注意点

阅读量：3922 次

发布时间：2019-05-23

本文共 2331 字，大约阅读时间需要 7 分钟。

首先区分contentType和dataType

$.ajax({
       url:"user/testAjax",    async:true, //false同步， true异步    //默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型    contentType:"application/json;charset=utf-8",    //将json对象转换成json字符串    data:JSON.stringify({
   "username":"黄yt","password":"123456","age":21}),    dataType:"json",//可以不用，一般自动识别。    type:"post",    success:function (data) {
           alert("回调成功")    },    error:function (data) {
           alert("回调失败")    },});

processData
类型：Boolean
默认值: true。默认情况下，通过data选项传递进来的数据，如果是一个对象(技术上讲只要不是字符串)，都会处理转化成一个查询字符串，以配合默认内容类型 “application/x-www-form-urlencoded”。如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。

contentType: 告诉服务器，我要发什么类型的数据

dataType：告诉服务器，我要想什么类型的数据，如果没有指定，那么会自动推断是返回 XML，还是JSON，还是script，还是String。

后端：

@ResponseBody    @RequestMapping(value = "/testAjax")    public String testAjax(@RequestBody User user){        System.out.println("testAjax执行" + user);        return "SSSS";    }

var formData = new FormData();formData.append("image", this.file);formData.append("name", this.bean.name);axios.put(url, formData).then(function(response){
   	if(response.data.code==1){
   		location.href = vue.skip_url;	}	else{
   		alert("提取数据失败...");	}});

1、用 FormData 传数据时，请求格式为 multipart/form-data，后端只需写好对应key的参数名就可接收。

2、用 form 表单传数据时，请求格式为 application/x-www-form-urlencoded ， key=value形式，后端只需写好对应key的参数名就可接收。

3、传送的是一个对象时，请求格式为application/json，后端就要用 @RequestBody 去接收这个实体了

后端接收前端数组：

前端请求格式是Json:

saveChange: function(){					var id = id;					var url = this.uri;					var array = new Array();					var value = '';					var pvid = 0;					var ptid = 0;					var pid = this.product.id;               		$(".propertyValue").each(function(){               			var bean = {id:0, value:'', product:{id:0}, property:{id:0}};               			value = $(this).val();               			pvid = $(this).attr("pvid");               			ptid = $(this).attr("ptid");               			bean.value = value;               			bean.id = pvid;               			bean.property.id = ptid;               			bean.product.id = pid;               			array.push(bean);               		});               							axios.put(url, array).then(function(response){						alert("success");					});				}

后端用@RequestBody接收

@PutMapping("/propertyValues")	public Result update(@RequestBody List
   
     array){		return Result.success();	}

转载地址：http://gyern.baihongyu.com/

你可能感兴趣的文章