javascript - 如果我们有文件的 URL 驻留在客户端系统中，则使用 javascript 将任何类型的文件转换为 Base64-6ren

javascript - 如果我们有文件的 URL 驻留在客户端系统中，则使用 javascript 将任何类型的文件转换为 Base64

转载作者：行者123 更新时间：2023-11-29 18:12:14

25

4

如果我有文件的 url(在浏览器的沙盒 LocalFileSystem 中)客户端系统中已经存在，我如何将文件(png/jpg/word/excel 等)转换为 base64 格式使用 JavaScript。

我曾尝试使用创建 Canvas (图像)。
我也试过文件控制。
我不想使用任何控件，因为我们在 sqllite 数据库中有文件的 url。

我试过了

function UploadAttachmentfile() {
try {
      if(objAttachment.length >0)
      {
               var ctn = objAttachment.length;
                              for (var j = 0; j < ctn; j++) {
                              var row = objAttachment[j].IMGS; \\image
                                  var fname = row.split('\\').pop().split('/').pop();
                                  alert(fname);
                                  window.requestFileSystem(LocalFileSystem.TEMPORARY, 0, function (fs) {
                                  alert('request file system');
                                      fs.root.getDirectory("Foldername", null, function (entry) {
                                      alert('ENTRY : '+entry);
                                          entry.getFile(fname, null, function (fileEntry) {
                                              fileEntry.file(gotFile, fail);
                                          }, fail);
                                      }, fail);
                                  }, fail);
                                  function gotFile(file) {
                                      readDataUrl(file);
                                  }

                                  function readDataUrl(file) {
                                      var reader = new FileReader();
                                      reader.onloadend = function (evt) {
                                          alert("Read as data URL");
                                          alert("target result :"+evt.target.result);
                                      };
                                      reader.readAsDataURL(file);
                                  }

                                  function fail(evt) {
                                  alert('fail');
                                      alert(evt.target.error.code);
                                  }


                              }

                               }

}
catch (err) {
        }
}

但它总是只提醒失败。

最佳答案

如果您想在用户计算机上获取文件而无需用户选择它(每次 session 再次)，那么，您不能这样做(感谢 )。我强烈推荐阅读 this answer linked here以获得完整和最新的解释。
但是，如果您的用户在其 session 期间通过启用文件输入的元素选择文件，那么这很简单:
假设您在用户选择文件后使用 createObjectURL() 获得了 url，那么您只需使用文件阅读器的 readAsDataURL( fileObject || local URL ) 方法:
```
fileReader.readAsDataURL( fileObject );
```
这会将其编码为 base64。

编辑:
事实证明您正在使用 Cordova 开发手机(我已将该标签添加到您的问题中)。然而，它仍然基于文件 API 并具有相同的 .readAsDataURL() 方法:see documentation here .它包含针对不同移动平台的简单示例和注释!
此外，您似乎正试图从 File System API 的 LocalFileSystem 接口(interface)获取文件(这使您可以访问浏览器的沙盒文件系统)。所以我链接到的另一个答案不适用(很多)。

以下示例(根据上面链接的文档修改)应该可以帮助您入门:

<!DOCTYPE html>
<html>
  <head>
    <title>FileReader Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova-2.5.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for Cordova to load
    //
    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    // Cordova is ready
    //
    function onDeviceReady() {
        window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
    }

    function gotFS(fileSystem) {
        fileSystem.root.getFile("readme.txt", null, gotFileEntry, fail);
    }

    function gotFileEntry(fileEntry) {
        fileEntry.file(gotFile, fail);
    }

    function gotFile(file){
        readDataUrl(file);
    }

    function readDataUrl(file) {
        var reader = new FileReader();
        reader.onloadend = function(evt) {
            console.log("Read as data URL");
            console.log(evt.target.result);
        };
        reader.readAsDataURL(file);
    }

    function fail(evt) {
        console.log(evt.target.error.code);
    }

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>Read File</p>
  </body>
</html>

从这里开始，您更改了 console.log(evt.target.result); 部分:不是将 base64 输出写入控制台，而是将该字符串发送回服务器(再次使用 AJAX 等)

完成:)

关于javascript - 如果我们有文件的 URL 驻留在客户端系统中，则使用 javascript 将任何类型的文件转换为 Base64，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26322685/

25

4

0

文章推荐： javascript - jQuery - 设置计算的 div 宽度

文章推荐： javascript - Meteor.WrapAsync 不返回值

文章推荐： JavaScript:更改类指定的元素的样式

文章推荐： javascript - ng-repeat 不创建标签

java - 系统.out.println , 系统.err.println
我有这个代码: System.err.print("number of terms = "); System.out.println(allTerms.size()); System.err
java - 我可以使用 Ant 检测我是否在 Linux 系统(而不是通用 Unix 系统)上吗？
我有以下问题:在操作系统是 Linux 的情况下和在操作系统是 MacOs 的情况下，我必须执行不同的操作。所以我创建了以下 Ant 脚本目标: /u
系统()奇怪行为后关闭()
我正在调用 system("bash ../tools/bashScript\"This is an argument!\"&")，然后我正在调用 close(socketFD) 直接在 system
系统 verilog 中数组的约束
使用最初生成的随机元素来约束随机数组的连续元素是否有效。例如:我想生成一组 10 个 addr、size 对来模拟典型的内存分配例程并具有如下类: class abc; rand bit[5:0
cocoa 系统()进展？
我正在创建一个必须使用system(const char*)函数来完成一些“繁重工作”的应用程序，并且我需要能够为用户提供粗略的进度百分比。例如，如果操作系统正在为您移动文件，它会为您提供一个进度条，
architecture - 您如何描述您的解决方案/系统？
我即将编写一些项目经理、开发人员和业务分析师会使用的标准/指南和模板。目标是更好地理解正在开发或已经开发的解决方案。其中一部分是提供有关记录解决方案的标准/指南。例如。记录解决/满足业务案例/用户需
performance - 系统/操作系统缓存与应用程序缓存
在开发使用压缩磁盘索引或磁盘文件的应用程序时，其中部分索引或文件被重复访问(为了论证，让我们说一些类似于 Zipfian 分布的东西)，我想知道什么时候足够/更好地依赖操作系统级缓存(例如，Debia
Powershell "plugin"系统
我们编写了一个 powershell 脚本，用于处理来自内部系统的图像并将其发送到另一个系统。现在，业务的另一部分希望加入其中，对数据进行自己的处理，并将其推送到另一个系统。打听了一下，公司周围有几个
c# - 系统.ApplicationException
我正在尝试朗姆酒我的应用程序，但我收到以下错误:System.Web.HttpUnhandledException:引发了“System.Web.HttpUnhandledException”类型的异
javascript - 为如何使用您的网站制作教程的产品/系统
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的，
c - “系统”未在此范围内声明错误
所以我在其他程序中没有收到此错误，但我在这个程序中收到了它。这个程序是一个我没有收到错误的示例。 #include int main() { system("pause"); } // en
c# - 系统.UriFormatException
我在 c# System.URI.FormatExption 中遇到问题为了清楚起见，我使用的是 Segseuil 的 Matlab 方法，并且它返回一个图片路径 result。我想为其他用户保存此
c# - 系统.图纸引用
我正在尝试像这样设置文本框的背景色: txtCompanyName.BackColor = Drawing.Color.WhiteSmoke; 它不喜欢它，因为它要我在前面添加系统，例如: txtCo
c# - 系统.StackOverflowException
请帮助我解决 System.StackOverflowException我想用 .aspx 将记录写入数据库我使用 4 层架构来实现这一切都正常但是当我编译页面然后它显示要插入数据的字段时，当我将数据
Android 系统 API
我使用了一些通常由系统调用的API。因此，我将 android:sharedUserId="android.uid.system" 添加到 manifest.xml，并使用来自 GIT 的 And
java - 从应用程序重新安装/系统
我正在尝试创建一个小型应用程序，它需要对/system 文件夹进行读/写访问(它正在尝试删除一个文件，并创建一个新文件来代替它)。我可以使用 adb 毫无问题地重新挂载该文件夹，如果我这样做，我的应用
java - 从系统应用程序重新安装/系统；
我想从没有 su 的系统 priv-app 将/system 重新挂载为 RW。如何以编程方式执行此操作？只会用 Runtime.getruntime().exec() 执行一个 shell 命令吗
c# - 系统。无效操作异常
我正在尝试制作一个带有登录系统的程序我对此很陌生，但我已经连续工作 8 个小时试图解决这个问题。这是我得到的错误代码 + ServerVersion 'con.ServerVersion' threw
c++ - 系统()调用流文件的批处理可执行文件使程序在Windows上重置
当我“构建并运行”Code::Blocks 中的程序时，它运行得非常好!但是当我从“/bin”文件夹手动运行它时，当它试图用 system() 调用“temp.bat”时，它会重置。这是为什么？它没有
c++ - 系统/管道调用更改传递给执行的命令中的特殊字符
我想使用 system/pipe 命令来执行具有特殊字符的命令。下面是示例代码。通过系统/管道执行命令后，它通过改变特殊字符来改变命令。我很惊讶地看到系统命令正在更改作为命令传递的文本。 run(ch

首页

博学

6Ren·AI

商城

javascript - 如果我们有文件的 URL 驻留在客户端系统中，则使用 javascript 将任何类型的文件转换为 Base64