如何将文本保存到文件并再次读取,但在javascript中保存为二进制文件

时间:2016-06-30 02:01:59

标签: javascript typescript io binary

我使用FileSaver.js from a SO question

从字符串构建文件保护程序
let byteChars = atob("my string");
let byteNumbers = new Array(byteChars.length);
for (var i = 0; i < byteChars.length; i++) {
  byteNumbers[i] = byteChars.charCodeAt(i);
}
let byteArray = new Uint8Array(byteNumbers);
var data:Blob = new Blob([byteArray], {type: "application/octet-stream"});
var filename:string = filename + '.myext';
saveAs(data, filename, true);

然后我必须使用Javascript&#39的FileReader将其读回"my string"

let fr = new FileReader();
fr.onload = (e:FileReaderEvent) => {
    let result:any = e.target.result;
    //I don't know what I have to do with this type of data to get "my string" back
    };
fr.readAsBinaryString(file);

1 个答案:

答案 0 :(得分:2)

修改,更新

写文件

let byteChars = atob("my string");
let byteNumbers = new Array(byteChars.length);
for (var i = 0; i < byteChars.length; i++) {
  byteNumbers[i] = byteChars.charCodeAt(i);
}
let byteArray = new Uint8Array(byteNumbers);
var data = new Blob([byteArray], {type: "application/octet-stream"});
saveAs(data, "myfile.abc");

读取文件

<input type="file">
<script>
 var reader = new FileReader();
 reader.addEventListener("load", function(e) {
   document.body.innerHTML += "<br>" + btoa(e.target.result);
 });
  document.querySelector("input[type=file]")
  .addEventListener("change", function(e) {
     reader.readAsBinaryString(e.target.files[0])
  })
</script>

plnkr http://plnkr.co/edit/0KVhXnd0JpysplDLcAlC?p=preview

您可以使用TextEncoder()TextDecoder()FileReader().readAsBinaryString()

&#13;
&#13;
var str = "my string";
var encoder = new TextEncoder();
var encodedBytes = encoder.encode(str);
// do file save stuff
var decoder = new TextDecoder();
var decodedBytes = decoder.decode(encodedBytes);

console.log(encodedBytes, decodedBytes);

// alternatively, using `FileReader()`
var reader = new FileReader();
reader.onload = function() {
  console.log("FileReader result:", reader.result)
}
reader.readAsBinaryString(new Blob([encodedBytes]))
&#13;
&#13;
&#13;