egret中canvas.toDataURL跨域的解决方案

最新推荐文章于 2023-02-07 11:10:36 发布

原创最新推荐文章于 2023-02-07 11:10:36 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍在项目中使用toDataURL将截图转换为Base64并放入HTML时遇到的跨域错误问题。当图片上传至OSS后，使用RES.getResByUrl()加载资源会触发跨域限制，解决方案是改用egret.URLLoader()进行资源加载，并确保OSS正确配置跨域。文章详细展示了如何使用egret.URLLoader()避免跨域错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

项目中有个生成海报的功能，使用 toDataURL 把截图转成base64后放到html中，
图片全在本地都是ok的，但是上传oss之后就报错
显示 toDataURL 不能 Uncaught Error: #1033: 跨域图片不可以使用toDataURL来转换成base64
*渲染模式默认 canvas

之前加载资源用的是：RES.getResByUrl() 加载方式，此方法是行不通的，
必须使用：egret.URLLoader() 加载方式，这样 toDataURL 就不会报错了
例：
private urlloader:egret.URLLoader;
......
this.urlloader = new egret.URLLoader();
let urlreq:egret.URLRequest = new egret.URLRequest();
urlreq.url = url;
this.urlloader.load( urlreq );
this.urlloader.addEventListener(egret.Event.COMPLETE, function(event){}, this);

*oss要设置好跨域

oss 跨域设置