前端使用Ajax请求后台RESTful规范的API接口

HTTP动词	对应操作
POST	新增信息
GET	获取信息
PUT	更新信息
DELETE	删除信息

一、POST-----新增信息

1. 后台接口

@PostMapping(value = "/save")
public String save(@RequestBody(required = true) Emp emp){
	System.err.println(emp.toString());
	// 将数据信息存库
	empService.saveEmp(emp);
	return "Object Save to DB!!!";
}

使用@PostMapping注解，则表示必须用POST方式才能请求该接口；

使用@RequestBody注解，则代表请求该接口时的入参，必须是JSON格式的数据；

2. ajax请求

		var parms = {"id": "1008","name":"小白"};
		$.ajax({
			url:'/save',
			data: JSON.stringify(parms),
			type:'POST',
			dataType:'text',// 返回数据类型，因为后台返回的不是json格式的数据，所以如果这里使用json，则前台控制台打印的会是2，而不是1;
			contentType:"application/json;charset=UTF-8",
			success:function(data) {
				console.log(1)
			},
			error:function(data) {
				console.log(2)
			}
		})

由于后台接口使用了@PostMapping注解，所以ajax中的type属性必须是POST；

由于后台接口使用了@RequestBody注解，所以ajax的data必须是json格式的，所以需要用JSON.stringify()将数据转换为json格式的字符串；

同时需要指定contentType为"application/json;charset=UTF-8"，因为默认的是’application/x-www-form-urlencoded;charset=UTF-8’；

二、GET-----获取信息

1. 后台接口

@GetMapping(value = "/restful/{id}/{orderindex}")
public String info(@PathVariable(required = true) String id, @PathVariable(required = true) long orderindex){
	BoTaskPlan boTaskPlan = new BoTaskPlan();
	boTaskPlan.setId(id);
	boTaskPlan.setOrderindex(orderindex);
	BoTaskPlan bo = this.service.getOne(boTaskPlan);
	return bo.toString();
}

使用@GetMapping注解，则表示必须用GET方式才能请求该接口；

使用@PathVariable注解，则代表请求该接口时的入参在URI上（URI就是URL除了http和域名或IP端口之外的后面那一截）；

2. ajax请求

		var id = "22311";
		var orderindex = "7";
		$.ajax({
			url:'/restful/' + id + "/" + orderindex,
			type:'GET',
			dataType:'json',
			contentType:"application/json;charset=UTF-8",
			success:function(data) {
				console.log(1)
			},
			error:function(data) {
				console.log(2)
			}
		})

由于后台接口使用了@GetMapping注解，所以ajax中的type属性必须是GET；

由于后台使用了@PathVariable注解，所以参数直接放到URL的"/"后，而不是像以前放在?后面；

三、PUT-----更新信息

1. 后台代码

@PutMapping(value = "/restful")
public String update(@RequestBody(required = true) BoTaskPlan bo){   // 使用@PathVariable获取{XXX}中的XXX变量值
	// 更新数据
	service.updateById(bo);
	// 查询数据
	bo = service.getOne(bo.getId());
	return bo.toString();
}

使用@PutMapping注解，则表示必须用PUT方式才能请求该接口；

由于后台接口使用了@RequestBody注解，所以ajax的data必须是json格式的，所以需要用JSON.stringify()将数据转换为json格式的字符串；

2. ajax请求

		var arr = {"createuser":"sa","id":"22311"};
		$.ajax({
			url:'/restful',
			data: JSON.stringify(arr),
			type:'PUT',
			dataType:'json',	
			contentType:"application/json;charset=UTF-8",
			success:function(data) {
				console.log(1)
			},
			error:function(data) {
				console.log(2)
			}
		})

由于后台接口使用了@PutMapping注解，所以ajax中的type属性必须是PUT；

由于后台使用了@RequestBody，所以ajax的data必须是json字符串

四、DELETE-----删除信息

1. 后台代码

@DeleteMapping(value = "/restful/{id}")
public String delete(@PathVariable(required = true) String id){   // 使用@PathVariable获取{XXX}中的XXX变量值
	// 删除信息
	service.deleteById(id);
	// 查询所有信息
	List<BoTaskPlan> list = service.getAll();
	return list.toString();
}

使用@DeleteMapping注解，则表示必须用DELETE方式才能请求该接口；

使用@PathVariable注解，则代表请求该接口时的入参在URI上（URI就是URL除了http和域名或IP端口之外的后面那一截）；

2. ajax请求

		$.ajax({
			url:'/restful/22311',
			type:'DELETE',
			dataType:'json',	
			contentType:"application/json;charset=UTF-8",
			success:function(data) {
				console.log(1)
			},
			error:function(data) {
				console.log(2)
			}
		})

由于后台接口使用了@DeleteMapping注解，所以ajax中的type属性必须是DELETE；

由于后台使用了@PathVariable注解，所以参数直接放到URL的"/"后，而不是像以前放在?后面；