クイック スタート: リムーバブル記憶装置の一覧表示 (HTML)
このチュートリアルでは、Windows.Storage.KnownFolders を使って、現在接続されているデバイスのスナップショットを StorageFolder オブジェクトとして取得する方法について説明します。
目標: Windows.Storage.KnownFolders を使ってリムーバブル記憶装置を一覧表示する方法について説明します。
必要条件
JavaScript と HTML について理解している必要があります。
リムーバブル記憶装置が必要です。
完了までの時間: 20 分.
手順
1. Microsoft Visual Studio を開く
Visual Studio のインスタンスを開きます。
2. 新しいプロジェクトを作る
[新しいプロジェクト] ダイアログ ボックスで、JavaScript のプロジェクトの種類から新しいアプリケーションを選びます。
3. リムーバブル ストレージの機能を宣言する
ソリューション エクスプローラーで package.appxmanifest をダブルクリックします。[機能] タブをクリックします。[機能] の一覧で、[リムーバブル ストレージ] をオンにします。
4. アプリケーションの HTML と JavaScript を挿入する
Default.html を開き、次のコードをこのファイルにコピーして、元の内容を置き換えます。
<!DOCTYPE html>
<html>
<head>
<title>Removable Storage Devices</title>
<link rel="stylesheet" href="/winjs/css/ui-dark.css" />
<script type = "text/javascript" >
// Use the Removable Devices KnownFolder to get a snapshot of the currently
// connected devices as StorageFolders.
function listStorages() {
document.getElementById("output").innerHTML = "";
Windows.Storage.KnownFolders.removableDevices.getFoldersAsync().
then(
function (removableStorages) {
// Display each storage device.
var numRemovableStorages = removableStorages.length;
if (numRemovableStorages > 0) {
removableStorages.forEach(function (removableStorage, i) {
document.getElementById("output").innerHTML +=
removableStorage.name + "<br/>";
});
} else {
document.getElementById("output").innerHTML =
"No storages found. Attach a removable storage " +
"such as a camera or USB drive.)";
}
},
function (e) {
document.getElementById("output").innerHTML =
"Failed to find all storage devices. Error: " +
e.message;
});
}
</script>
</head>
<body>
<p>
Click "List Storages" to get a list removable storage devices.<br /></p>
<input type="button" onclick="listStorages()" value="List Storages" /><br />
<div id=output></div>
</body>
</html>
5. アプリケーションをテストする
- リムーバブル記憶装置を接続します (まだ接続していない場合)。
- [デバッグ]、[デバッグ開始] の順にクリックし、ソリューションをテストします。
- [List Storages] (記憶装置の一覧表示) ボタンをクリックすると、リムーバブル ストレージが一覧表示されます。
注 エラーが発生した場合は、次の点を確認してください。
- リムーバブル ストレージへのアクセスが有効になっていることを確認します。ソリューション エクスプローラーで package.appxmanifest を開き、[機能] タブの [リムーバブル ストレージ] を確認してください。
要約
次回は、ピクチャにあるファイルを記憶装置にコピーします。