本文將介紹PhoneGap API——File:經過JavaScript截獲本地文件系統。File是用於讀取、寫入和瀏覽文件系統層次結構的PhoneGap API。javascript
對象:php
屬性:java
備註:如下屬性雖然在W3C規範中進行了定義,但PhoneGap並不支持:數組
方法:安全
支持的平臺:服務器
getMetadata:併發
參數:app
簡單的範例:函數
function success(metadata) { console.log("Last Modified:" + metadata.modificationTime); } function fail(error) { alert(error.code); } // 請求這個條目的元數據對象 entry.getMetadata(success, fail);
moveTo:
參數:
簡單的範例:
function success(entry) { console.log("New Path:" + entry.fullPath); } function fail(error) { alert(error.code); } function moveDir(entry) { var parent = document.getElementById('parent').value; newName = document.getElementById('newName').value; parentEntry = new DirectoryEntry({fullPath: parent}); // 移動目錄到一個新目錄,並將其重命名 entry.moveTo(parentEntry, newName, success, fail); }
copyTo:
參數:
簡單的範例:
function win(entry) { console.log("New Path:" + entry.fullPath); } function fail(error) { alert(error.code); } function copyDir(entry) { var parent = document.getElementById('parent').value, newName = document.getElementById('newName').value, parentEntry = new DirectoryEntry({fullPath: parent}); // 拷貝目錄到一個新的目錄,並將其重命名 entry.copyTo(parentEntry, newName, success, fail); }
toURI:
簡單的範例:
// 請求此條目的URI var uri = entry.toURI(); console.log(uri);
remove:
參數:
簡單的範例:
function success(entry) { console.log("Removal succeeded"); } function fail(error) { alert('Error removing directory: ' + error.code); } // 移除這個目錄 entry.remove(success, fail);
getParent:
參數:
簡單的範例:
function success(parent) { console.log("Parent Name: " + parent.name); } function fail(error) { alert('Failed to get parent directory: ' + error.code); } // 得到父級DirectoryEntry對象 entry.getParent(success, fail);
createReader:
簡單的範例:
getDirectory:
參數:
簡單的範例:
function success(parent) { console.log("Parent Name:" + parent.name); } function fail(error) { alert("Unable to create new directory:"+ error.code); } // 檢索一個已存在的目錄,若是該目錄不存在時則建立該目錄 entry.getDirectory(「newDir」, {create: true, exclusive: false}, success, fail);
getFile:
參數:
簡單的範例:
function success(parent) { console.log("Parent Name:" + parent.name); } function fail(error) { alert("Failed to retrieve file:" + error.code); } // 檢索一個已存在的文件,若是該文件不存在時則建立該文件 entry.getFile(「newFile.txt」, {create: true, exclusive: false}, success, fail);
removeRecursively:
參數:
簡單的範例:
console.log("Remove Recursively Succeeded"); } function fail(error) { alert("Failed to remove directory or it's contents:" + error.code); } // 刪除此目錄及其全部內容 entry.removeRecursively(success, fail);
方法:
支持的平臺:
readEntries:
參數:
簡單的範例:
function success(entries) { var i; for(i=0;i< entries.length;i++) { console.log(entries[i].name); } } function fail(error) { alert("Failed to list directory contents:" + error.code); } // 建立一個目錄讀取器 var directoryReader = dirEntry.createReader(); // 獲取目錄中的全部條目 directoryReader.readEntries(success,fail);
屬性:
詳述:
支持的平臺:
屬性:
詳述:
支持的平臺:
File System簡單的範例:
function onSuccess(fileSystem) { console.log(fileSystem.name); console.log(fileSystem.root.name); } // 請求當前持久化的文件系統 window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onSuccess, null);
完整的範例:
<!DOCTYPE html> <html> <head> <title>File System Example</title> <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8"> // 等待加載PhoneGap document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap加載完畢 function onDeviceReady() { window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, fail); } function onFileSystemSuccess(fileSystem) { console.log(fileSystem.name); console.log(fileSystem.root.name); } function fail(evt) { console.log(evt.target.error.code); } </script> </head> <body> <h1>Example</h1> <p>File System</p> </body> </html>
屬性:
備註:如下屬性雖然在W3C規範中進行了定義,但PhoneGap並不支持:
方法:
支持的平臺:
getMetadata:
參數:
簡單的範例:
function success(metadata) { console.log("Last Modified:" + metadata.modificationTime); } function fail(error) { alert(error.code); } // 請求這個條目的元數據對象 entry.getMetadata(success, fail);
moveTo:
參數:
簡單的範例:
function success(entry) { console.log("New Path: " + entry.fullPath); } function fail(error) { alert(error.code); } function moveFile(entry) { var parent = document.getElementById('parent').value, parentEntry = new DirectoryEntry({fullPath: parent}); // 移動文件到一個新目錄,並將其重命名 entry.moveTo(parentEntry, "newFile.txt", success, fail); }
copyTo:
參數:
簡單的範例:
function win(entry) { console.log("New Path: " + entry.fullPath); } function fail(error) { alert(error.code); } function copyFile(entry) { var parent = document.getElementById('parent').value, parentEntry = new DirectoryEntry({fullPath: parent}); // 拷貝文件到一個新的目錄,並將其重命名 entry.copyTo(parentEntry, "file.copy", success, fail); }
toURI:
簡單的範例:
// 請求此條目的URI var uri = entry.toURI(); console.log(uri);
remove:
參數:
簡單的範例:
function success(entry) { console.log("Removal succeeded"); } function fail(error) { alert('Error removing file: ' + error.code); } // 移除該文件 entry.remove(success, fail);
getParent:
參數:
簡單的範例:
function success(parent) { console.log("Parent Name: " + parent.name); } function fail(error) { alert(error.code); } // 得到父級DirectoryEntry對象 entry.getParent(success, fail);
createWriter:
參數:
簡單的範例:
function success(writer) { writer.write("Some text to the file"); } function fail(error) { alert(error.code); } // 建立一個用於寫文件的FileWriter對象 entry.createWriter(success, fail);
file
參數:
簡單的範例:
function success(file) { console.log("File size: " + file.size); } function fail(error) { alert("Unable to retrieve file properties: " + error.code); } // 得到此文件的屬性 entry.file(success, fail);
屬性:
方法:
詳述:
支持的平臺:
ReadAsDataURL:
參數:
簡單的範例:
unction win(file) { var reader = new FileReader(); reader.onloadend = function(evt) { console.log("read success"); console.log(evt.target.result); }; reader.readAsDataURL(file); } var fail = function(evt) { console.log(error.code); }; entry.file(win, fail);
ReadAsText:
參數:
簡單的範例:
function win(file) { var reader = new FileReader(); reader.onloadend = function(evt) { console.log("read success"); console.log(evt.target.result); }; reader.readAsText(file); } var fail = function(evt) { console.log(error.code); }; entry.file(win, fail);
Abort 簡單的範例:
function win(file) { var reader = new FileReader(); reader.onloadend = function(evt) { console.log("read success"); console.log(evt.target.result); }; reader.readAsText(file); reader.abort(); } function fail(error) { console.log(error.code); } entry.file(win, fail);
完整的範例:
<!DOCTYPE html> <html> <head> <title>FileReader Example</title> <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8"> // 等待加載PhoneGap document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap加載完畢 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); readAsText(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 readAsText(file) { var reader = new FileReader(); reader.onloadend = function(evt) { console.log("Read as text"); console.log(evt.target.result); }; reader.readAsText(file); } function fail(evt) { console.log(evt.target.error.code); } </script> </head> <body> <h1>Example</h1> <p>Read File</p> </body> </html>
iOS 的特異狀況:
屬性:
方法:
詳述:
支持的平臺:
Seek的簡單範例:
function win(writer) { // 快速將文件指針指向文件的尾部 writer.seek(writer.length); }; var fail = function(evt) { console.log(error.code); }; entry.createWriter(win, fail);
Truncate 的簡單範例:
function win(writer) { writer.truncate(10); } var fail = function(evt) { console.log(error.code); } entry.createWriter(win, fail);
Write 的簡單範例:
function win(writer) { writer.onwrite = function(evt) { console.log("write success"); }; writer.write("some sample text"); }; var fail = function(evt) { console.log(error.code); }; entry.createWriter(win, fail);
Append 的簡單範例:
function win(writer) { writer.onwrite = function(evt) { console.log("write success"); }; writer.seek(writer.length); writer.write("appended text); } var fail = function(evt) { console.log(error.code); }; entry.createWriter(win, fail); Abort 的簡單範例: function win(writer) { writer.onwrite = function(evt) { console.log("write success"); }; writer.write("some sample text"); writer.abort(); } var fail = function(evt) { console.log(error.code); }; entry.createWriter(win, fail);
完整的範例:
<!DOCTYPE html> <html> <head> <title>FileWriter Example</title> <script type="text/javascript" charset="utf-8" src="phonegap.0.9.4.js"></script> <script type="text/javascript" charset="utf-8"> // 等待加載PhoneGap document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap加載完畢 function onDeviceReady() { window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail); } function gotFS(fileSystem) { fileSystem.root.getFile("readme.txt", null, gotFileEntry, fail); } function gotFileEntry(fileEntry) { fileEntry.createWriter(gotFileWriter, fail); } function gotFileWriter(writer) { writer.onwrite = function(evt) { console.log("write success"); }; writer.write("some sample text"); // 文件當前內容是「some sample text」 writer.truncate(11); // 文件當前內容是「some sample」 writer.seek(4); // 文件當前內容依然是「some sample」,可是文件的指針位於「some」的「e」以後 writer.write(" different text"); // 文件的當前內容是「some different text」 } function fail(error) { console.log(error.code); } </script> </head> <body> <h1>Example</h1> <p>Write File</p> </body> </html>
屬性:
常量:
說明:
屬性:
方法:
詳述:
支持的平臺:
簡單的範例:
// !! 假設變量fileURI包含一個指向設備上一個文本文件的有效URI var win = function(r) { console.log("Code = " + r.responseCode); console.log("Response = " + r.response); console.log("Sent = " + r.bytesSent); } var fail = function(error) { alert("An error has occurred: Code = " = error.code); } var options = new FileUploadOptions(); options.fileKey="file"; options.fileName=fileURI.substr(fileURI.lastIndexOf('/')+1); options.mimeType="text/plain"; var params = new Object(); params.value1 = "test"; params.value2 = "param"; options.params = params; var ft = new FileTransfer(); ft.upload(fileURI, "http://some.server.com/upload.php", win, fail, options);
完整的範例:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>File Transfer Example</title> <script type="text/javascript" charset="utf-8" src="phonegap.0.9.4.min.js"></script> <script type="text/javascript" charset="utf-8"> // 等待加載PhoneGap document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap加載完成 function onDeviceReady() { // 從指定來源檢索圖像文件位置 navigator.camera.getPicture(uploadPhoto, function(message) { alert('get picture failed'); }, { quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY } ); } function uploadPhoto(imageURI) { var options = new FileUploadOptions(); options.fileKey="file"; options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1); options.mimeType="image/jpeg"; var params = new Object(); params.value1 = "test"; params.value2 = "param"; options.params = params; var ft = new FileTransfer(); ft.upload(imageURI, "http://some.server.com/upload.php", win, fail, options); } function win(r) { console.log("Code = " + r.responseCode); console.log("Response = " + r.response); console.log("Sent = " + r.bytesSent); } function fail(error) { alert("An error has occurred: Code = " = error.code); } </script> </head> <body> <h1>Example</h1> <p>Upload File</p> </body> </html>
屬性:
說明:
屬性:
說明:
iOS的特異狀況:
屬性:
常量:
說明:
屬性:
支持的平臺:
簡單的範例:
// 獲取data目錄,若是不存在則建立該目錄。 dataDir = fileSystem.root.getDirectory("data", {create: true}); // 建立lockfile.txt,當且僅當該文件不存在時。 lockFile = dataDir.getFile("lockfile.txt", {create: true, exclusive: true});
方法:
常量:
詳述:
支持的平臺:
Request File System簡單的範例:
function onSuccess(fileSystem) { console.log(fileSystem.name); } // 請求持久化的文件系統 window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onSuccess, onError); Resolve Local File System URI的簡單範例: function onSuccess(fileEntry) { console.log(fileEntry.name); } window.resolveLocalFileSystemURI("file:///example.txt", onSuccess, onError);
完整的範例:
<!DOCTYPE html> <html> <head> <title>Local File System Example</title> <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> <script type="text/javascript" charset="utf-8"> // 等待加載PhoneGap document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap加載完畢 function onDeviceReady() { window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFileSystemSuccess, fail); window.resolveLocalFileSystemURI("file:///example.txt", onResolveSuccess, fail); } function onFileSystemSuccess(fileSystem) { console.log(fileSystem.name); } function onResolveSuccess(fileEntry) { console.log(fileEntry.name); } function fail(evt) { console.log(evt.target.error.code); } </script> </head> <body> <h1>Example</h1> <p>Local File System</p> </body> </html>
屬性:
詳述:
支持的平臺:
簡單的範例:
function win(metadata) { console.log("Last Modified: " + metadata.modificationTime); } // 請求此條目的metadata對象 entry.getMetadata(win, null);