js 图片转换base64 base64转换为file对象

全栈程序员-站长 • 2022年4月3日上午10:35 • 未分类 • 阅读 51

js 图片转换base64 base64转换为file对象

大家好，又见面了，我是你们的朋友全栈君。

js 图片转换base64 base64转换为file对象

function getImgToBase64(url,callback){
   
   //将图片转换为Base64
  var canvas = document.createElement('canvas'),
    ctx = canvas.getContext('2d'),
    img = new Image;
  img.crossOrigin = 'Anonymous';
  img.onload = function(){
    canvas.height = img.height;
    canvas.width = img.width;
    ctx.drawImage(img,0,0);
    var dataURL = canvas.toDataURL('image/png');
    callback(dataURL);
    canvas = null;
  };
  img.src = url;
}

    function dataURLtoFile(dataurl, filename) {
   
   //将base64转换为文件
        var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
            bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
        while(n--){
            u8arr[n] = bstr.charCodeAt(n);
        }
        return new File([u8arr], filename, {type:mime});
    }

//可以将图片转换为base64

getImgToBase64('img/test.png',function(data){
　　　var myFile = dataURLtoFile(data,'testimgtestimgtestimg');
　　　console.log(myFile);
});

相关: https://www.cnblogs.com/fps2tao/p/9268380.html

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们举报，一经查实，本站将立刻删除。

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/107436.html原文链接：https://javaforall.net

赞 (0)

全栈程序员-站长

0 0

在处理PowerBuilder的itemchanged事件中,acceptText的使用介绍[通俗易懂]

在处理PowerBuilder的itemchanged事件中,acceptText的使用介绍[通俗易懂]在窗口的itemchanged事件中,获取当前输入的值时,往往是无法拿到值的,此时值还没有提交,所以获取的都是null,此时可以通过使用dwcontrol.acceptText()来设置值的提前存

全栈程序员-站长
2022年7月1日
32
无线AP、WiFi、WLAN是什么关系？

无线AP、WiFi、WLAN是什么关系？最近在看科技论文，有些基础知识不是很清楚，故作了解近年来，无线AP被越来越多的应用于商场、车站、机场等公共场所，已变得与我们的生活息息相关，成为社会发展的一个趋势。但许多人弄不清楚无线AP与WiFi、WLAN之间的关系，以为WiFi就是WLAN，它们之间到底有什么不同？公共WiFi其实是一种无线AP技术今年央视315晚会曝光的公共WiFi安全隐患引起了社会各界的关注，但是有一个细节需要值得注意，那…

全栈程序员-站长
2022年7月11日
72
给定一个n个正整数组成的数组_算法基础课acwing下载

给定一个n个正整数组成的数组_算法基础课acwing下载给定一个长度为 N 的数列 A，以及 M 条指令，每条指令可能是以下两种之一：C l r d，表示把 A[l],A[l+1],…,A[r] 都加上 d。Q l r，表示询问数列中第 l∼r 个数的和。对于每个询问，输出一个整数表示答案。输入格式第一行两个整数 N,M。第二行 N 个整数 A[i]。接下来 M 行表示 M 条指令，每条指令的格式如题目描述所示。输出格式对于每个询问，输出一个整数表示答案。每个答案占一行。数据范围1≤N,M≤105,|d|≤10000,|A[i]|≤1

全栈程序员-站长
2022年8月9日
6
代码农民提高生产力

代码农民提高生产力

全栈程序员-站长
2022年1月4日
51
redis客户端连接工具连接docker里面redis_gbase客户端连接工具

redis客户端连接工具连接docker里面redis_gbase客户端连接工具Redis客户端连接工具AnotherRedisDesktopManagermac想用到brew的话，地址：https://www.jianshu.com/p/b7b789a2ed2cAnotherRedisDesktopManager为redis可视化工具，真的巨好用呀！！！原文地址：https://blog.csdn.net/huizhou_achao/article/details/108467792下载及安装教程地址：https://github.com/qishibo/An

全栈程序员-站长
2022年9月19日
4
sctp介绍「建议收藏」

sctp介绍「建议收藏」SCTP介绍转自：http://www.ibm.com/developerworks/cn/linux/l-sctp/SCTP（STREAM CONTROL TRANSMISSION PROTOCOL 流控制传输协议）是IETF新定义的一个传输层transport layer协议（2000年）。是提供基于不可靠传输业务的协议之上的可靠的数据报传输协议。SCTP的设计用于通过IP网传输S

全栈程序员-站长
2022年6月15日
54

发表回复

关注全栈程序员社区公众号