vue+Springboot 前后端数据交互(1)

最近使用 vue 的 axios 往后端发送数据,结果一直报错,尝试了多种方法

如果vue项目没有打包放在 springboot 项目下的话,需要开启跨域支持

在 vue 项目里 config 目录下的 index.js 文件,找到 proxyTable   加上

'/api': {
        target: 'http://localhost:8089',
        changeOrigin: true,  //支持跨域
        pathRewrite: {
          '^/api': ''
        }
      }

酱紫就可以了!!!

前端直接传对象到后端

this.$axios.post(
      'http://localhost:8089/logins',this.map)
  .then( (res)=>{
       this.list = res.data;
       alert(res.data)
   }).catch( (err)=>{
       console.log(err)
   })

后台接收

    @CrossOrigin
    @RequestMapping(value = "/logins", method = RequestMethod.POST)
    @ResponseBody
    public Boolean Logins(@RequestBody Map map) {
       if(map != null) {
    	   System.out.print(map.get("arr")+" ");
           System.out.print(map.get("specid") + " ");
           System.out.print(map.get("requestList"));
           return Boolean.TRUE;
       }
       return Boolean.FALSE;
    }

使用 @CrossOrigin 注解来支持跨域 ,  参数里使用 @RequestBody 来绑定对象或List

成功接受数据:

 

 

 

你可能感兴趣的:(vue+Springboot 前后端数据交互(1))