function convertBase64UrlToBlob(urlData){

    var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头,并转换为byte

    //处理异常,将ascii码小于0的转换为大于0
var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
} return new Blob( [ab] , {type : 'image/png'});
}

  

个人博客 :很多好用的 npm 包 , 可以看看 https://gilea.cn/ 

canvas裁剪之后的base64转换为上传文件blob对象的更多相关文章

  1. 利用cropper插件裁剪本地图片,然后将裁剪过后的base64图片上传至七牛云空间

    现在做的项目需要做一些图片处理,由于时间赶急,之前我便没有处理图片,直接将图片放在input[type=file]里面,以文件的形式提交给后台,这样做简直就是最低级的做法,之后各种问题便出来了,人物头 ...

  2. Base64格式上传文件至阿里云(java)

    Controller @PostMapping("/save") public R save(@RequestBody ShareEntity share){ OSSClient ...

  3. 基于resteasy,Base64码上传文件

    package com.xgt.controller.bs; import com.xgt.bean.bs.VersionBean; import com.xgt.common.BaseControl ...

  4. c#+js 使用formdata上传文件

    如果不是使用form表单submit的形式,我们可以手动通过formdata传值(针对文件上传等) 比如: <html> <head> <meta name=" ...

  5. Python脚本控制的WebDriver 常用操作 <二十六> 上传文件

    测试用例场景 上传文件的方法是找到上传文件的对象,通常是的对象.然后直接往这个对象send_keys,传入需要上传文件的正确路径.绝对路径和相对路径都可以,但是上传的文件必须存在,否则会报错. Pyt ...

  6. java上传文件工具类

    这个是之前整理之前所学时与使用java向邮箱发送邮件一块找到的,一起贴出来供大家参考: import java.awt.image.BufferedImage; import java.io.File ...

  7. CANVAS运用-对图片的压缩上传(仅针对移动浏览器)

    最近在移动端设计头像上传功能时,原本是以<input type="file">直接通过formData上传,然而实际使用情况是:对于过大的图片(高像素手机所拍摄的照片等 ...

  8. 基于canvas和jsp的头像剪辑上传

    最近在做项目时候需要一个头像长传功能,但是现在照片动不动就几兆的,都是流量的浪费. 我只是简单想要上传一个头像而已... 经过几天发愤图强..总算是略有所获.. 基本思路: 1.html部分,图片剪辑 ...

  9. 文件上传三:base64编码上传

    介绍三种上传方式: 文件上传一:伪刷新上传 文件上传二:FormData上传 文件上传三:base64编码上传 Flash的方式也玩过,现在不推荐用了. 优点: 1.浏览器可以马上展示图像,不需要先上 ...

随机推荐

  1. ACM_N皇后问题

    N皇后问题 Time Limit: 2000/1000ms (Java/Others) Problem Description: 在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即任意2个皇后不 ...

  2. 解决WebSocket后台报错:The WebSocket session [0] has been closed and no method (apart from close()) may be called on a closed session

    场景1: 在后台数据对前台页面进行数据实时推送下,后台采取定时查询数据后,推送给前台页面.在这个过程中,前台页面不停的刷新页面,session在不停的关闭和开启,推送数据时,会出现session连接已 ...

  3. php 页面展示

    php 页面展示 复杂逻辑. 段落注释

  4. List 的属性与方法整理

    List<T> 类与 ArrayList 类比较类似.它实现了 IList<T> 泛型接口,长度可以动态增加. 可以使用 Add 或 AddRange 方法将项添加到 List ...

  5. 64位linux安装wine等软件

    我的系统是centos7 64位的,安装wine的时候以为和32位的一样,结果执行./configure的时候,出现错误(无法建立一个32位程序,您需要安装32位的开发库) configure: er ...

  6. Java高级程序员(5年左右)面试的题目集

    Java高级程序员(5年左右)面试的题目集 https://blog.csdn.net/fangqun663775/article/details/73614850?utm_source=blogxg ...

  7. LN : leetcode 690 Employee Importance

    lc 690 Employee Importance 690 Employee Importance You are given a data structure of employee inform ...

  8. LN : leetcode 207 Course Schedule

    lc 207 Course Schedule 207 Course Schedule There are a total of n courses you have to take, labeled ...

  9. webview页面间的通信问题

    前提 记一次多页面开发. 开发需求时会对页面刷新(reload),返回到上一页(用户返回 / history.go()) 页面间的通信 sessionStorage保存本次会话的信息,同步到新页面或上 ...

  10. switch-case用法

    1.switch-case 一般的用它来做值匹配的. //匹配 就是全等. /* 语法: switch(表达式){ case 值1: 表达式的值和 值1匹配上了,需要执行的代码; break; cas ...