Cordova文件模塊

1. 安裝

cordova plugin add cordova-plugin-file

2.添加按鈕

<button id = "createFile">創建文件</button>
<button id = "writeFile">寫入文件</button>
<button id = "readFile">讀取文件</button>
<button id = "removeFile">刪除文件</button>
<textarea id = "textarea"></textarea>

3. 添加事件

事件都添加到deviceReady事件中

3.1 創建文件

document.getElementById("createFile").addEventListener("click", createFile);
function createFile() {
    var type = window.TEMPORARY; // TEMPORARY暫時的 PERSISTENT持久的
    var size = 5*1024*1024;      // 文件大小
    // 打開文件系統
    // 四個參數(存儲類型,存儲大小,成功時回調,失敗時回調)
    window.requestFileSystem(type, size, successCallback, errorCallback)
    // 成功的回調函數的參數是一個 FileSystem對象
    function successCallback(fs) {
       console.log(fs);
       // fs.root是一個DirectoryEntry對象
       // fs.root.getFile(文件名,配置參數,成功回調函數,失敗回調函數)
       // 參數 create:true true則是創建文件 false不創建  exclusive:true時 文件存在則報錯 false則不會
       // 成功時的回調函數的參數爲fileEntry對象
       fs.root.getFile('log.txt', {create: true, exclusive: false}, function(fileEntry) {
           // fileEntry中的屬性
           // fullPath isDirectory isFile name nativeURL
           // 方法 
           // createWriter(successCallback,failCallback) 寫入文件使用
           // file(successCallback,failCallback)         讀取文件使用
          alert('創建文件成功')
       }, errorCallback);
    }
 }

3.2 寫入文件

document.getElementById("writeFile").addEventListener("click", writeFile);
 function writeFile() {
    var type = window.TEMPORARY; // 同3.1中一致
    var size = 5*1024*1024;      // 同3.1中一致
    // 打開文件系統
    // 四個參數(存儲類型,存儲大小,成功時回調,失敗時回調)
    window.requestFileSystem(type, size, successCallback, errorCallback)
    // 打開成功時的回調函數
    function successCallback(fs) {
       // fileSystem對象
       console.log(fs.root)
       // create爲true時  文件不存在會創建文件
       fs.root.getFile('log.txt', {create: true}, function(fileEntry) {
          // fileEntry.createWriter用於寫入文件 接收fileWriter對象
          fileEntry.createWriter(function(fileWriter) {
             console.log(fileWriter)
             // fileWriter中的屬性
             // error fileName length(字節長度) localUrl
             // 事件: onerror(e) onwriteend(e)
             // 寫入異常時觸發
             fileWriter.onwriteend = function(e) {
                alert('成功完成');
             };
             // 寫入完成時觸發
             fileWriter.onerror = function(e) {
                alert('寫入失敗: ' + e.toString());
             };
             // 寫入內容
             fileWriter.write('寫入的內容');
          }, errorCallback);
       }, errorCallback);
    } 
 }

3.3 讀取文件

function readFile() {
    var type = window.TEMPORARY;  // 同上
    var size = 5*1024*1024;       // 同上
    window.requestFileSystem(type, size, successCallback, errorCallback)
    function successCallback(fs) {
       // 讀取文件時 create不設置或者設置爲false就好
       fs.root.getFile('log.txt', {}, function(fileEntry) {
          // fileEntry.file用於讀取文件
          fileEntry.file(function(file) {
             // file對象
             // 屬性:size大小 lastModified:最後修改時間  name:文件名
             // start:讀取的起始位置 end:讀取的結束位置 type:類型 如text/plain;  
             // localUrl:本地Url
             console.log(file);
			 // 新建一個FileReader對象 用於讀取文件
             var reader = new FileReader();
             // 將file以text形式讀取出來
             // readAsArrayBuffer     以ArrayBuffer的形式讀出來
             // readAsBinaryString    以二進制的形式讀出來
             // readAsDataURL		  以數據Url的形式讀出來
             // readAsText			  以文本的形式讀出來
             reader.readAsText(file);
             // 方法 onerror onload onloadend onloadstart 見名知意
             // 讀取結束觸發 其中的this爲FileReader對象 result爲讀取的內容
             reader.onloadend = function(e) {
                var txtArea = document.getElementById('textarea');
                console.log(this)
                txtArea.value = this.result;
             };
          }, errorCallback);
       }, errorCallback);
    }  
 }	

3.4 刪除文件

document.getElementById("removeFile").addEventListener("click", removeFile);
function removeFile() {
   var type = window.TEMPORARY;
   var size = 5*1024*1024;
   window.requestFileSystem(type, size, successCallback, errorCallback);
   // 成功時的回調函數
   function successCallback(fs) {
      fs.root.getFile('log.txt', {create: false}, function(fileEntry) {
         console.log(fileEntry);
         // 刪除文件  這個方式是原型鏈上的 參數爲(成功回調,失敗回調)
         fileEntry.remove(function() {
            alert('文件刪除成功');
         }, errorCallback);
      }, errorCallback);
   }  
}	

這只是一種用法，能做到簡單的創建、讀寫和刪除，還有很多內容可以學習，之後學習了再做筆記。