为了账号安全,请及时绑定邮箱和手机立即绑定

请问如何在JavaScript中将文件转换为base 64?

/ 猿问

请问如何在JavaScript中将文件转换为base 64?

狐的传说 2019-10-20 12:12:16

如何在JavaScript中将文件转换为base 64?

现在,我将通过以下一行获得File对象:

file = document.querySelector('#files > input[type="file"]').files[0]

我需要通过64基地的json发送这个文件。如何将其转换为Base 64字符串?


查看完整描述

3 回答

?
qq_花开花谢_0

使用FileReader 班级,等级:

function getBase64(file) {
   var reader = new FileReader();
   reader.readAsDataURL(file);
   reader.onload = function () {
     console.log(reader.result);
   };
   reader.onerror = function (error) {
     console.log('Error: ', error);
   };}var file = document.querySelector('#files > input[type="file"]').files[0];getBase64(file); // prints the base64 string

注意.files[0]File类型,它是Blob..因此,它可以与FileReader.
看完整的工作.



查看完整回答
反对 回复 2019-10-22
?
ITMISS

如果您正在寻找一种基于承诺的解决方案,这是@Dmitri的代码,用于此:

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
  });}var file = document.querySelector('#files > input[type="file"]').files[0];getBase64(file).then(
  data => console.log(data));



查看完整回答
反对 回复 2019-10-22
?
慕哥9229398

在Dmitri Pavlutin和joShua.pling答案的基础上,这里提供了一个扩展版本,它提取base 64内容(在开始时删除元数据),并确保填充是正确的.

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => {
      let encoded = reader.result.replace(/^data:(.*;base64,)?/, '');
      if ((encoded.length % 4) > 0) {
        encoded += '='.repeat(4 - (encoded.length % 4));
      }
      resolve(encoded);
    };
    reader.onerror = error => reject(error);
  });}



查看完整回答
反对 回复 2019-10-22

添加回答

回复

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信