Oss 跨域（表现为手机可用，本地运行跨域）

原创 已于 2022-04-29 17:08:25 修改 · 1.1k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#阿里云 #前端

于 2022-04-29 16:46:37 首次发布
该博客介绍了如何处理浏览器跨域访问阿里云OSS资源的错误。通过登录阿里云控制台，进入OSS服务，选择对应的Bucket，并在跨域设置中配置允许所有来源（*），全选允许的方法，并指定暴露的Header。配置完成后，清除前端缓存即可解决问题。

错误：

Access to image at '*********' from origin 'http://192.168.0.102:8092' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

解决办法：

1.登录阿里云控制台,打开OSS

2.选择Bucket列表

3.选择你的Bucket

4.点击常用功能-跨域设置

5.按照以下规则配置

来源：*

允许method:全部勾选

暴露header：

Etag

x-oss-request-id

返回 Vary: Origin 勾选上  ；

如下所示：

保存后，清除前端的缓存，重新试一下吧！

国韵
关注
良田高拍仪接口文档对接
wangweiruning的博客
06-29 2077
良田高拍仪接口文档对接
阿里云OSS跨域
手写我对你的温柔
04-12 2551
如果不考虑CDN回流的话。 对于跨域，需要请求协议、域名、端口3者有1个不同，即是跨域。 那么怎么解决跨域，原始方法是JSONP,那个时代技术有限,现在都是Cors技术。 现在，前端发给后端，后端例如golang可以如下配置： 当然，具体用法见官方文档。 然后就是vue开发阶段，我的访问url是localhost:3000. 前端直传oss，为了分布式考虑，跨域访问了。 ...
Access to image at from origin has been blocked by CORS policy: No ‘Access-Control-Allow-Origin 此图片来
浮游的博客
03-27 742
最近，在平台上发现很多图片无法展示，显示此图片来自微信公众平台，未经允许不可引用，分析原因后，发现是在发布文章时，富文本编辑器get图片，有跨域问题。在网上搜了很多方案，例如img.setAttribute(‘crossOrigin’, ‘anonymous’)，发现无效，于是想到代理服务器。思路：传递图片地址过去 让后端给转成buffer返回给前端，前端再上传二进制图片，到oss，获得链接。传过去图片地址，前端根据后端返回的blob，上传图片，最终完美解决。在前端富文本中进行配置。新建一个node项目。
【阿里OSS】[跨域问题]----前端访问OSS资源，出现跨域问题，解决允许前端跨域
最新发布
朱朱博客，分享技术
08-24 653
本文介绍了解决CORS跨域问题的配置方法。第一部分说明需设置Access-Control-Allow-Origin响应头（可用通配符，但带凭据请求需明确域名），并强调需勾选所有请求方式，同时修改CDN缓存设置为"不重复"。第二部分讲解Access-Control-Allow-Methods头的配置，可指定方法列表或使用允许所有方法。文章通过截图展示了因跨域问题导致的全景图黑屏报错，并分步骤演示了解决方案的配置界面。配置完成后成功解决了跨域拦截问题。
在线图片转base64，出现跨域问题解决方案
qq_41248093的博客
04-15 3394
在线图片转base64，出现跨域问题解决方案 一定要仔细看完全文，或许可以帮到你。 功能需求：需要将在线图片进行转存。 遇到问题：在线图片有跨域问题，报如下错误 Access to image at ‘URL’ from origin ‘http://127.0.0.1’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 接下来就解决
将网页设置为允许 XMLHttpRequest 跨域访问
weixin_30708329的博客
11-07 448
在非IE下，使用XMLHttpRequest 不能跨域访问， 除非要访问的网页设置为允许跨域访问。 将网页设置为允许跨域访问的方法如下： Java Response.AddHeader("Access-Control-Allow-Origin", "*"); 或指定域名下可以访问： Response.AddHeader("Access-Control-Allow-Origin",...
JavaScript中的 CORS问题
LuckXinXin的博客
11-12 1417
CORS 需要浏览器和后端同时支持。IE 8 和 9 需要通过 XDomainRequest 来实现。 浏览器会自动进行 CORS 通信，实现 CORS 通信的关键是后端。只要后端实现了 CORS，就实现了跨域。 服务端设置 Access-Control-Allow-Origin 就可以开启 CORS。 该属性表示哪些域名可以访问资源，如果设置通配符则表示所有网站都可以访问资源。 虽然设置 CORS和前端没什么关系，但是通过这种方式解决跨域问题的话，会在发送请求时出现两种情况，分别为简单请求和复杂请求。 .
OSS 跨域配置
weixin_34227447的博客
10-30 6441
跨域问题可以通过脚本检查了 https://help.aliyun.com/document_detail/92151.html?spm=a2c4g.11186623.6.1275.41ab334esuiZHk 开启学习之旅 一个资源请求一个其它域名的资源时会发起一个跨域 HTTP 请求 cross-origin HTTP request 比如说，域名A...
图片转base64跨域以及阿里云OSS跨域规则配置后不生效的原因
cmyh100的博客
09-26 5081
场景：公司使用OSS存储图片等静态资源，我获取图片资源并且将它转为base64的时候发生了跨域问题 于是到OSS进行配置   但是仍然报了跨域问题 最后发现，因为启用了CDN缓存，所以得到CDN处添加HTTP头 Access-Control-Allow-Origin 参数的取值为 * （表示全部域名）   感谢qianghong000的分享，详细问题分析可以看这里：http:...
阿里云对象存储OSS配置自定义域名、CDN加速及设置跨域
飞鸽FlyGo-把自己作为一款产品来打磨，提升产品的体验，锻造出最好的自己。
05-11 1万+
采用阿里云OSS服务，对资源文件管理和提供全球化CDN服务。阿里云对象存储OSS配置自定义域名、CDN加速及设置跨域。
vue中axios实现数据交互与跨域问题
10-17
3. 使用代理服务器：在开发环境中，可以在本地启动一个代理服务器，通过代理服务器转发请求至目标服务器，从而避免跨域限制。在Vue项目中，可以使用vue.config.js配置代理： ```javascript module.exports = { dev...
阿里云OSS跨域设置
热门推荐
omage的专栏
12-21 1万+
阿里云OSS的跨域设置
阿里云OSS配置跨域及域名访问
云深海阔专栏
05-14 8380
进入对象存储OSS–>OSS存储桶–>数据安全–>跨域设置–>创建规则。选中后点击上传会提示15分钟生效。证书如下，最后选中新加的证书。切换到数据管理–>静态页面。验证生效后，配置ssl证书。等个几分钟后我们点击。
阿里云OSS设置跨域访问
旭东怪的博客
03-30 9302
来源：指定允许的跨域请求的来源。允许多条匹配规则，以回车为间隔。每个匹配规则允许使用最多一个“*”通配符。Allowed Methods：指定允许的跨域请求方法。Allowed Headers：指定允许的跨域请求 header。允许多条匹配规则，以回车为间隔。每个匹配规则使用最多一个“*”通配符。Exposed Headers：指定允许用户从应用程序中访问的响应头（例如一个 Javascript 的 XMLHttpRequest 对象)。备注：每个存储空间最多可以配置 10 条规则。
mormot允许跨域访问
weixin_34029680的博客
01-11 610
mormot允许跨域访问 ctxt.OutCustomHeaders:='Access-Control-Allow-Origin:*' 允许跨域访问 其实其他HTTP控件要实现跨域访问，也是类似设置。 pvRequest.Response.Header.ForceByName('Access-Control-Allow-Origin').AsString := '*'; pvReques...
SpringBoot允许跨域访问
跟派大星学编程
04-19 1万+
当它请求的一个资源是从一个与它本身提供的第一个资源的不同的域名时，一个资源会发起一个跨域HTTP请求(Cross-site HTTP request)。 一般都是异步请求会有这个问题，比如：Ajax，XMLHttpRequest等 使用@Configuration（推荐） import org.springframework.context.annotation.Bean; import or...
阿里云oss对象存储跨域设置
weixin_43652507的博客
06-28 2175
阿里云oss对象存储跨域设置
后端接口允许跨域访问
qq_33192454的博客
07-17 1279
为了在后端接口中允许跨域访问（CORS），你需要在你的Spring Boot项目中配置CORS。
设置浏览器允许跨域访问
清雨小竹
10-19 7236
快捷方式，目标该问 "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --args --disable-web-security --user-data-dir   或   C:\Users\zzzili\AppData\Local\Google\Chrome\Application\chrome.exe --di...
本地前端对接阿里云oss跨域设置
01-09
### 本地前端对接阿里云OSS跨域设置 为了使本地前端能够成功对接阿里云OSS并处理跨域请求，需确保浏览器发送的预检请求（OPTIONS）得到正确响应。这涉及到调整OSS服务端的CORS配置以及可能需要修改Nginx或其他反向...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值