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错误. 原因分析: 打 ...
随机推荐
- python自带线程池
1. 注意: 导包是: from multiprocessing.pool import ThreadPool #线程池不在thrading中 2. 代码: from mutiprocessing.p ...
- snmp 里面oid对应的信息 MIB
系统参数(1.3.6.1.2.1.1) OID 描述 备注 请求方式 .1.3.6.1.2.1.1.1.0 获取系统基本信息 SysDesc GET .1.3.6.1.2.1.1.3.0 监控时间 s ...
- HashMap 源码阅读
前言 之前读过一些类的源码,近来发现都忘了,再读一遍整理记录一下.这次读的是 JDK 11 的代码,贴上来的源码会去掉大部分的注释, 也会加上一些自己的理解. Map 接口 这里提一下 Map 接口与 ...
- 服务端线程模型-NIO服务模型
上接<服务端线程模型-线程池服务模型>(https://www.cnblogs.com/fudashi233/p/10549221.html). 这篇分享从最初的单线程服务模型一直演进到线 ...
- 前面的内容 也是要去掉白名单 和 8.8.8.8这种非问题IP的 高风险 么? (目前我们没有获取客户的中风险、低风险数据,可以处理掉高风险)
前面的内容 也是要去掉白名单 和 8.8.8.8这种非问题IP的 高风险 么? (目前我们没有获取客户的中风险.低风险数据,可以处理掉高风险) == 整体把关.不清楚细节,所以只能从整体决策.做 ...
- Java 作业 二
编写一个Java应用程序,统计数组{1,3,4,7,2,1,1,5,2,5,7,2,1,1,3},统计显示每种数字其出现的次数以及出现最多和最少次数的数字. package hi; public cl ...
- Windows下bat脚本自动发邮件
摘要:说明:很多木马会利用自身的程序截取系统敏感文件或信息发往指定的邮箱,而blat并不是木马,它小巧却有强大的发邮件功能,可不要用它做违法事,感觉和木马功能有一拼!下面先看个具体的实例(在blat同 ...
- ES6中bind(this)用法说明
在使用 React 中的 Class extends写法,如果 onClick 绑定一个方法就需要 bind(this),如果使用React.createClass 方法就不需要 解析: React. ...
- Lubuntu安装屏幕键盘onboard,使触摸屏可以登录和输入
Lubuntu18.04 LTS桌面使用 LightDM 显示管理器,默认已经安装了GTK+ 欢迎界面 需要的话可以下列命令安装使用 $ sudo apt-get install lightdm-gt ...
- NOIP不开心记(不开心的东西肯定不能给别人看!)
写在前面的.. noip之后一直很想写一下什么的.. 老师:这就是你逃晚自习来机房的原因?? Day 0 坐了好久的车来到GZ.. 年年都是GZ.. sb酒店垃圾的要死.. 路上都是杀马特.. 隔壁还 ...