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错误. 原因分析: 打 ...
随机推荐
- Mysql乐观锁与悲观锁
乐观锁和悲观锁是两种常见的资源并发锁设计思路,也是并发编程中一个非常重要的基础理念. Mysql的悲观锁 什么是悲观锁(Pessimistic Lock): 悲观锁的特点是先获取锁,再进行业务操作,即 ...
- <%= %>、<% %>、<%@ %>和<%# %>的区别
轉至http://blog.csdn.net/wildfeng04/article/details/7290126 <%=%> 里面放的变量名 <% %> 中间一般放函数或者方 ...
- maya cmds pymel polyEvaluate 获取 bounding box
maya cmds pymel polyEvaluate 获取 bounding box cmds.polyEvaluate(bc = 1) #模型 cmds.polyEvaluate(bc2 = ...
- css图片根据div宽高比例自适应
1.div布局 <div class="card-img-show"> <div class="upload-img-conss" > ...
- scrapy 日志一般配置
- 从零搭建 ES 搜索服务(二)基础搜索
一.前言 上篇介绍了 ES 的基本概念及环境搭建,本篇将结合实际需求介绍整个实现过程及核心代码. 二.安装 ES ik 分析器插件 2.1 ik 分析器简介 GitHub 地址:https://git ...
- xss小结-从xss平台搭建到csp规则
0x00前言 xss是跨站脚本攻击,利用嵌入js代码达到‘控制’对方浏览器的作用,测试的时候我们是用alert(1)弹窗,而做CTF也好,实际中的漏洞利用也好一般是用xss获取管理员的cookie 0 ...
- SpringBoot文件上传下载
项目中经常会有上传和下载的需求,这篇文章简述一下springboot项目中实现简单的上传和下载. 新建springboot项目,前台页面使用的thymeleaf模板,其余的没有特别的配置,pom代码如 ...
- JavaScript基础笔记(四) JS式面向对象
JS式面向对象 一.理解对象 一)属性类型 ECMA-262 第 5 版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特征. ECMA-262 定义这些特性是为 ...
- JavaScript基础笔记(三) 引用类型
引用类型 引用类型的值(对象)是引用类型的一个实例. 一.Object类型 创建Object实例: //方法一:通过new操作符创建 var a = new Object(); a.neme = &q ...