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

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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • MFC线程同步—— CCriticalSection类使用

    MFC线程同步—— CCriticalSection类使用多个线程访问临界区时,可以使用临界区对象。临界区对象是一个独占性共享资源,任一时刻只有一个线程可以拥有临界区。拥有临界区的线程可以访问被保护起来的资源或代码段,其他希望进入临界区的线程将被挂起等待,直到拥有临界区的线程放弃临界区时为止。CCriticalSection类的用法:方法一:(1)定义CCriticalSection类的一个全局对象(以使各个线程均能访问):

    2022年7月20日
    9
  • Lync Server 2013 标准版部署(四)前端拓扑发布

    Lync Server 2013 标准版部署(四)前端拓扑发布

    2021年5月27日
    122
  • pycharm配置python运行环境_C中调用Python

    pycharm配置python运行环境_C中调用Python目录前言一、系统路径说明二、环境配置1.在VS中选择ReleaseX642.菜单栏中选择:项目->属性3.生成dll答疑python程序目录下没有Numpy路径?具体代码参考博客前言本文主要讲解在Python程序中调用C(C++)程序的方法。主要思路是:在VS中配置好环境后,将C语言程序打包生成动态库文件.dll。将.dll改名成.pyd之后,装入相应路径,在pycharm中直接import即可环境:win10Pycharm(python3.6)(64位)VS2017(社区版)

    2022年8月26日
    2
  • cbow模型详解_drude模型的三个基本假设

    cbow模型详解_drude模型的三个基本假设初始化:初始化方法的参数包括词汇个数vocab_size和中间层的神经元个数hidden_size。首先生成两个权重(W_in和W_out),并用一些小的随机值初始化这两个权重。设置astype(‘f’),初始化将使用32位的浮点数。生成层:生成两个输入侧的MatMul层、一个输出侧的MatMul层,以及一个SoftmaxwithLoss层。保存权重和梯度:将该神经网络中使用的权重参数和梯度分别保存在列表类型的成员变量params和grads中。正向传播for.

    2022年9月7日
    0
  • 解压war包工具_rar解压下载

    解压war包工具_rar解压下载解压war,要用jar命令jar-xfdemo.war

    2022年10月5日
    0
  • kafka多线程消费[通俗易懂]

    kafka多线程消费[通俗易懂]1、zookeeper集群搭建:https://blog.csdn.net/qq_31289187/article/details/809333652、kafka集群搭建:https://blog.csdn.net/qq_31289187/article/details/809552283、kafka生成消息:https://blog.csdn.net/qq_31289187/articl…

    2022年10月14日
    0

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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