5

VUE 跨域问题

 2 years ago
source link: https://www.v2ex.com/t/814698
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

V2EX  ›  Vue.js

VUE 跨域问题

  lucascn · 16 小时 47 分钟前 · 1820 次点击
No 'Access-Control-Allow-Origin' header is present on the requested resource.

登录时候:
http://127.0.0.1:8080/#/Login

报错:No 'Access-Control-Allow-Origin' header is present on the requested resource.

请提供个解决方案

第 1 条附言  ·  16 小时 14 分钟前

各位,我是小白,加起来没看 1 小时的 VUE
本来系统在本地正常跑,但是关闭了之后在启动就报这个错误了

ksc010

ksc010   16 小时 43 分钟前

若只是本地测试的话可以使用“代理”
在一个就是 后端接口需要响应头设置 CORS

wolfie

wolfie   16 小时 43 分钟前

No 'Access-Control-Allow-Origin' header is present on the requested resource.

请求的资源上不存在“Access-Control-Allow-Origin”标头。

learnshare

learnshare   16 小时 41 分钟前

Google: vue cli dev server proxy

Junzhou

Junzhou   16 小时 39 分钟前   ❤️ 14

这是百度都懒得百度了。

lucascn

lucascn   16 小时 16 分钟前

@Junzhou sorry 我确实没百度,因为我 Google 的
你是在这里彰显你的优越性吗?或许你技术很屌,但是你情商真的很垃圾。
送你一句话:管住自己的嘴

lucascn

lucascn   16 小时 14 分钟前

@wolfie registry.addMapping("/**")
.allowedOrigins("http://localhost:8080", "null")
.allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
.maxAge(3600)
.allowCredentials(true).allowedHeaders("*");

我后端设置了

gadfly3173

gadfly3173   16 小时 13 分钟前   ❤️ 1

87ca38f4ly1gwb86lr56uj20nt0dpwgy.jpg

gadfly3173

gadfly3173   16 小时 12 分钟前

localhost 和 127.0.0.1 是两个域名

kingterrors

kingterrors   16 小时 12 分钟前

其实我也是好奇点进来的。。。4 楼的兄弟,说的没错,只是可能带有情绪的表达。不过个人拙见,v2ex 出现这样的问题,确实有失水准。。。就好像你去别人的 repo 提 issue ,不按照规范提问,或者去 stackoverflow 发问,明明已经很多人有提过的问题你又发一遍。。。
有时候也要自己反省下自己的问题。

lucascn

lucascn   16 小时 11 分钟前

@wolfie 本来系统正常跑的,但是关闭后在启动突然报了这个,中间的操作是我更新了 chrome

gadfly3173

gadfly3173   16 小时 9 分钟前

另外既然是请求头的问题,那么抓包看一下后端返回的 header 里有什么,你发出去的又是什么就知道了

kingterrors

kingterrors   16 小时 8 分钟前

开发环境下 vue-cli 自带 devServer 的反向代理配置避免跨域。
当然不同场景可能出现的问题很多,信息不是特别多,单纯来看我觉得参考这个应该够了
https://cli.vuejs.org/config/#devserver-proxy

kingterrors

kingterrors   16 小时 7 分钟前

如果是生产环境,其实配置 nginx 的反向代理更好,当然如果你自己想在服务端配置就要看服务端的请求头相关文档了。

TomatoYuyuko

TomatoYuyuko   16 小时 7 分钟前

搜一下 devServer ,webpack 可以做代理

kingterrors

kingterrors   16 小时 5 分钟前

另外生产环境的跨域问题跟 vue 框架没有什么关系。。。这个标题容易误导,,,大家都以为是说 devServer 的问题

deplivesb

deplivesb   16 小时 4 分钟前

看 5 楼题主的回复,人家说你怎么了,你真的搜索了么?你搜索的结果是啥?彩笔张口就来还有理了 block

lucascn

lucascn   16 小时 2 分钟前

@kingterrors 你说我的这些我都接受,但是我是新手,我是诚心求问,但这社区风格也太叼了吧。
上来不问青红皂白就一顿嘲讽

lucascn

lucascn   15 小时 59 分钟前

@deplivesb 赶紧 block ,sb

gadfly3173

gadfly3173   15 小时 57 分钟前

@lucascn #17 真心求问也应该给出你遇到的具体问题,既然你的问题是跨域,那么自然也应该给出你的跨域配置,你的请求路径,而不是在评论里回复。并且我也给出了你的问题直接 google 的结果。

如果在题目中就给出了你的跨域配置,大家就会告诉你是因为你的请求路径是 127.0.0.1 ,而跨域配置是 localhost

lucascn

lucascn   15 小时 55 分钟前

@kingterrors 大佬,devserver-proxy 这个方案我试了,但是好像没起作用

lucascn

lucascn   15 小时 55 分钟前

@gadfly3173 嗯,我都改成 127.0.0.1 了

ersic

ersic   15 小时 55 分钟前   ❤️ 3

@livid #18 人身攻击

lucascn

lucascn   15 小时 51 分钟前

@ersic 他骂我彩笔你不 @

dayeye2006199

dayeye2006199   15 小时 49 分钟前

在服务端把 cors 的头加上,客户端就一劳永逸不用麻烦了

ytll21

ytll21   15 小时 49 分钟前

现在的新人都这么厉害了吗?果然江山代有才人出,未来可期未来可期。

wtf12138

wtf12138   15 小时 49 分钟前

哈哈,精彩

Kasumi20

Kasumi20   15 小时 47 分钟前

跨域和 Vue 不 Vue 有什么关系呢?!

heeeeeem

heeeeeem   15 小时 47 分钟前

未成年吧,戾气这么大,还说什么情商,笑死

lucascn

lucascn   15 小时 43 分钟前

@gadfly3173
@kingterrors
两位 谢谢你们的指点
首先 devServer-proxy 代理我使用了没有起作用,后来根据 @gadfly3173 的指正,我前端,后端 都改成了 172.0.0.1 都重启后 可以登录了,但是 css 完全不起作用了。
我不知道经历了什么,继续 Google 去了
哪些嘲讽我的所谓的高手们 你们继续


@gadfly3173 你 19 楼的建议我接受 太急了

lucascn

lucascn   15 小时 40 分钟前

@ytll21 一般一般

gzyguy

gzyguy   15 小时 35 分钟前

请提供个解决方案(我就不百度了,你们赶紧给我搞个解决办法[狗头])

Yiki

Yiki   15 小时 29 分钟前

楼主可真狂啊 没看出来谁嘲讽你了 会 google 却不会查跨域?
别把我笑死 没看到你很虚心额

跨域分前后端 后端可以直接设置开放跨域
前端 vue 可以设置 proxy
还可以用浏览器插件 挂生产环境在同一个服务器下做 nginx 就不会有跨域了

lucascn

lucascn   15 小时 22 分钟前

@gzyguy 来来,堵你的嘴 ,这是我昨天的记录
当然我也知道你不会闭嘴的,换个突破口继续哈

Features

Features   14 小时 57 分钟前

springboot 的话,检查下服务端配置跨域中间件解决会比较好吧

另外,楼主我也是刚来的
理中客的说,你的态度确实有点问题
咱问人家问题,是请教人家
人家阴阳怪气,把他 block 掉就好了,没必要吵起来
吵起来大家都感觉你像个沙口

zhaokun

zhaokun   14 小时 50 分钟前

两种方案
1 、后端设置允许跨域
2 、请求相对地址,比如 web 地址是:www.abc.com ,后端接口地址是 www.abc.com/api

zoharSoul

zoharSoul   14 小时 46 分钟前

@lucascn #5 我觉得你还是先管好自己的嘴吧 笑死

k9ox

k9ox   14 小时 21 分钟前

这帖子把我看的醉醉的。。。

longgediyi999

longgediyi999   14 小时 18 分钟前

vue 本地项目有两种启动方式 一种是打包成 dist 目录用 http-server 这种启动 一种是 npm run serve 启动 你是哪种情况遇到的问题?

opgames

opgames   14 小时 16 分钟前   ❤️ 4

因为这问题确实简单,如果自己真的有如何如何幸苦也找不到问题,那么请描述一下。比如"我试过方法 A ,结果是 xxx 。试过方法 B ,结果是 xxx 。试过方法 c ,结果是 xxx" 这样大家都能够理解你已经尽力了,有好心人看到了自然会有人相助。而你开头就是我遇到了问题,请给提供解决方案...这并不是谦虚。不谦虚的提问,自然会有人认为你什么都没做。有人怀疑你没做东西的时候,你就说人家的情商"垃圾",不允许别人吐槽。这并不合理。

lucascn

lucascn   14 小时 12 分钟前

@opgames ok 我接受你的指正 谢谢

phony2r

phony2r   13 小时 51 分钟前

跨域跟 vue 有什么关系?

james2013

james2013   13 小时 31 分钟前

前端跨域问题是个烂大街的问题
又菜又不进行搜索,怼起来人倒是有劲

Desmondli

Desmondli   13 小时 7 分钟前

如果你的浏览器是用本机 ip 打开的项目,然后请求使用 127.0.0.1 发的,可能会被新版 chrome 禁止( https://blog.csdn.net/weixin_44819874/article/details/120901338 )。 如果不是这个原因,那么就是后端代码写错了,或者 vue 项目配置 proxy 没对

darknoll

darknoll   12 小时 12 分钟前

chrome 增加命令行参数:--disable-web-security

rainboat

rainboat   11 小时 13 分钟前

你这么搞属实不行,没有像你这样提问的

xiatian0415

xiatian0415   11 小时 7 分钟前

戾气别那么重,没有人特意针对你。这个问题确实百度就能解决的。靠百度就能解决也能节省你自己的时间

datafeng

datafeng   10 小时 26 分钟前

升级 chrome 都不看更新日志的么,新版本的 chrome 浏览器不允许这样玩了。。

Junzhou

Junzhou   8 小时 35 分钟前   ❤️ 2

@lucascn 你的提问中的:请提供一个解决方案?就是你所谓的有情商的表现吗?

如果我是你,我在自己百度后依旧没有找到解决问题。 我会这样提问:

我使用 xxx 和 xxx 框架,做了登陆功能,但是遇到了一些问题,具体表现是

登录时候:
http://127.0.0.1:8080/#/Login

报错:No 'Access-Control-Allow-Origin' header is present on the requested resource.

我尝试按照 xx 教程的 xx 方法做了 xx 处理,但依旧未解决问题,下面是我的相关配置文件信息。

请问各位,这种情况可能是由什么引起的?期待各位的回复。


接下来的内容我就开始和你对线了。

这确实不是一个很难的问题,我当初写毕设的时候,也遇到了这个问题,但是我马上就解决了。论坛的老哥们并不是高高在上,也不是看不起小白,而是你自己的提问太没有情商了。

要知道,v2 的发言是不能删除的,你在这个帖子下面怼的每一个人的每一句话,都会是你以后提问获取到帮助的阻力,大部分老哥,此时或许已经直接 block 你了。


我觉得你的情绪管理很糟糕,正常情况下,如果你真的百度了,正常的提问者应该是及时补充说: 我已经百度过了,尝试了 xxx 方案,但是还是不行,所以来论坛提问。 而不是像你这样说我有优越感,攻击我情商垃圾,顺便教育我管住我的嘴。 顺便直接攻击其他老哥 sb 。

不过说句实在的,希望你早日踏入工作岗位,社会生活会告诉你答案。

IvanLi127

IvanLi127   7 小时 47 分钟前 via Android

楼主应该雇个开发,再雇个公关。

lucascn

lucascn   5 小时 28 分钟前

@Junzhou
你 26 楼的回复 我完全认同 同时你给出的流程 对我很有帮助 谢谢

还有上面几个老哥提的建议我也都虚心接受

我一般不会在这里问问题,一般都是百度,谷歌。先是试着自己寻找解决答案,同时记录 FAQ

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK