0

我正在尝试从计算机上的文件中读取文件并将其存储在变量中。我目前正在尝试：

var fr = new FileReader;

fr.onload = function() {

    //variable to hold file
    var data = fr.result;

    var c=document.getElementById("cvs");
    var ctx=c.getContext("2d");
    ctx.drawImage(img,0,0,200,180);
};

fr.readAsDataURL("encryptedImage");

这不起作用。我需要这样做才能解密文件系统上的加密图像。我已经关闭了安全性，因此可以从浏览器中读取我的文件系统。

有任何想法吗？

4

1 回答 1

0

从这里看起来您想通过将字符串传递给 readAsArrayBuffer() 来加载本地文件，但它期望一个 blob 或文件对象。该文件可以通过浏览器文件对话框加载。步骤是：选择文件，通过 fileReader asArrayBuffer 或 asDataURL 或 asBinaryString 加载文件...并在代码中操作或使用数据。

对于此示例，它从本地文件创建一个图像并将其绘制到画布上（但是，如果它是正确的 mime 类型“image.*”）。

我不确定您要应用哪种编码/解码。但对于数据的自定义操作，我建议使用 ArrayBuffers 和 TypeArrays。

FileReader.readAsDataURL() 的示例：http: //jsfiddle.net/uvmD7/

<body>
  <canvas id="cvs" width="200" height="200"></canvas>
  <input type="file" id="files" name="files[]" multiple />
</body>

和脚本：

document.getElementById('files').addEventListener('change', handleFileSelect, false);

var fr = new FileReader();

function handleFileSelect(evt) {
    var files = evt.target.files;
    fr.readAsDataURL(files[0]);
};

fr.onload = function(evt) {
    // do sth with it
    var data = evt.target.result; //fr.result 
    img = new Image();
    img.src = data; 
    //  draw after load
    img.onload = function() {
       var c=document.getElementById("cvs");
       var ctx=c.getContext("2d");
       ctx.drawImage(img,0,0,200,180);      
    };
};
于 2013-01-16T19:52:25.020 回答