canvas.toDataURL('image/png')报错处理方法
来源:互联网 发布:为什么wifi网络不稳定 编辑:程序博客网 时间:2024/06/03 14:01
问题背景:
遇到一个需求,要对播放的视频进行截图,视频使用video标签来播放,然后点击视频播放区域时截取实时的帧图片。
代码很简单如下:
var video = document.getElementById('video'); var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); var img = document.getElementById('img'); function snapshot() { ctx.drawImage(video,0,0); img.src = canvas.toDataURL('image/png'); } video.addEventListener('click', snapshot, false);
问题提示:
Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
经过查阅和分析,发现这个其实是由于视频文件所在的域和图片和页面所在域不同,出现跨域传输的问题。
解决方案:
将视频文件放到页面所在域下。
1 0
- canvas.toDataURL('image/png')报错处理方法
- canvas 执行canvas.toDataURL("image/png"); 出错
- canvas.toDataURL方法调用报错(Uncaught SecurityError)的解决
- Flask报错处理方法
- fckeditor 上传文件报错处理方法
- Hadoop报错处理方法汇总
- Hive报错处理方法汇总
- Maven报错处理方法汇总
- JSP调用javabean报错处理方法
- EhCache配置报错处理方法记录
- ASPxGridView报错处理
- mencoder 报错处理
- tomcat报错处理
- Unity 报错处理
- @override 报错处理
- javaee报错处理
- RSS报错处理
- SVN报错处理
- 采用UltraISO制作U盘启动盘
- Android 使用Android Studio + Gradle 或 命令行 进行apk签名打包
- Oracle 进程之 增量检查点
- Web缓存(配置squid)
- android ios中代码打开qq与指定号码的人聊天
- canvas.toDataURL('image/png')报错处理方法
- DevExpress TreeList 展开当前节点及父节点
- Jquery $.ajax 莫名其妙出错(Firefox下一直到error,返回结果又正常)
- Provision Discovery流程分析
- 写论文时word2007的一些问题
- android NFC学习笔记
- 杭电ACM-1237-简单计算器
- 集合框架(Collection)
- 阿斯打扫打扫打扫阿斯打扫气温千瓦时的啊死党