当前位置: 首页 > 知识库问答 >
问题:

javascript - 图片跨域问题?

葛智敏
2023-09-15

阿里云的图片,例如https://syx-hzy5200.oss-cn-shenzhen.aliyuncs.com/c17ed98cdb36...(不同图片这个不一样c17ed98cdb36418498caf32f95c0666f),前端项目中需要有一个需求是将url转图片
代码是

        const imageBlob = await fetch(urls, { mode: 'cors' }).then(res => res.blob())

但是ccess to fetch at 'https://syx-hzy5200.oss-cn-shenzhen.aliyuncs.com/c17ed98cdb36...' from origin 'http://xxx' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
报跨域问题,测试环境的时候让后端在阿里云那边加上了测试环境地址,使得跨域问题解决了,到正式环境也让后端一模一样的操作,但是依旧存在跨域问题,这应该怎么解决?

共有2个答案

符学
2023-09-15

这个看字面意思是还没有加上Access-Control-Allow-Origin。
看了一下你提供的这个图片,确实是还没有加上允许跨域的配置。


这是阿里云oss的跨域设置,允许 *.test.com 跨域
image.png

测试,分别使用ff.test.comff.btest.com去验证是否配置成功,因为配置了*.test.com能匹配ff.test.com,所以ff.test.com能正常返回跨域的设置。
image.png

袁旻
2023-09-15

这个不应该找运维么

 类似资料:
  • 本文向大家介绍javascript使用链接跨域下载图片,包括了javascript使用链接跨域下载图片的使用技巧和注意事项,需要的朋友参考一下 前言 图片是最常见的静态资源文件,可以从本地、外链获取图片,或者使用base64码展示。而canvas的toDataUrl() API可以将图片转base64码,然后模拟点击事件即可下载图片。 外链下载 在本地或者网站下载外链url图片时涉及到跨域,跨域会

  • 问题内容: 可以说,我有一个名为example.com的网站,在该网站上嵌入了iframe.net域的iframe,现在我想读取iframe的内容并传递一些参数以显示文本消息。像Hi和用户名一样。 现在的问题是,这无法在两者之间建立连接,甚至无法获得我使用以下方法使用的iframe的innerHTML 它将引发错误“权限被拒绝访问属性” 有谁知道如何在跨域平台中读写 问题答案: 如果您无法控制框架

  • 本文向大家介绍快速解决Canvas.toDataURL 图片跨域的问题,包括了快速解决Canvas.toDataURL 图片跨域的问题的使用技巧和注意事项,需要的朋友参考一下 如题,在将页面的图片地址进行本地输出时(Html2Canvas.js),因不同源存在跨域问题,会出现toDataURL访问权限问题: 【Redirect at origin 'http://sub1.xx.com' has

  • 我有以下功能可以将图片的较小版本合并到图片本身的较大版本: 然而,我得到了以下错误: CORS策略阻止了从源“http://localhost:53594”访问“http://xxxxxxx.com/testpicture.jpg”上的映像:请求的资源上没有“access-control-allow-origin”标头。 我使用了“匿名”交叉起源声明,应该可以解决这个问题,但它似乎没有造成任何影响

  • 本文向大家介绍深入分析Javascript跨域问题,包括了深入分析Javascript跨域问题的使用技巧和注意事项,需要的朋友参考一下 跨域是什么? 假设a.com/get.html需要获取b.com/data.html中的数据,而这里a.com和b.com并不是同一台服务器,这就是跨域跨域会涉及到Javascript的同源策略,简单来说就是为了保护网站的安全,不被外域(非同源)服务器的js修改本

  • 平时被问到最多的问题还是关于跨域的,其实跨域问题真的不是一个很难解决的问题。这里我来简单总结一下我推荐的几种跨域解决方案。 我最推荐的也是我工作中在使用的方式就是: cors 全称为 Cross Origin Resource Sharing(跨域资源共享)。这种方案对于前端来说没有什么工作量,和正常发送请求写法上没有任何区别,工作量基本都在后端这里。每一次请求,浏览器必须先以 OPTIONS 请