Usando axios para solicitud de interfaz y Java para recibir

1. solicitud de obtención ordinaria de axios

//axios普通get请求
//方法名为test,传入数据value
function test(value) {
    
    
  axios({
    
    
    //请求方式
    method:'get',
    //后端接口路径
    url:'/sys/test',
    //注意这里使用的是params,该属性负责把属性名和属性值添加到url后面,一般和get配合使用,但也能和post配合使用
    params: {
    
    
      //attributeName为属性名,value为属性值
      attributeName:value
    }
  }).then((response) => {
    
    
    //response是一个返回的promise对象,该注释所在的这行一般对该promise对象进行处理从而获取数据
  }).catch((error) => {
    
    
    //对error进行处理
  })
}
 


//Java后端
 
//普通get请求时对应的接收
@GetMapping("/sys/test")
public void test(@RequestParam(value = "attributeName") String attributeName){
    
    
    //axios使用params进行传值,而Java就需要用到@RequestParam来接收params的值,value后的值要对应上params里的属性名,即attributeName,若不写,则value默认为String后的attributeName这一属性名,而且一个请求能拥有多个@RequestParam
}

2. Utilice la solicitud de obtención estándar de descanso

¡Aviso! ! ! Hay una barra invertida/ después de la ruta, tenga cuidado de no omitirla; de lo contrario, el valor pasará a formar parte de la ruta y la ruta de solicitud se convertirá en /sys/test seguido del valor de value, lo que dará como resultado 404

//axios使用restful规范的get请求
 
//方法名为test,传入数据value
function test(value) {
    
    
  axios({
    
    
    //请求方式
    method:'get',
    //后端接口路径+属性值;注意!!!路径后面有反斜杠/,注意不要写漏了,不然value就会变成路径的一部分,请求路径就会变成/sys/test后面跟上value的值,从而导致404
    url:'/sys/test/'+value,
  }).then((response) => {
    
    
    //response是一个返回的promise对象,该注释所在的这行一般对该promise对象进行处理从而获取数据
  }).catch((error) => {
    
    
    //对error进行处理
  })
}
 
/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. Solicitud de publicación + parámetros (excepto el método de solicitud de método y @PostMapping para recibir solicitudes, los demás son los mismos que las solicitudes de obtención normales)

//axios使用post+params请求
 
//方法名为test,传入数据value
function test(value) {
    
    
  axios({
    
    
    //请求方式
    method:'post',
    //后端接口路径
    url:'/sys/test',
    //注意这里使用的是params,该属性负责把属性名和属性值添加到url后面,一般和get配合使用,但也能    和post配合使用
    params: {
    
    
      //attributeName为属性名,value为属性值
      attributeName:value
    }
  }).then((response) => {
    
    
    //response是一个返回的promise对象,该注释所在的这行一般对该promise对象进行处理从而获取数据
  }).catch((error) => {
    
    
    //对error进行处理
  })
}
 
//Java
 
//post+params请求时对应的接收
@PostMapping("/sys/test")
public void test(@RequestParam(value = "attributeName") String attributeName){
    
    
    //axios使用params进行传值,而Java就需要用到@RequestParam来接收params的值,value后的值要对应上params里的属性名,即attributeName,若不写,则value默认为String后的attributeName这一属性名,而且一个请求能拥有多个@RequestParam
}

4. publicación + solicitud de datos

¡Aviso! ! ! Los nombres de atributos en el objeto obj deben ser exactamente los mismos que los nombres de atributos en la clase de entidad de personas, porque cuando los nombres de atributos en el objeto obj coinciden con los nombres de atributos en la clase de entidad de personas, distinguen entre mayúsculas y minúsculas, es decir, distinguen entre mayúsculas y minúsculas.

//axios使用post+data请求
//方法名为test,传入js对象obj,js对象放属性和属性值,例如obj:{userName:张三,age:18}
function test(obj) {
    
    
  axios({
    
    
    //请求方式
    method:'post',
    //后端接口路径
    url:'/sys/test',
    //注意这里使用的是data,该属性负责把属性名和属性值添加到请求体里面,一般和post配合使用,而且不要yong{}把obj对象包裹起来,不然后端无法解析前端传过来的JSON数据
    data: obj
  }).then((response) => {
    
    
    //response是一个返回的promise对象,该注释所在的这行一般对该promise对象进行处理从而获取数据
  }).catch((error) => {
    
    
    //对error进行处理
  })
}
 
//Java后端
 
//post+data请求时对应的接收
@PostMapping("/sys/test")
public void test(@RequestBody People people){
    
    
    //axios使用post+data进行传值,而Java就需要用到@RequestBody来接收data的值,obj里的属性名与people实体类的属性名相同,obj里的属性名和people的属性名就能进行动态绑定从而把obj的属性值set进people实体类里,而一个请求只能拥有一个@RequestBody;注意!!! obj对象里的属性名一定得和people实体类里的属性名一模一样,因为obj对象里的属性名与people实体类里的属性名匹配时,大小写敏感,即区分大小写
 
//对应的People实体类
public class People{
    
    
 
    private String userName;
    
    private Integer age;
 
    public String getUserName() {
    
    
        return userName;
    }
 
    public void setUserName(String userName) {
    
    
        this.userName = userName;
    }
 
    public Integer getAge() {
    
    
        return age;
    }
 
    public void setAge(Integer age) {
    
    
        this.age = age;
    }
 
}

Supongo que te gusta

Origin blog.csdn.net/hmwz0001/article/details/131919201
Recomendado
Clasificación