1. フロントエンドは json オブジェクトを渡し、バックエンドは json オブジェクト内のどのパラメーターを受け取るかを指定します。
(1) フロントエンドリクエスト
axios({
//请求方式
method:'post',
//后端接口路径
url:'http://127.0.0.1:8080/api/deleteUserById',
//注意这里使用的是params,该属性负责把属性名和属性值添加到url后面,一般和get配合使用,但也能 和post配合使用
params: {
id: id
}
}).then((response) => {
if(response){
$.messager.alert("信息提示","删除成功!");
}else{
$.messager.alert("信息提示","删除失败!");
}
}).catch((error) => {
console.error('请求失败', error);
})
(2) バックエンドインターフェース(パラメータアクセス方法)
//根据ID删除用户 请使用
@RequestMapping(value = "/api/deleteUserById")
@ResponseBody
public boolean deleteUserById(@RequestParam(value="id",required = true) Integer id) {
int rowsDeleted = userMapper.deleteUserById((long)id);
if (rowsDeleted > 0) {
return true;
} else {
return false;
}
}
2. Axios は RESTful 標準 get リクエストを使用し、バックエンドは @PathVariable を使用してパラメータを受け取ります。バックエンド
インターフェイスのパス + 属性値。注意してください。!!パスの後にバックスラッシュ / があります。省略しないように注意してください。省略しないと、値がパスの一部となり、リクエスト パスは /sys/test の後に value の値が続くことになり、404 (1) Front となります。 -終了リクエスト
:
//方法名为test,传入数据value
function test(value) {
axios({
//请求方式
method:'get',
url:'/sys/test/'+value,
}).then((response) => {
//response是一个返回的promise对象,该注释所在的这行一般对该promise对象进行处理从而获取数据
}).catch((error) => {
//对error进行处理
})
}
(2)Javaバックエンド
//使用restful请求时对应的接收
@GetMapping("/sys/test/{accept}")
public void test(@PathVariable("accept") String(传进来的数据的类型) attributeName){
//axios使用restful的方式进行传值,而Java就需要用到@PathVariable来接收url后的值,/sys/test/{accept}里的accept必须和@PathVariable("accept")里的accept名字一致,而且一个请求能拥有多个@PathVariable
}
3. @RequestBody 受信タイプ
(1) フロントエンドリクエスト
let id = $("#id").val();
let paras = {
id: id
}
axios.post('http://127.0.0.1:8080/api/deleteUserById',paras).then(function (response){
if(response){
$.messager.alert("信息提示","删除成功!");
}else{
$.messager.alert("信息提示","删除失败!");
}
})
(2)Javaバックエンド
@RequestMapping("/api/deleteUserById")
@ResponseBody
public boolean deleteUserById(@RequestBody User user) {
long id=user.getId();
int rowsDeleted = userMapper.deleteUserById((long)id);
if (rowsDeleted > 0) {
return true;
} else {
return false;
}
}
(3) フロントエンドはajaxリクエストも利用できますが、data:JSON.stringify(paras)の記述方法がaxiosとは異なるので注意してください。
$.ajax({
url: 'http://127.0.0.1:8080/api/deleteUserById',
type: 'POST', // 或者其他请求方法,例如'GET', 'DELETE', 'PUT'等
contentType: 'application/json', // 指定请求的数据类型为JSON
data: JSON.stringify(paras), // 将JSON对象转换为JSON字符串并设置为请求体数据
success: function(response) {
if(response){
$.messager.alert("信息提示","删除成功!");
}else{
$.messager.alert("信息提示","删除失败!");
}
},
error: function(error) {
console.error('请求失败', error);
}
});