解决 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 真的是哔了狗了,要不是我机智的重新安装了 ...
随机推荐
- 关于linux中用vi新建立一个.c文件无法保存,显示E212错误的时候
在ubuntu16.04环境下,用vi新键.c文件,怎么保存也不能 先按ESC 然后: 在后wq 可是显示文件212错误. 后来知道在建立.c的文件夹的权限不对.这里的权限用 ls -l来查看 ...
- 新增节点NewBook并增加属性Name="WPF"
XmlDocument xmlDoc = new XmlDocument(); xmlDoc.Load(xmlPath); var root = xmlDoc.DocumentElement;//取到 ...
- PAT 1023 Have Fun with Numbers
1023 Have Fun with Numbers (20 分) Notice that the number 123456789 is a 9-digit number consisting ...
- Python----list&元祖常用方法总结
一.创建列表,把使用逗号分隔的数据用中括号[ ]括起来即为一个列表,列表也叫数组.list.array:列表里面也可以再套列表,一个列表里面套一个列表,叫二维数组:一个里面套一个列表,里面的列表再套 ...
- 一、Redis数据备份与恢复
Redis里的数据都是保存在内存中,关闭服务器必须进行数据备份. 1.Redis的数据持久化 bgsave做镜像全量持久化,AOF做增量持久化. bgsave的原理:fork和cow(copy on ...
- 【转】Code First 属性详解
下面解释每个配置的作用 Table :用于指定生成表的表名.架构信息. Column :用于指定生成数据表的列信息,如列名.数据类型.顺序等. Key :用于指定任何名称的属性作为主键列并且默认将此列 ...
- Windows系统目录解释
目录 说明 C:\Program Files 64位程序安装目录 C:\Program Files (x86) 32位程序安装目录 C:\Windows 操作系统主要目录 C:\Windows\Sys ...
- 创建含有多module的springboot工程(八)
创建根工程 创建一个maven 工程,其pom文件为: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <?xml version="1.0" enc ...
- python 豆瓣验证码识别总结
总结: pytesseract 识别比较标准的图片 识别成功率 还是不错的. 验证码的图片识别 需要先处理好 再用pytesseract 识别 from PIL import Image ...
- C/C++ 全局变量的访问
#include <iostream> using namespace std; ; int main(int argc, char **argv) { ; std::cout <& ...