OSS文件下载-html2canvas 图片跨域分析
最新推荐文章于 2024-07-31 11:17:59 发布
小小鲁班ly525
最新推荐文章于 2024-07-31 11:17:59 发布
阅读量354
收藏
3
点赞数
2
最新推荐文章于 2024-07-31 11:17:59 发布
阅读量354
收藏
3
点赞数
2
html2canvas 将 dom 转海报图片下载
const options = {
backgroundColor: null,
canvas: canvas,
useCORS: true, // 配置允许跨域
dpi: 300 // 处理模糊问题
};
console.log("获取指定的宽高", width, height, canvas);
html2canvas(canvasDom, options)
- 阿里云后台配置
Access-Control-Allow-Origin: *，允许图片跨域访问
| request header | img = new Image(); img.src="" | img = new Image(); img.crossOrigin = 'anonymous'; img.src="" |
|---|---|---|
| Sec-Fetch-Dest | image | image |
| Sec-Fetch-Mode | no-cors | cors |
| Sec-Fetch-Site | cross-site | cross-site |
- img.crossOrigin = ‘anonymous’;
- 对其理解：匿名模式，即请求的时候，不携带能够标识用户 cookie 信息
- 开启后，会发现请求 header 的 Sec-Fetch-Mode 会变成：cors，即要求后端设置 cors response header
- 如下图，是 html2cancavas
扫一扫
1012
暂无认证
到【灌水乐园】发言
li906912102: 没用啊
小小鲁班ly525 回复 -D调定义之崽崽: 嗯，你说的应该是 iconfont，svg 作为字体也很普遍了，在 fontawesome 里面已经使用了，也可以支持按需加载。欢迎继续讨论
-D调定义之崽崽: ！！！svg是可以转字体图标的，如果图标图有就用图标库的，没有就自己上传。在阿里图库开个项目，设计师找图标的时候，用了哪个就存在项目里，方便前端直接用