檔案處理，從開始到完成

[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱 最新文件 ]

了解如何將檔案處理功能新增到使用 JavaScript 撰寫且在 Windows 8.1 上執行的 Windows 市集應用程式。

本主題的每個小節都會說明一個主要檔案處理功能，提供該功能詳細資料的主題連結，以及提供有關在本主題隨附的檔案處理，從開始到完成隨附範例中快速尋找相關程式碼的資訊。

注意  許多用來與資料夾和檔案互動的功能都是非同步的。您可以在 JavaScript 中的非同步程式設計了解如何撰寫非同步 JavaScript 應用程式。

 

檔案存取基本知識：列舉、取得屬性，以及讀寫資料

	快速入門：以程式設計方式存取檔案 您可以存取資料夾、媒體櫃、裝置或網路位置等位置中的檔案，只要一行程式碼就能完成—呼叫 StorageFolder.getFilesAsync 函式。請參閱以程式設計方式存取檔案，這裡提供的逐步指示說明如何執行列舉指定位置的最上層檔案與資料夾，以及查詢某個位置的檔案等工作。 這些步驟示範如何列舉特定位置中的檔案： 針對您想要的位置取得一個 StorageFolder 物件。例如，您可以參照其中一個靜態 KnownFolders 屬性 (例如 KnowFolders.picturesLibrary) 來達到這個目的。 呼叫傳回之 StorageFolder 物件的 StorageFolder.getFilesAsync 函式。本主題的隨附範例會在不搭配任何參數的情況下呼叫這個方法，亦即表示應該傳回所有檔案。若要查看使用查詢來呼叫 StorageFolder.getFilesAsync 的範例，請參閱快速入門：以程式設計方式存取檔案。 在 StorageFolder.getFilesAsync 函式執行完成後，您便可以使用 forEach 迴圈來逐一查看每個傳回的檔案。 這個程式碼範例會列舉 [圖片] 中的所有檔案。 // Get a StorageFolder object representing Pictures. var library = Windows.Storage.KnownFolders.picturesLibrary; // Get all files from the StorageFolder object. library.getFilesAsync().then(function (files) { // For each file found ... files.forEach(function (file) { // ... perform your processing. }); }); } 隨附範例中的這個螢幕擷取畫面顯示列舉 [圖片] 檔案的範例。 在範例中尋找：這個範例包含一個標題為 [FileAccessBasics] 的頁面，其中含有本節所呈現的範例。相關的 JavaScript 和 HTML 程式碼已集中到 FileAccessBasicsPage.js (OnEnumPicturesClick 函式) 和 FileAccessBasicsPage.html 檔案。
	快速入門：取得檔案的屬性 檔案屬性 (Property) 可描述或量化檔案的屬性 (Attribute) 或其內容。例如，檔案屬性 (Property) 包括檔案名稱、路徑、檔案大小、檔案屬性 (Attribute)、上次存取日期等資料。 快速入門：取得檔案的屬性說明如何擷取和顯示檔案的最上層屬性和基本屬性。 這些步驟為您示範如何取得最上層屬性或基本檔案屬性。 最上層檔案屬性—您擷取基本檔案屬性當做 StorageFile 類別的屬性。這些包括 StorageFile.attributes、StorageFile.contentType、StorageFile.dateCreated、StorageFile.displayName、StorageFile.displayType、StorageFile.fileType、StorageFile.folderRelativeId、StorageFile.isAvailable、StorageFile.name、StorageFile.path 和 StorageFile.provider (快速入門：判斷 Microsoft OneDrive 檔案的可用性說明如何使用 StorageFile.isAvailable)。 基本檔案屬性—您透過呼叫 StorageFile.getBasicPropertiesAsync 函式的方法擷取檔案的基本屬性，它會傳回 BasicProperties 物件，之後您可以使用該物件來擷取 BasicProperties.dateModified、BasicProperties.itemDate 和 BasicProperties.size 之類的檔案屬性。 這個程式碼範例會列舉 [圖片] 中所有的檔案，並顯示各個最上層和基本檔案屬性。請注意範例如何使用 JavaScript promises 來同步化兩個非同步作業 (StorageFolder.getFilesAsync 和 StorageFile.getBasicPropertiesAsync) 的結果。若要深入了解 JavaScript 中的非同步程式設計和 promises，請參閱 JavaScript 中的非同步程式設計。 // Get a StorageFolder object representing the Pictures Library. var library = Windows.Storage.KnownFolders.picturesLibrary; // Initialize string that holds all property information. var outString = ""; // Get all files from the StorageFolder object. library.getFilesAsync().then(function (files) { var promises = []; files.forEach(function (file) { promises.push(WinJS.Promise.as(file)); promises.push(file.getBasicPropertiesAsync()); }) return WinJS.Promise.join(promises); }) .done(function (results) { var counter = 0 while (counter < results.length) { var file = results[counter]; var props = results[counter + 1]; outString += "File name: " + file.name + "<br/>"; outString += "File type: " + file.fileType + "<br/>"; outString += "File size: " + props.size + "<br/>"; outString += "<br/>" counter = counter + 2; } }); 隨附範例中的這個螢幕擷取畫面顯示取得各種最上層和基本檔案屬性的範例。 在範例中尋找：這個範例包含一個標題為 [FileAccessBasics] 的頁面，其中含有本節所呈現的範例。相關的 JavaScript 和 HTML 程式碼已集中到 FileAccessBasicsPage.js (OnGetFilePropertiesClick 函式) 和 FileAccessBasicsPage.html 檔案。
	快速入門：讀取和寫入檔案 Windows 市集應用程式透過 FileIO 類別讀取和寫入檔案。請參閱快速入門：讀取和寫入檔案，其中包含的程式碼範例說明如何使用 FileIO 與 StorageFile 類別讀寫各種類型的資料。 將文字寫入檔案 若要寫入檔案，您必須先取得一個 StorageFile 物件以傳遞給其中一個 FileIO 函式來寫入資料。在隨附的範例中，是透過 StorageFolder.createFileAsync 函式建立一個檔案來完成這項作業。 在您擁有 StorageFile 物件之後，即可透過其中一個多載 FileIO.writeTextAsync 函式將文字寫入其基礎檔案中。 這個程式碼範例會將目前的日期/時間寫入範例檔案中。 // Create the sample file; replacing it if it already exists. var lib = Windows.Storage.KnownFolders.picturesLibrary; lib.createFileAsync("FileHandlingJs.txt", Windows.Storage.CreationCollisionOption.replaceExisting) .then(function (file) { if (file) { // Format a string based on the current data/time. var now = new Date(); var sampleFileContents = [[now.getMonth() + 1, now.getDate(), now.getFullYear()].join("/"), [now.getHours(), AddZero(now.getMinutes())].join(":"), now.getHours() >= 12 ? "PM" : "AM"].join(" "); // Write the text to the sample file. Windows.Storage.FileIO.writeTextAsync(file, sampleFileContents) .then(function () { // File's contents have been written at this point. }, function (error) { // Handle error. }); } }); 從檔案讀取文字 若要讀取檔案的內容，您必須先取得一個 StorageFile 物件以傳遞給其中一個 FileIO 函式來讀取資料。在隨附的範例中，是透過呼叫 StorageFolder.getFileAsync 函式來完成這項作業。 在您擁有 StorageFile 物件之後，即可透過其中一個多載 FileIO.readTextAsync 函式從其基礎檔案讀取內容。 這個程式碼範例會從範例檔案讀取內容。 // Open sample file. Windows.Storage.KnownFolders.picturesLibrary.getFileAsync("FileHandlingJs.txt") .then(function (file) { // If file found ... if (file) { // Read file's contents. Windows.Storage.FileIO.readTextAsync(file).then(function (contents) { // Process file contents as needed. }); } }, function (error) { // Handle error. }); 這個螢幕擷取畫面顯示執行範例並寫入範例檔的範例。 在範例中尋找：這個範例包含一個標題為 [FileAccessBasics] 的頁面，其中含有本節所呈現的範例。相關的 JavaScript 和 HTML 程式碼已集中到 FileAccessBasicsPage.js (OnWriteTextToFileClick 和 OnReadTextFromFileClick 函式) 與 FileAccessBasicsPage.html 檔案。

 

使用檔案和資料夾選擇器

快速入門：使用檔案選擇器存取檔案 選擇器—包含檔案選擇器和資料夾選擇器—是用來為使用者顯示檔案或資料夾清單，讓使用者能從中選取一或多個項目進一步處理。以程式設計方式設定選擇器，即可依循特定篩選器 (例如具有特定副檔名的檔案) 搜尋檔案與資料夾、從指定的資料夾開始、顯示特定檢視模式 (清單或縮圖)，以及更多功能。 下列程序示範如何設定用於單一檔案選取、多檔案選取及單一資料夾選取的各種選擇器。 設定單一檔案選取檔案選擇器 將 FileOpenPicker 物件具現化。 視需要設定 FileOpenPicker 物件的 viewMode、suggestedStartLocation 及 fileTypeFilter 屬性。 呼叫 FileOpenPicker.pickSingleFileAsync 函式。當 FileOpenPicker.pickSingleFileAsync 函式執行完成時，應用程式就會具備所選檔案的讀取/寫入權限。 這個程式碼範例會將用於單一檔案選取的檔案選擇器具現化並加以顯示。 // Instantiate a FileOpenPicker object. var openPicker = new Windows.Storage.Pickers.FileOpenPicker(); // Set the FileOpenPicker object's key properties. openPicker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; openPicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.picturesLibrary; openPicker.fileTypeFilter.replaceAll([".jpg", ".jpeg", ".png" ]); // Display the FileOpenPicker for single file selection. openPicker.pickSingleFileAsync().then(function (file) { // If the user selected a file ... if (file) { // ... process file as needed. } else { // User canceled the operation. } }); 設定多檔案選取檔案選擇器 將 FileOpenPicker 物件具現化。 視需要設定 FileOpenPicker 物件的 FileOpenPicker.viewMode、FileOpenPicker.suggestedStartLocation 及 FileOpenPicker.FileTypeFilter 屬性。 呼叫 FileOpenPicker.pickMultipleFileAsync 函式。當 FileOpenPicker.pickMultipleFileAsync 函式執行完成時，應用程式就會具備所選檔案的讀取/寫入權限。所選取的檔案會由 StorageFile 物件陣列來代表。該陣列的 sizes 屬性會告訴您已選取多少個檔案，因此您可以使用 for 迴圈搭配標準的陣列標記法來存取每個 StorageFile 物件。 這個程式碼範例會將用於多檔案選取的檔案選擇器具現化並加以顯示。 // Instantiate a FileOpenPicker object. var openPicker = new Windows.Storage.Pickers.FileOpenPicker(); // Set the FileOpenPicker object's key properties. openPicker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; openPicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.picturesLibrary; openPicker.fileTypeFilter.replaceAll([".jpg", ".jpeg", ".png"]); // Display the FileOpenPicker for multiple-file selection. openPicker.pickMultipleFilesAsync().then(function (files) { // If the user selected at least one file ... if (files.size > 0) { for (var i = 0; i < files.size; i++) { // ... process each file - For example, files[i] } } else { // User canceled the operation. } }); 設定資料夾選擇器 將 FolderPicker 物件具現化。 視需要設定 FolderPicker 物件的 FolderPicker.viewMode、FolderPicker.suggestedStartLocation 及 FolderPicker.fileTypeFilter 屬性。 呼叫 FileOpenPicker.pickSingleFileAsync 函式。當 FolderPicker.pickSingleFolderAsync 函式執行完成時，應用程式就會具備所選資料夾 (包括子資料夾) 的讀取/寫入權限。 這個程式碼範例會將資料夾選擇器具現化並加以顯示。 // Instantiate a FolderPicker object. var folderPicker = new Windows.Storage.Pickers.FolderPicker(); // Set the FileOpenPicker object's key properties. folderPicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.desktop; folderPicker.fileTypeFilter.replaceAll([".docx", ".xlsx", ".pptx"]); // Display the FolderPicker for folder selection. folderPicker.pickSingleFolderAsync().then(function (folder) { // If the user selected a folder ... if (folder) { // ... get the folder object. Windows.Storage.AccessCache.StorageApplicationPermissions. futureAccessList.addOrReplace("PickedFolderToken", folder); // Process folder as needed. } else { // User canceled operation. } }); 這個螢幕擷取畫面顯示執行範例及選取兩個檔案 (sample1.png 和 sample2.png) 的結果。 在範例中尋找：這個範例包含一個標題為 [檔案和資料夾選擇器] 的頁面，其中示範本節中概述的工作。本範例中的 JavaScript 程式碼和 HTML 分別位於 FilePickerPage.js 和 FilePickerPage.html 檔案中。

 

使用 OneDrive 檔案

快速入門：判斷 OneDrive 檔案的可用性 Windows 8.1 可讓使用者將 OneDrive 檔案標記為僅限線上存取。如果使用者與 OneDrive 中斷連線，就無法使用這些檔案。為了協助您以程式設計方式判斷檔案的可用性，我們新增了稱為 StorageFile.isAvailable 的屬性。 這些步驟示範如何使用 StorageFile.isAvailable 屬性來判斷檔案的可用性。 針對您想要的位置取得一個 StorageFolder 物件。例如，您可以參照其中一個靜態 KnownFolders 屬性 (例如 KnowFolders.picturesLibrary) 來達到這個目的。 呼叫傳回之 StorageFolder 物件的 StorageFolder.getFilesAsync 函式。本主題的隨附範例會在不搭配任何參數的情況下呼叫這個方法，亦即表示應該傳回所有檔案。若要查看使用查詢來呼叫 StorageFolder.getFilesAsync 的範例，請參閱快速入門：以程式設計方式存取檔案。 在 StorageFolder.getFilesAsync 函式執行完成後，您便可以使用 forEach 迴圈來逐一查看每個傳回的檔案。 這個程式碼範例會列舉 [圖片] 中的所有檔案，其中會顯示每個檔案的名稱、提供者名稱以及可用性。 // Get a StorageFolder object representing Pictures. var library = Windows.Storage.KnownFolders.picturesLibrary; // Initialize string that will contain the file name, provider name, // and availability for each file. var outString = ""; // Get all files from the StorageFolder object. library.getFilesAsync().then(function (files) { // For each file found ... files.forEach(function (file) { // Retrieve the file's name, provider name, and availability. outString += file.name + " (on " + file.provider.displayName + ") is " + (file.isAvailable ? "available" : "not available") + "\n"; }); }); 這個螢幕擷取畫面顯示檢查 [圖片] 中檔案可用性的範例結果。 在範例中尋找：這個範例包含一個標題為 "OneDriveFilesPage" 的頁面，其中含有可列舉本機電腦 [圖片] 中所有檔案的按鈕。除了顯示每個檔案名稱外，也會顯示該檔案的提供者 (如這部電腦或 OneDrive) 和檔案目前的可用性。本範例中的 JavaScript 程式碼和 HTML 分別位於 OneDriveFilesPage.js 和 OneDriveFilesPage.html 檔案中。

 

完成

	使用 Windows 應用程式認證套件 建議使用。執行 Windows 應用程式認證套件可協助您確保應用程式符合 Windows 市集需求。建議您在每次為應用程式新增主要功能時執行這個套件。
	大功告成！既然您已經探索了應用程式適用的各種不同檔案處理功能，現在即可建立一個像是檔案處理，從開始到完成隨附範例的應用程式。

 

想要更深入了解嗎？

快速入門：JavaScript 的非同步程式設計

深入了解 JavaScript 的非同步程式設計。

快速入門：以程式設計方式存取檔案

深入了解列舉檔案。

快速入門：讀取和寫入檔案

深入了解如何讀取和寫入檔案。