Canvas转换为Blob对象并使用Ajax发送
Canvas转换为Blob对象并使用Ajax发送
转换为Blob对象后,可以使用Ajax上传图像文件。
先从canvas获取dataurl, 再将dataurl转换为Blob对象
var dataurl = canvas.toDataURL('image/png');
var blob = dataURLtoBlob(dataurl);
//使用ajax发送
var fd = new FormData();
fd.append("image", blob, "image.png");
var xhr = new XMLHttpRequest();
xhr.open('POST', '/server', true);
xhr.send(fd);
转:https://blog.csdn.net/cuixiping/article/details/45932793
Canvas转换为Blob对象并使用Ajax发送的更多相关文章
- 关于web前端base64转换为Blob,存入数组后 ajax请求传输到后端 接受不到文件问题
前端console输出是正常Blob对象,通过ajax formdata 传输到 后端java SpringMvc用MultipartFile接受却一直接受不到,后来直接解析HttpServletRe ...
- [转] Blob对象
Blob是计算机界通用术语之一,全称写作:BLOB(binary large object),表示二进制大对象.MySql/Oracle数据库中,就有一种Blob类型,专门存放二进制数据.在javas ...
- js,JQ 图片转换base64 base64转换为file对象,blob对象
//将图片转换为Base64 function getImgToBase64(url,callback){ var canvas = document.createElement('canvas'), ...
- Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表
本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...
- ajax对象。同步与异步及ajax发送请求
ajax对象的属性.方法 属性 readyState: Ajax状态码 * 0:表示对象已建立,但未初始化,只是 new 成功获取了对象,但是未调用open方法 1:表示对象已初始化,但未发送,调用了 ...
- 利用 jQuery-photoClip插件 实现移动端裁剪功能并以Blob对象上传
最近客户要求实现论坛贴子附件裁剪功能,没有考虑js与ios.android容器交互解决方案,单纯用js去实现它的.由于本来附件上传用的别的插件实现的,所以是在此基础上费了不少劲,才把jQuery-ph ...
- html + js 实现图片上传,压缩,预览及图片压缩后得到Blob对象继续上传问题
先上效果 上传图片后(设置了最多上传3张图片,三张后上传按钮消失) 点击图片放大,可以使用删除和旋转按钮 (旋转功能主要是因为ios手机拍照后上传会有写图片被自动旋转,通过旋转功能可以调正) html ...
- JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串、blob对象在上传
主题: JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串.blob对象在上传. 用处: 从本地选择图片上传,如项目规定只能选择本项目文件夹下的图像上传为头像等. 主要思想: ...
- base64格式图片转换为FormData对象进行上传
原理:理由ArrayBuffer.Blob和FormData var base64String = /*base64图片串*/; //这里对base64串进行操作,去掉url头,并转换为byte va ...
随机推荐
- Ubantu配置protoc2.5.0
首先得到 protobuf 相应的包文件 ,在终端上输入如下 wget http://protobuf.googlecode.com/files/protobuf-2.5.0.tar.gz 下载完毕后 ...
- Delphi XE10下用FireDAC与SQLite连接要注意的问题 转
Delphi在XE的版本上,已经实现了安卓与苹果的移动跨平台,因此只需要一份代码,就可以统领两种手机平台,确实是一种高效的做法和节约的策略. 用Delphi XE7连接SQLite,主流使用Fir ...
- StatefulSet在ZooKeeper和Kafka的实践
K8s的版本是1.7.6 采用nfs的nas存储模式 NFS的问题 建立zk集群的时候总是发现myid绑定一个id,先describe pod确认每个绑定不同的pvc,然后就确认是pv创建的问题,pv ...
- ylbtech-LanguageSamples-Versioning(版本控制)
ylbtech-Microsoft-CSharpSamples:ylbtech-LanguageSamples-Versioning(版本控制) 1.A,示例(Sample) 返回顶部 “版本控制”示 ...
- C#接收xmlrpc接口返回哈希表格式
C#在调用xmlrpc接口时返回的是int值就可以直接获取,最近在调用一个接口是获取一个账号记录的详细信息,xmlrpc接口返回的是一个哈希值. 所以直接用int或者Hashtable 来获取返回值执 ...
- SQL精华应用
[精确到纳秒的时间函数] SYSDATETIME().SYSUTCDATETIME() ---- 精确程度取决于执行 SQL Server 实例的计算机硬件和 Windows 版本号 [ ...
- 封装自用的脚本ajax.js
function createxmlhttp() { xmlhttpobj = false; try{//创建对象,一个一个的试,哎,要是能统一标准都好.. xmlhttpobj = new XMLH ...
- linux mysql 更改MySQL数据库目录位置
MySQL默认的数据文件存储目录为/var/lib/mysql.假如要把目录移到/home/data下需要进行下面几步: 1.home目录下建立data目录 cd /home mkdir data 2 ...
- Ubuntu切换root用户权限
其实方法很简单,就是需要选对自己使用的linux系统,不同分支的系统切换root的方法不一定一样. Ubuntu切换root的方法很简单,首先一档钱管理员命令执行: sudo passwd root ...
- redis学习笔记——expire、pexpire、expireat、pexpireat的执行过程
这里主要讲的Redis是怎么样设置过期键的,可以算作后续"Redis过期键的删除策略"的前篇或者说预备知识. 在了解过期键问题前我们首先需要对redis的数据库和数据库键空间有一定 ...