exception:Failed to execute 'toDataURL' on 'HTMLCanvasElement' 解决方案
1.情景展示
当使用canvas 将图片转为base64报错信息如下:
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported

2.解决方案
第一种情况:本地测试&图片引自本地
通过file协议打开的html文件进行的本地测试


解决方案:放在服务器上就可以正常转换了!
第二种情况:被转换的图片,引自网络或者服务器

解决方案:
第一步:被引的图片需添加属性"crossOrigin",值为"Anonymous"。

第二步:存放图片地址的服务器也要开启跨域允许权限。
不然会报错:No 'Access-Control-Allow-Origin' header is present on the requested resource.
如Apache设置:
打开LoadModule headers_module modules/mod_headers.so
在虚拟主机<Directory></Directory>内加上 Header set Access-Control-Allow-Origin *
exception:Failed to execute 'toDataURL' on 'HTMLCanvasElement' 解决方案的更多相关文章
- Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
canvas绘制图片,由于浏览器的安全考虑,如果在使用canvas绘图的过程中,使用到了外域的图片资源,那么在toDataURL()时会抛出安全异常: Uncaught SecurityError: ...
- Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may no ...
- Failed to execute 'toDataURL' on 'HTMLCanvasElement,在canvas.toDataURL()执行时候报错解决方案
添加跨域条件 crossorigin="anonymous" [Redirect at origin 'http://xxx.xx.com' has been blocked ...
- 解决 canvas 将图片转为base64报错: Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasEleme...
问题描述 当用户点击分享按钮时,生成一张海报,可以保存图片分享到朋友圈,用户的图片是存储在阿里云的OSS,当海报完成后,执行.canvas.toDataURL("image/png" ...
- three.js:Failed to execute 'texImage2D' on 'WebGLRenderingContext解决方案
three.js加载图片时,出现Failed to execute 'texImage2D' on 'WebGLRenderingContext .Tainted canvases may not b ...
- Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) 解决方案
1.命令行用maven编译项目失败,提示 Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compi ...
- xhprof查看性能测试图一直报错:failed to execute cmd: " dot -Tpng"多种因素解决方案
xhprof查看性能测试图一直报错:failed to execute cmd: ” dot -Tpng”多种因素解决方案最近在新环境进行php代码性能测试,用了xhprof这个工具,搭建好以后,点击 ...
- 使用Selenium时解决方案: Exception: Failed to find firefox binary. You can set it by specifying the ······
问题描述: Firefox在自动升级之后,在使用selenium的时候出现了如下错误: Exception: Failed to find firefox binary. You can set it ...
- Maven打包时报Failed to execute goal org.apache.maven.plugins:maven-war-plugin:解决方案
问题现象: 用Maven打包时,报Failed to execute goal org.apache.maven.plugins:maven-war-plugin:2.2:war错误. 原因分析: 打 ...
随机推荐
- Java BigDecimal详解,提供了丰富的四舍五入规则
java.math.BigDecimal类提供用于算术,刻度操作,舍入,比较,哈希算法和格式转换操作. toString()方法提供BigDecimal的规范表示.它使用户可以完全控制舍入行为. 提供 ...
- python系统性能模块笔记
内存信息psutil.cpu_times() 使用cpu_times方法获取cpu完整信息,需要显示所有逻辑cpu信息(指定变量percpu=True)psutil.cpu_ti ...
- XamarinSQLite教程在Xamarin.iOS项目中定位数据库文件
XamarinSQLite教程在Xamarin.iOS项目中定位数据库文件 开发者可以在指定的路径中找到复制的数据库文件,具体的操作步骤如下: (1)单击Mac电脑中Finder菜单中的“前往”|“前 ...
- 帝国移动pc站文章
帝国建站的时候发现,如果在PC站发文章,那么移动站的文章正文无法显示... 搜索调试了很久,原来是要对config进行配置. 在移动站config.php文件,对 $ecms_config['sets ...
- IDEA常用配置
一.安装Activiti 1.File -> Settings -> Plugins -> 搜索actiBPM 2.解决中文乱码问题 修改IDEA的安装目录中的idea.exe.vm ...
- Lucene入门实例-CRUD
1.导入jar包 lucene-analyzers-common-7.6.0.jar lucene-analyzers-smartcn-7.6.0.jar lucene-core-7.6.0.jar ...
- 潭州课堂25班:Ph201805201 django 项目 第十七课 用户登录,登出实现 (课堂笔记)
登录,校验: 1,判断用户名输入是否为空, 2,判断用户名密码是否匹配, 3,记住我的功能,:将用户信息记到 session 中 请求方式: POST 在视图中: # 1,创建类# 2,获取前台参数# ...
- [JOISC2014]ストラップ
[JOISC2014]ストラップ 题目大意: 有\(n(n\le2000)\)个挂饰,每个挂饰有一个喜悦值\(b_i(|b_i|\le10^6)\),下面有\(b_i(b_i\le10^6)\)个挂钩 ...
- BZOJ2702 : 金融风暴
求出离每个点最近的关键点,然后用二维ST表回答正方形最大值. 将关键点分为上下两部分,以上为例: 从上到下依次考虑每一行,记录每一列往上最近的关键点的距离,那么最优决策具有单调性,可以分治求解. 时间 ...
- Java基础知识总结--多态
面向对象编程的三大特性:封装.继承.多态 封装隐藏了类的内部实现机制,可以在不影响使用的情况下改变类的内部结构,同时也保护了数据,而外界而已它的内部细节是隐藏的,暴露给外界的只是它的访问方法. 继承是 ...