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

设置允许跨域啊

[JavaScript] 纯文本查看 复制代码

    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

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

帐号		自动登录	找回密码
密码			注册[Register]

[求助] VUE前端跨域问题

免费评分

wanlinwo wanlinwo 当前离线好友阅读权限 0 听众最后登录 1970-1-1 头像被屏蔽	wanlinwo 发表于 2022-6-9 08:43 提示: 作者被禁止或删除内容自动屏蔽

	回复支持举报