vue axios springboot2.0 跨域请求

试了网上很多的教程，包括添加代理等等，均无功而返，还是提示403。
于是，改用配置服务端的方法。

后端

• 直接在controller上加CrossOrigin注解

@CrossOrigin		//重要
@RestController
@RequestMapping("vue")
public class VueApi {
    @RequestMapping("test")
    public Object test(@RequestBody JSONObject o){
    	System.out.println(o.toJSONString());
    	return o;
    }
}

前端

• 新建一个vue-cli项目
• 安装axios 命令：npm install axios
• 在main.js中加入
  import axios from 'axios'
Vue.prototype.$axios = axios
• 在需要调用的页面写入代码 例如：

<template>
  <div class="hello">
    <button @click="requestTest()">发送请求</button>
  </div>
</template>
<script>
export default {
  methods: {
    requestTest() {
      //第一个参数是请求地址，对应你后台服务的地址，第二个参数是数据，这里发送一个json
      this.$axios.post("http://127.0.0.1:8281/vue-test/vue/test",{
        name:"goat"
      }).then(response => {
      	//其中response包含所有信息（状态，头等等）,response.data则是服务端发回的数据信息
        console.log(response.data);
      });
    }
  }
};
</script>

• npm run dev 现在试试点击按钮实现前后端通讯
  此交互环节重点是springboot里的CrossOrigin注解