Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases may not be exported.

最新推荐文章于 2024-04-16 20:13:17 发布
最新推荐文章于 2024-04-16 20:13:17 发布
阅读量2.6k 收藏 2
点赞数
分类专栏： javascript 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38157825/article/details/111353929
版权

问题场景是需要把 canvas 转化为 base64的图片 遇到的报错问题
百度一搜都是一样的解决方法，都说给图片设置 img.setAttribute('crossOrigin', 'Anonymous')
但是我用 谷歌搜索就发现了问题的解决方法

每次遇到 Tainted canvases字眼，就要想一下你是不是直接双击打开的页面测试？如果是，建议启动个本地web服务，以http url请求的方式在浏览器打开~

其实就是使用 live server 运行代码问题就可以解决了

前端开心果
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may n...
weixin_34417200的博客
09-29 3560
canvas绘制图片，由于浏览器的安全考虑，如果在使用canvas绘图的过程中，使用到了外域的图片资源，那么在toDataURL()时会抛出安全异常： Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. 解决...
maven出现：Failed to execute goal on project …: Could not resolve dependencies for project …
01-20
在使用Maven构建Java项目时，可能会遇到这样一个错误：“Failed to execute goal on project …: Could not resolve dependencies for project …”。这个错误通常表明Maven在构建过程中遇到了依赖解析问题，无法...
Canvas引入跨域的图片导致toDataURL()报错的问题的解决
09-22
主要介绍了Canvas引入跨域的图片导致toDataURL()报错的问题的解决的相关资料，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported
热门推荐
weixin_34249678的博客
11-24 2万+
2019独角兽企业重金招聘Python工程师标准>>> ...
Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases may no
weixin_49295874的博客
08-03 9728
受污染的画布
canvas生成图片toDataURL报错(Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasEl)
sumimg的博客
04-01 1万+
现象：在使用canvas的toDataURL（）方法时，控制台有时会报错：Uncaught DOMException: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported. 原因：这是由于之前由drawImage（）向canvas导入的图片跨域而导致的。 解决方法： 1、在引用图片之前打开跨域资源允许权限（一定要注意顺序）： var img=new Image; img.setA
详解canvas.toDataURL()报错的解决方案全都在这了
11-21
Uncaught DOMException: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported. 关键词 canvas.toDataURL() crossOrigin Access-Control-Allow-Origin 前言 最近在...
Failed to execute goal org...的解决办法
08-30
主要介绍了Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1的解决办法的相关资料,需要的朋友可以参考下
Failed to execute goal org.apache.maven.plugins:maven-compiler
03-03
在<plugins></plugins>中添加 <groupId>org.apache.maven.plugins <artifactId>maven-compiler-plugin <version>3.8.1 <source>1.8 <target>1.8 </plugin>
Maven报错: Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.0.2:resources
01-08
idea创建Maven项目时，报错显示Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.0.2:resources，并且Maven插件内看不到 mybatis-generator。如下图： 折腾了好久发现配置放错地方了，...
html2canvas 报错：Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement : Tainted canvases may not be ...
杨杨吖的博客
10-10 3676
html2canvas 报错：Failed to execute 'toDataURL' on 'HTMLCanvasElement : Tainted canvases may not be ...
uniapp中canvas绘制图片内容空白报错原因总结
zhangxueyou2223的博客
04-12 6532
🧨🧨🧨1.画布的大小大于了图片的大小导致了生成的内容是空白的,canvas画布初始值没有，导致没有绘制成功//默认初始值 canvasWidth1 canvasHeight1data() {return {ctx: null,},
Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
异度空间
08-12 3991
canvas.toDataURL("image/jpg;base64;");canvas提交img时报错： Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. 原因是： your local drive is de...
Uncaught SecurityError: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases may
qq_32486011的博客
07-17 3956
一旦您将未经 CORS 批准从其他来源加载的任何数据绘制到画布中，画布就会被污染。受污染的画布不再被认为是安全的，任何从画布取回图像数据的尝试都将导致抛出异常。 在受污染的画布上调用以下任何一个都会导致错误： 调用getImageData()画布的上下文 调用toBlob()上的元素本身 toDataURL()在画布上调用 当画布被污染时尝试任何这些都会导致SecurityError抛出 a 。这可以防止用户在未经许可的情况下使用图像从远程网站提取信息而暴露私人数据。 以上信息来自mozila 大概的意思就
浏览器跨域图片 提示 BackgroundImgae.tsx:84 Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanva
最新发布
Hu560231的博客
04-16 571
未捕获的 DOMException: 未能在‘ HTMLCanvasElement’上执行‘ toDataURL’: 受污染的画布可能无法导出。
canvas导出绘制图片canvas.toDataURL()报错
青茶
03-13 998
答案：这个问题因为是基于file:// 进行调试的，而chrome做了安全相关的处理，主要是HTML5安全的CORS（跨域资源共享）的安全限制，造成出现这样的提示，如果你需要在自己的电脑上调试的话，只需要本地搭建一个服务器环境就可以了。canvas绘制图片后，想导出图片，用canvas.toDataURL获取，发现打印不出数据，还报错。前面我一直是本地进行的所以一直报错，现在我搬到PHP环境，就解决了。不是代码问题，是环境问题。一直想了很久，查资料，这代码也没有错啊。效果图：可以打印出来图片了。
头像裁剪和Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases m
长歌的博客
04-08 1753
头像裁剪的主要实现是同事找来发我的，用着还不错。记一下，可以用作以后研究。 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值