阿里云OSS图片访问出现跨域：Access to image at from origin has been blocked by CORS policy

问题描述

// 使用js Image 对象报错
let image = new Image()
image.setAttribute('crossOrigin', 'Anonymous')
image.src = url

报错

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

解决：

阿里云OSS：权限控制/跨域访问中 设置跨域规则:

来源： *
允许 Methods: GET POST PUT DELETE HEAD
允许 Headers：*
暴露 Headers：ETag、 x-oss-request-id、x-oss-version-id
缓存时间（秒）：0

1、方式一：

浏览器设置：停用缓存

2、方式二：

添加元数据

// 简单上传
result = await client.put(filename, file, {
   meta: {
     'Cache-Control': 'no-cache',
   },
 })

参考 解决阿里云oss 图片跨域问题 管理文件元信息