VUE前端跨域问题

username11 发表于 2022-6-8 23:46

本帖最后由 username11 于 2022-6-8 23:47 编辑

Access to XMLHttpRequest at 'localhost:8090/footer/newblog' from origin 'http://ip:8081' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.

前台直接报这个错误，还未到后台...config.js中也加了这个，main.js也加了axios.defaults.baseURL = '/api'。

devServer: {
         proxy: {
            '/api': {
               target: 'http://localhost:8090',
               changeOrigin: true,
               pathRewrite: {
                     '/api': ''
               }
            }
         }
   },

求问各位大佬还有其他的解决方法吗？

zhuguang123 发表于 2022-6-9 00:48

后端controller类要加@CrossOrigin注解吧

一只小凡凡 发表于 2022-6-9 00:48

设置允许跨域啊
res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');

shiory 发表于 2022-6-9 07:03

如果我没猜错的话，你这个是前台填的地址没被转换，因为这个devServer设置的后台的服务器转发匹配的路径，感觉像是没匹配到。把vue.config.js和前台axios请求体的代码贴上来看看。我刚写了这个，除了target写的127.0.0.1之外其他一样。

jobs_steven 发表于 2022-6-9 08:02

我记得前段需要加个通用的配置就行了。withCredentials=true

NameQuin 发表于 2022-6-9 08:42

后端在Controller配置@CrossOrigin

wanlinwo 发表于 2022-6-9 08:43

葱油拌面 发表于 2022-6-9 09:10

你这个配置意思是请求本地http://ip:8081/api会转发到localhost:8090/api
所以你前端localhost:8090/footer/newblog请求也要改成8081，然后配置里再加个footer转发到8090的footer

Freedom_XY_ 发表于 2022-6-9 09:23

说句别的，有时候后端接口报错（404等异常响应）也会提示跨域相关问题，在你实在找不出问题所在的时候，关注一下后端接口可能会有收获

linguo2625469 发表于 2022-6-9 09:30

建议后端允许跨域..项目打包后前端设置那个代{过}{滤}理是没用的

页: [1] 2

吾爱破解 - 52pojie.cn's Archiver

VUE前端跨域问题