使用Vue自带的代理功能解决跨域问题

我们在使用Vue开发时，有时会遇到跨域问题。

我们可以将请求去掉前缀，如以下代码所示

this.$axios.get("/nav/getAllNav")

这样，请求的前缀就默认是前端启动的dev的地址和接口。

再在config/index.js中的dev对象下加上

proxyTable: {
  '/nav':{//配置代理地址，前端请求的所有接口都需要带的前缀
    target:'http://1.15.186.160:8002/',
    changeOrigin:true,//是否进行跨域
  }
},

target写上目标地址，可为本地服务或远端服务，即可实现跨域。

 

后端也可以单独处理跨域问题。

如在需要跨域的接口控制器上加上@CrossOrigin(allowCredentials = "true", allowedHeaders = "*")，如：

@CrossOrigin(allowCredentials = "true", allowedHeaders = "*")
public class QuizController {
}

即可解决问题。