FileWriterオブジェクトでのファイル上書きについて

前回「JavaScriptでFile Read/Writeをやってみた」でやった通り、FileWriterオブジェクトを使うことでファイルの書き込みは行えますが、既存のファイルに対して書き換えを行うと、うまく動かないことがあるので補足。

ファイル書き込み

  fs.root.getFile('log.txt', {create: true}, function(fileEntry) {

    // Create a FileWriter object for our FileEntry (log.txt).
    fileEntry.createWriter(function(fileWriter) {

      fileWriter.onwriteend = function(e) {
        console.log('Write completed.');
      };

      fileWriter.onerror = function(e) {
        console.log('Write failed: ' + e.toString());
      };

      // Create a new Blob and write it to log.txt.
      var bb = new Blob(['Lorem Ipsum']);
      fileWriter.write(bb);
    }, onError);
  }, onError);

 

ここで使っているFileWriterオブジェクトのwrite関数は、「JavaScript API Documentation」にて

NOTE: write does not adjust the file length if you overwrite an existing file with shorter content. Use truncate with the new content length to remove old data at the end of the file, if desired.

とある通り、既存のファイル内容より短い内容で書き込みする際は、

書き込んだ文字列の末尾以降に、既存文字列の差分が残ってしまうようです。

 

例

書き込み前のファイルの内容 : Hello World!
書き込む内容 : Good Bye

書き込み後のファイルの内容 : Good Byerld!

そういう時はtruncateを使うとファイルを削除せずに、ファイルの中身をクリアできます。

  fs.root.getFile('log.txt' {create: true}, function(fileEntry) {
    // Create a FileWriter object for our FileEntry (log.txt).
    fileEntry.createWriter(function(fileWriter) {

      fileWriter.onwriteend = function(e) {
        console.log('Truncate completed.');
      };

      fileWriter.onerror = function(e) {
        console.log('Truncate failed: ' + e.toString());
      };
      fileWriter.truncate(0); // 引数以降のファイルの中身をクリア
    }, onError);
  }, onError);

truncate -> write の順で実行すれば、ファイル書き換えが上手く行きます。

次回はこいつらを組み合わせて、自動テストをやってみよう！