vue请求传数据到后台处理数据的方法

vue中使用axios来与后台建立连接

  • 在axios使用post请求中Content-Type: application/json是默认的,对于这个Content-Type,在后台中,我们需要用@RequestBody来处理数据,具体如下

前端传递数据

axios.post("http://localhost:8080/Login", {username : this.sizeForm.username}).then(res=>{
  console.log(res)
})

后端接收数据
实体类

package com.google.pojo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@AllArgsConstructor
@NoArgsConstructor
public class user {
    String name;
    String password;
}

Controller


@CrossOrigin(origins = "http://localhost:8081",maxAge = 3600)  //解决跨域问题
@Controller
public class SecurityController {

@RequestMapping("/Login")
    @ResponseBody
    public HashMap<String, Object> Login( @RequestBody user user, Model model) {
        String username = user.getName();
        String password = user.getPassword();
        HashMap<String, Object> userMap = new HashMap<>();
        userMap.put("username",username);
        userMap.put("password",password);
        return userMap;
    }
}

注意这里有跨域问题
我们需要在该类上添加注释@CrossOrigin

posted @ 2022-03-19 10:37  小罗要有出息  阅读(1523)  评论(0编辑  收藏  举报