对接华为云Obs,上传附件报错cors

平台对接华为云的obs时,上传附件报错,经排查发现是前端cors拦截报错了

报错内容如下:

Access to XMLHttpRequest at '华为云桶地址' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

核心解决方案:配置 OBS 桶的 CORS 规则

这是解决该问题的根本方法。请按照以下步骤操作:

  1. 登录华为云控制台 ,进入对象存储服务 OBS

  2. 在桶列表中,找到你正在使用的桶,并点击进入其详情页面。

  3. 在左侧导航栏找到 "基础配置""权限控制" ,点击 "CORS规则"

  4. 点击 "创建" 按钮,添加一条新的 CORS 规则。

请按照下面的推荐配置进行填写:

配置参数 推荐填写值 说明与要求
允许的来源 http://localhost:8080 必填 。精确填写你前端应用的源地址。生产环境请务必替换为你的正式域名 ,不要使用 * 通配符。
允许的方法 GET, POST, PUT, DELETE, HEAD 必填 。选择你前端需要使用的所有HTTP方法。对于文件上传,POSTPUT 是必需的。
允许的头域 * 必填 。华为云官方推荐配置为 *,以允许所有头域。这对于携带如 Content-MD5 等自定义头进行上传验证至关重要。
补充头域 ETag 可选,但强烈建议 。如果你前端需要获取文件的MD5值进行校验,请在此处填写 ETag
缓存时间 100 可选 。浏览器缓存预检请求(OPTIONS)的结果时间,单位是秒。保持默认或设置为 300 即可。

点击 "确定" 。CORS 配置通常会在2分钟内生效

添加上述规则后,可以正常上传附件了

相关推荐
2601_9620725510 天前
李梦娇常识4600问|题库|打印版
sql·华为od·华为·c#·华为云·.net·harmonyos
烂白菜10 天前
智码美形:华为云码道 × UI-UX-Pro-Max 高品质界面智能生成实践
ui·华为云·ux
容器魔方14 天前
Karmada v1.18 版本发布!新增混合云溢出式调度能力
人工智能·云原生·容器·华为云·云计算
DS小龙哥16 天前
基于ESP32设计的智能养蜂监测系统
stm32·单片机·嵌入式硬件·物联网·华为云
江华森17 天前
JumpServer v4.10.16-ce 华为云 ECS 实战部署全记录
华为云
云智慧AIOps社区17 天前
云智慧Cloudwise 亮相华为云 × 霞光社中企私享会,Qreel 重构 AI 短剧出海新范式
人工智能·华为云·ai短剧·短剧创作
码农翻身17 天前
英伟达向左,华为云向右:AI数据中心该走哪条路?
人工智能·华为云
PPIO派欧云17 天前
PPIO亮相华为云创想者大会:以Agentic Cloud加速中国AI走向全球
人工智能·华为云
DS小龙哥18 天前
基于STM32与华为云的智能康养木屋环境监测与控制系统
stm32·嵌入式硬件·华为云
halazi10023 天前
如何在华为云上开通MaaS服务并创建API Key,并在CodeArts Agent中配置使用API Key
华为云·api·tokens