后端controller上已加了@CrossOrigin注解，前端上传文件时仍然报跨域的错：No 'Access-Control-Allow-Origin' header is present on

最新推荐文章于 2024-07-31 15:48:56 发布
最新推荐文章于 2024-07-31 15:48:56 发布
阅读量2.2k 收藏 4
点赞数
分类专栏： JAVA 前端 nginx 文章标签： vue nginx java http
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/rxcht123/article/details/104781569
版权
在Vue应用中使用Element UI进行文件上传时，遇到跨域错误。尽管后端Java Controller已添加@CrossOrigin注解，但问题仍未解决。排查后发现，原因是Nginx的默认client_max_body_size限制为1M。通过在Nginx配置文件nginx.conf中增加`client_max_body_size 200M`并重启Nginx，成功解决了文件上传的跨域问题。
摘要由CSDN通过智能技术生成

环境：前端vue、nginx windows端1.61.1
报错：前端通过element 文件上传控件，点击上传文件，浏览器报错：
Access to XMLHttpRequest at ‘http://localhost:6100/vidservice/vod/upload’ from origin ‘http://localhost:9529’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
浏览器报错
后端controller上已经加了@CrossOrigin注解，而且其他controller同样使用此注解，并没有出现跨域问题：

@RestController
@RequestMapping("/vidservice/vod")
@CrossOrigin

查了教学视频发现nginx中需要设

最低0.47元/天 解锁文章
rxcht123
关注
专栏目录
fetch请求，No ‘Access-Control-Allow-Origin‘ header的解决方法，SpringBoot支持跨域
Top5软件工程硕士，先后在京东、字节从事多年Java后端开发、实时和离线大数据开发
10-10 1万+
Failed to load http://localhost:8080/a/b: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had...
http跨域问题解决方案（No 'Access-Control-Allow-Origin' header is present on the requested resource）
eleven的博客
11-30 2732
说说我出现跨域的场景：在做前后端分离的项目，前端使用9000端口访问，但是请求后端的端口是8080，于是请求之后可以接受到json数据，但是前端出现错误Access to XMLHttpRequest at 'http://localhost:8080/web/admin/commodityManager/lisCommodityBySkuOr' from origin 'http://l...
后端已经允许了跨域，前端依然报跨域错误，研究一下 Access-Control-Allow-Credentials...
热门推荐
weixin_33774615的博客
05-17 1万+
即使后端已经允许了跨域，但是前端依然报一个跨域错误。 Access to XMLHttpRequest at 'http://localhost/api/admin/authorizations' from origin 'http://localhost:9528' has been blocked by CORS policy: Response to preflight request...
【BUG日记】【VUE】【JAVA】后端已经添加上@CrossOrigin，前端还是显示Access to XMLHttpRequest...
南方者的博客
10-21 1214
【日期】： 2021/10/21 【问题】： 后端已经添加上@CrossOrigin，前端还是显示 Access to XMLHttpRequest at ‘localhost:0209/aduicloud/essay/getList’ from origin ‘http://localhost:1109’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http
悬而未决：奇怪的不允许跨域CORS policy的问题
最新发布
寻找甘当科学家的女人/男人
07-31 288
用浏览器也有了正常的一条。这我就奇怪了，上面这个现象说明nginx是没有过滤掉这个header的，应该是浏览器过滤掉了php输出的header，但它为什么又没有过滤掉nginx输出的这个header呢？因为我后端用的是PHP，查了一下网上的资料，说是可以直接使用header输出Access-Control-Allow-Origin:*就行。在NginX中增加了header输出，虽然解决了跨域的报错，但还出来一个新问题，就是用$.post()访问的时候后端ThinkPHP检测它又变成了非AJAX方式了！
后端使用@CrossOrigin页面还显示跨域问题？
Ron_的博客
01-27 1万+
后端使用@CrossOrigin页面还显示跨域问题？错误信息如下：解决方案：原因： 前后端分离项目，后端设置的允许跨域的代码，到前端调试界面的时候还显示了不允许跨域。 错误信息如下： Access to XMLHttpRequest at‘http://localhost:8000/carInfo/carCondition/1/4’ from origin‘http://localhost:9528’ has been blocked by CORS policy: Response to preflig
后端加了跨域注解还是不行_Spring Boot 2.x（九）：遇到跨域不再慌
weixin_39755873的博客
12-09 1122
什么是跨域首先，我们需要了解一下一个URL是怎么组成的： // 协议 + 域名（子域名 + 主域名） + 端口号 + 资源地址 http: + // + http://www.baidu.com + :8080/只要协议，子域名，主域名，端口号这四项组成部分中有一项不同，就可以认为是不同的域，不同的域之间互相访问资源，就被称之为跨域。随着前后端分离开发的越来越普及，会经常遇到跨域的问题，...
加了@CrossOrigin ,仍然报跨域错误
m0_47943986的博客
09-13 1702
问题处理
后端的controller加了@CrossOrigin还是显示跨域错误问题
weixin_45822548的博客
12-21 309
错误记录
JQuery跨域请求报错，原因：CORS头缺少‘Access-Control-Allow-Origin‘
qq_36033484的博客
07-18 3306
字面意思就是需要添加一个叫'Access-Control-Allow-Origin'的头，但是这里需要注意的是，不是在具体的调用方法里加这个头信息（网上很多文章存在误导），这样是不会生效的，我们需要写一个过滤器/拦截器统一设置。我这里通过过滤器来实现，大家可以根据自己的需要选择。其实，如果你用的Spring版本是4.2以上，有一种更简单直接的方法实现跨源访问，那就是直接在C控制器添加注解@CrossOrigin，表示该Controller下的方法都允许跨源访问。...
使用Access-Control-Allow-Origin解决跨域问题
hucbmz的博客
03-29 1933
CORS 全称是"跨域资源共享"（Cross-origin resource sharing）,解决跨域的方式很多，比如： 1.1前端JSONP 跨域原理： 通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参...
Controller类明明写了@CrossOrigin跨域注解，但还是有跨域问题
m0_74462339的博客
06-01 470
不过，这只能暂时解决该问题，毕竟过滤器还是要用的，后续我再探索一下。此时，先注释掉过滤器注解，让其不生效，就可以避免干扰跨域处理了。可能是写的过滤器干扰到了跨域处理。
报错：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource（SpringBoot中解决跨域问题）
hui_ziyi的博客
04-16 1044
前后端联调的时候，经常会出现跨域问题，也就是出现以下报错： Access to fetch at 'http://xxxxxxxx:xxxx/uploadExcel' from origin 'http://localhost:xxxx' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response s
后端加了跨域注解还是不行_Swoft2 小白教程系列跨域与中间件
weixin_39670511的博客
11-26 197
一、什么是跨域？同源策略是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSRF等攻击。所谓同源是指”协议+域名+端口”三者相同，即便两个不同的域名指向同一个ip地址，也非同源。同源策略限制内容有：Cookie、LocalStorage、IndexedDB 等存储性内容DOM 节点AJAX 请求发送后，结果被浏览器拦截了但是有三个标签是允许跨域...
请教一个关于前端 往 后端传文件的时候controller上加了@CrossOrigin还是会报跨域错误的问题
KIRGKLEO的博客
11-17 1220
** 请教一个关于前端 往 后端传文件的时候的跨域问题 ** 最近在做一个开源项目 前端是elment模板+vue 后端用的是springboot 都是运行在本地的 nginx做反向代理 这是前端代码 这是后端controller部分 这是nginx配置的反向代理 往后端传文件的时候还是会报这个错误 请教下大家 这个问题该怎么解决 ...
（vite）后端的controller加了@CrossOrigin还是显示跨域错误问题
weixin_58334531的博客
10-01 533
---------------------------------捣鼓了vite的proxy代理失败一天一夜之后----------------------------------------终于找到了错误根源。坑死我了，我就说后端明明跨域了，一个小小的破斜杠。，/findAll改成/findAll/
SpringBoot使用@CrossOrigin注解后，图片文件上传失败解决方案
思量的博客
11-11 632
@CrossOrigin //springboot通过跨域请求的注解 在类上面使用@CrossOrigin注解后按理说应该是可以解决跨域问题的，在一般的数据传输当中是没出现问题的，在别人的博客中找到资料说@CrossOrigin注解默认开启了get，post，以及head请求 但是在使用图片文件上传的时候却实现了跨域问题，通过查证资料有两种解决方案 解决方案一： @CrossOrigin(methods = {RequestMethod.GET, RequestMethod.POST,..
Spring改写mybatis项目中前端报错No 'Access-Control-Allow-Origin' header is present跨域报错
woshidatuzi的博客
03-30 275
本人是初学Spring的小白，今天在改写自己曾经写过的Mybatis版本的增删改查数据库的时候，使用了前后端分离，我把后端写在了server模组中，前端写在client模组中 但是在调试过程中，前端出现了报错，始终无法跨域访问到数据库 说一下解决方案 1.首先确认在@controller控制器类中加上了 @CrossOrigin 注解 这个注解就是为了允许跨域访问 2.第二点就是我遇到的比较...
request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
09-23
"request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource."这个错误信息表示请求在访问资源时没有通过访问控制检查，因为请求的资源没有提供'...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值