解决 canvas 将图片转为base64报错
var canvas=document.getElementById("canvas"),//获取canvas
ctx = canvas.getContext("2d"), //对应的CanvasRenderingContext2D对象(画笔)
img = new Image(),//创建新的图片对象
base64 = '' ;//base64
img.src = 'http://www.xxxx.png';
img.setAttribute("crossOrigin",'Anonymous')
img.onload = function(){//图片加载完,再draw 和 toDataURL
ctx.drawImage(img,0,0);
base64 = canvas.toDataURL("image/png");
};
解决 canvas 将图片转为base64报错的更多相关文章
- 解决 canvas 将图片转为base64报错: Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasEleme...
问题描述 当用户点击分享按钮时,生成一张海报,可以保存图片分享到朋友圈,用户的图片是存储在阿里云的OSS,当海报完成后,执行.canvas.toDataURL("image/png" ...
- canvas将图片转为base64
最简例子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta ...
- Access to Image at 'file:///Users canvas本地图片跨域报错解决方案
1.设置跨域 添加跨域条件 crossorigin="anonymous" 前提是后端支持这个图片跨域 2.上面加了之后还是报错 如标题所示 你需要把你的项目放到服务器上面跑 ...
- Canvas引入跨域的图片导致toDataURL()报错的问题的解决
本文介绍了Canvas引入跨域的图片导致toDataURL()报错的问题的解决,分享给大家,具体如下: [场景] 用户打开网页,则请求腾讯COS(图片服务器)上的图片js代码.使用canvas绘图. ...
- canvas.toDataURL 由于跨域报错的解决方法
关于canvas.toDataURL 由于跨域报错的解决方法 用过canvas,都知道toDataURL这个方法真好用,不仅合成图片用到它,压缩图片也用到它.但有一个问题,就是图片源不能跨域,不然会报 ...
- Base64 报错 的解决办法 (Base-64 字符数组或字符串的长度无效。, 输入的不是有效的 Base-64 字符串,因为它包含非 Base-64 字符、两个以上的填充字符,或者填充字符间包含非法字符。)
Base64 报错 的解决办法, 报错如下:1. FormatException: The input is not a valid Base-64 string as it contains a n ...
- 两个由于php.ini配置错误导致的报错:ajax图片上传报错和exec报错
遇到了两个由于php.ini配置错误导致的报错:ajax图片上传报错和exec报错 首先第一个: 在做一个用ajax图片上传的功能中,php报了这样一个错误:File upload error - u ...
- 011_如何decode url及图片转为base64文本编码总结
一.咱们经常会遇到浏览器给encode后的url,如何转换成咱们都能识别的url呢?很简单,talk is easy,Please show me your code,如下所示: (1)英文decod ...
- 解决Sublime包管理package control 报错 There are no packages available for installation
解决Sublime包管理package control 报错 There are no packages available for installation 真的是哔了狗了,要不是我机智的重新安装了 ...
随机推荐
- 第三周学习进度条+PSP0过程文档
第三周学习进度条 第三周 所花时间(包括上课) 14:30-15:35(65)+19:00-21:20(140)+17:52-19:00(68)+19:10-20:45(95)+21:00-22 ...
- tomcat8.5 优化
第一步:配置user登录tomcat 参考:https://www.cnblogs.com/kevincaptain/p/10370794.html 第二步:性能优化 2.1tomcat的运行模式有3 ...
- stl中的transform()注意其与for_each的不同点(有无返回值)
#include<iostream> using namespace std; #include"vector" #include"algorithm&quo ...
- hadoopMR自定义输入类型
hadoop中的输入输出数据类型: BooleanWritable:标准布尔型数值 ByteWritable:单字节数值 DoubleWritable:双字节数值 FloatWritable:浮点数 ...
- 26. Remove Duplicates from Sorted Array C++ 删除排序数组中的重复项
https://leetcode.com/problems/remove-duplicates-from-sorted-array/ 双指针,注意初始时左右指针指向首元素! class Solutio ...
- python3 get/post/使用代理/自定义header/自定义Cookie
说明:urllib发送http请求并不是很人性化,更推荐使用在urllib基础上封装的.python2和python3都兼容的requests模块,移步查看. 一.get请求 get请求就是在构造Re ...
- VisualSVN+TortoiseSVN搭建版本控制系统教程
Tortoise VisualSVN用作SVN的服务端,TortoiseSVN用作SVN的客户端. 一.安装和配置VisualSVN 1.1安装VisualSVN 下载链接:https://www.v ...
- 微信UnionId 部分开放
以前要获得UnionID, 需要把公众号绑定到微信开放平台, 这个微信开放平台垃圾,还要300认证费. 今天突然发现在这个接口 https://api.weixin.qq.com/cgi-bin/us ...
- 【转】java提高篇(二)-----理解java的三大特性之继承
[转]java提高篇(二)-----理解java的三大特性之继承 原文地址:http://www.cnblogs.com/chenssy/p/3354884.html 在<Think in ja ...
- 【2】IOS APP打包发布
目的: 本文的目的是对IOS APP打包发布做了对应的介绍,大家可根据文档步骤进行mac环境部署: 申请苹果开发者账号 此处略 创建申请证书 这样做的目的就是为你的电脑安装发布许可证,只有这样你的电脑 ...