クイック スタート: よく使われるデバイスの列挙 (HTML)
Windows.Devices.Enumeration 名前空間には、デバイスを列挙するための 2 つのメソッド FindAllAsync と CreateWatcher があります。 FindAllAsync は、利用可能なデバイスについての検索を 1 回実行します。ユーザーがデバイスを追加、削除、または変更した場合に更新する必要のないアプリに適しています。 CreateWatcher はデバイスを列挙するだけでなく、オペレーティング システムによって最初の列挙が完了した後でユーザーがデバイスを追加、削除、または変更すると、通知イベントを生成します。ここでは、FindAllAsync を使って、よく使われるデバイスの列挙を 1 回だけ実行する方法を説明します。
目標: よく使われるデバイスのカテゴリで利用可能なデバイスを一覧にするには、Windows.Devices.Enumeration 名前空間を使います。
必要条件
このトピックは、JavaScript と HTML に習熟していることを前提としています。
完了までの時間: 20 分.
手順
1. Microsoft Visual Studio を開く
Visual Studio のインスタンスを開きます。
2. 新しいプロジェクトを作る
[新しいプロジェクト] ダイアログ ボックスで、JavaScript のプロジェクトの種類から新しいアプリを選びます。
3. アプリの HTML を挿入する
Default.html を開き、次のコードをこのファイルにコピーして、ファイルの内容を置き換えます。
この HTML は、ユーザーが 7 種類のデバイスから列挙の対象を選ぶユーザー インターフェイスを提供します。デバイスの種類は、マイク、オーディオ再生、Web カメラ、リムーバブル ストレージ、MTP デバイス サービス、SMS デバイス、近接デバイスです。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="/js/default.js"></script>
</head>
<body data-design-activate="defaultPage.activated">
<h1>Device Enumeration Sample</h1>
<h2 >Input</h2>
<div>
<div id="Input">
<p>This scenario demonstrates using the device enumeration API
to look for specific device interfaces. A device interface
is the programmatic entry point for a device.</p>
<p>Select a device interface class</p>
<select id="SelectInterfaceClass" size="7" >
<option value="audioCapture">Audio Capture</option>
<option value="audioRender">Audio Playback</option>
<option value="videoCapture">Webcams</option>
<option value="portableStorageDevice">Portable Storage</option>
<option value="mtpService">MTP Device Service</option>
<option value="sms">SMS Device</option>
<option value="proximity">Proxmity Device</option>
</select>
<br />
<p>Clicking the enumerate button will start a search for
device interfaces that belong to the specified device interface class.
The device interfaces will be listed below.</p>
<input onclick="onEnumerateDeviceInterfaces()" type="button" value="Enumerate" />
<br /><br />
</div>
</div>
<h2> Output</h2>
<div id="statusMessage"></div>
<!-- Device Enumeration results are displayed in this element -->
<div id="Output"></div>
</body>
</html>
4. アプリの JavaScript を挿入する
Default.js ファイルを開き、次のコードをファイルに挿入します。
ユーザーが選んだデバイスの種類に基づいて、onEnumerateDeviceInterface 関数が DeviceClass 値を選ぶか、getDeviceSelector 関数からセレクター文字列を取得します。次に、アプリがこの値を FindAllAsync に渡します。列挙が成功した場合は successCallback 関数がデバイス情報を出力し、列挙が失敗した場合は errorCallback 関数がエラー メッセージを出力します。
function onEnumerateDeviceInterfaces() {
document.getElementById("Output").innerHTML = ""; // clear output
try {
var selection = document.getElementById("SelectInterfaceClass");
var selectedDeviceClass =
selection.options[selection.selectedIndex].value;
var deviceClass;
var Enumeration = Windows.Devices.Enumeration;
var selectorString = "";
var mtpServiceDevice = Windows.Devices.Portable.ServiceDevice;
var smsDevice = Windows.Devices.Sms.SmsDevice;
var proximityDevice = Windows.Networking.Proximity.ProximityDevice;
switch (selectedDeviceClass) {
case "audioCapture":
// same as:
// var mediaDevice = Windows.Media.Devices.MediaDevice;
// selectorString = mediaDevice.getAudioCaptureSelector();
deviceClass = Enumeration.DeviceClass.audioCapture;
break;
case "audioRender":
// same as:
// var mediaDevice = Windows.Media.Devices.MediaDevice;
// selectorString = mediaDevice.getAudioRenderSelector();
deviceClass = Enumeration.DeviceClass.audioRender;
break;
case "portableStorageDevice":
// same as:
// var storageDevice = Windows.Devices.Portable.StorageDevice;
// selectorString = storageDevice.getDeviceSelector();
deviceClass = Enumeration.DeviceClass.portableStorageDevice;
break;
case "videoCapture":
// same as:
// var mediaDevice = Windows.Media.Devices.MediaDevice;
// selectorString = mediaDevice.getVideoCaptureSelector();
deviceClass = Enumeration.DeviceClass.videoCapture;
break;
case "mtpService":
// Windows.Devices.Portable.ServiceDevice.getDeviceSelector
selectorString = mtpServiceDevice.getDeviceSelector(Windows.Devices.Portable.ServiceDeviceType.calendarService);
break;
case "sms":
// Windows.Devices.Sms.SmsDevice.getDeviceSelector
selectorString = smsDevice.getDeviceSelector();
break;
case "proximity":
// Windows.Networking.Proximity.ProximityDevice.getDeviceSelector
selectorString = proximityDevice.getDeviceSelector();
break;
case "imageScanner":
// same as:
// var scannerDevice = Windows.Devices.Scanners.ImageScanner;
// selectorString = scannerDevice.getDeviceSelector();
deviceClass = Enumeration.DeviceClass.imageScanner;
break;
default: deviceClass = Enumeration.DeviceClass.all;
}
var DeviceInformation = Enumeration.DeviceInformation;
if (selectorString == "") {
DeviceInformation.findAllAsync(deviceClass).then(
successCallback,
errorCallback
);
} else {
DeviceInformation.findAllAsync(selectorString, null).then(
successCallback,
errorCallback
);
}
} catch (e) {
document.getElementById("statusMessage").innerHTML =
"Failed to enumerate devices, error: " + e.message;
}
}
// Handles successful completion of the findAllAsync method.
function successCallback(deviceInformationCollection) {
var numDevices = deviceInformationCollection.length;
document.getElementById("statusMessage").innerHTML =
numDevices + " device interface(s) found";
if (numDevices) {
for (var i = 0; i < numDevices; i++) {
printFriendlyNameAndID(deviceInformationCollection[i],
document.getElementById("Output"));
}
} else {
document.getElementById("statusMessage").innerHTML = "No devices found";
}
}
// Handles an error completion of the findAllAsync method.
function errorCallback(e) {
document.getElementById("statusMessage").innerHTML =
"Failed to find devices, error: " + e.message;
}
// Prints the friendly name of the device interface and its ID
// The ID is the device interface path.
function printFriendlyNameAndID(deviceInterface, log) {
// The name property is equivalent to System.ItemNameDisplay property
log.innerHTML += "<h3>" +
deviceInterface.name + "<h3/>";
log.innerHTML += "<p>Interface ID: " + deviceInterface.id;
log.innerHTML += "<p>Enabled: " + deviceInterface.isEnabled;
log.innerHTML += "<br />";
}
注
最初の 4 つの選択肢については、DeviceClass 列挙値を FindAllAsync に渡すことができます。これは、デバイスの種類に関連付けられた Windows ランタイム API からのセレクター文字列を取得し、そのセレクターを FindAllAsync に渡すのと同じことです。DeviceClass 列挙の代わりにセレクター文字列を使うためのコードは、switch ステートメントの関連するケース内でコメント アウトされています。
残りの 3 つの選択肢については、DeviceClass 列挙値はなく、適切なセレクター文字列を取得するための API 呼び出しのみが表示されます。
5. アプリをビルドする
[ビルド]、[ソリューションのビルド] の順にクリックして、プロジェクトをビルドします。
6. アプリをテストする
- [デバッグ]、[デバッグ開始] の順にクリックし、ソリューションをテストします。
- 列挙するデバイス インターフェイス クラスを選びます。
- [列挙] をクリックして、指定されたデバイス インターフェイス クラスに属するデバイス インターフェイスの検索を開始します。アプリは、作られたページの下半分にデバイス インターフェイスを一覧表示します。
7. 独自のデバイス機能を追加する (省略可能)
デバイスの一覧を表示するだけでなくデバイスの機能へのアクセスを開始するには、列挙したデバイスの DeviceInformation.id プロパティを、デバイスを使うための Windows ランタイム API に渡します。たとえば、ビデオ キャプチャに使う Web カメラを指定するために、列挙された Web カメラの ID で Windows.Media.Capture.MediaCaptureInitializationSettings.VideoDeviceId プロパティを設定することができます。
必要な機能をプロジェクトの package.appxmanifest ファイルに追加します。
まず、デバイス ID を API に渡して、デバイスを操作できるようにします。デバイス ID を取得して、デバイスを使うためのオブジェクトを初期化するメソッドがいくつかあります。
- Windows.Media.Capture.MediaCaptureInitializationSettings.AudioDeviceId
- Windows.Media.Capture.MediaCaptureInitializationSettings.VideoDeviceId
- Windows.Devices.Portable.StorageDevice.FromId
- Windows.Devices.Sms.SmsDevice.FromIdAsync
- Windows.Networking.Proximity.ProximityDevice.FromId
MTP デバイス サービスを使う WPD デバイス (Windows.Devices.Portable.ServiceDevice.GetDeviceSelector または Windows.Devices.Portable.ServiceDevice.GetDeviceSelectorFromServiceId を使って列挙されたもの) の場合、次のようにデバイスを操作する COM オートメーション オブジェクトを作成できます。
deviceFactory = new ActiveXObject("PortableDeviceAutomation.Factory");var device = deviceFactory.getDeviceFromId(deviceId);
要約と次のステップ
ここでは、Windows.Device.Enumeration.DeviceClass 列挙値、または getDeviceSelector メソッドからのセレクター文字列を findAllAsync に渡して、一般的な種類のデバイスを列挙する方法を説明しました。
目的のデバイス インターフェイス クラスが Windows.Device.Enumeration.DeviceClass 列挙体に含まれていない場合は、ユーザーに代わってセレクターを取得する Windows ランタイム API がないため、高度なクエリ構文 (AQS) 文字列を自分で作り findAllAsync に渡す必要があります。
指定された種類の利用可能なデバイスについてクエリを作るには、デバイス クラス GUID を知っている必要があります。次のコードに、ユーザーが入力ボックスに入力した GUID で指定されるデバイス インターフェイス クラスに属する、利用可能なデバイスについてのクエリが含まれています。この GUID は、"{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}" の形式で指定します。
注 セレクター文字列では、GUID を引用符で囲みます。たとえば、var selectorString = "System.Devices.InterfaceClassGuid:=\"{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}\""; と記述します。
if (textinput.value != ""){
var textDeviceInterfaceClassGUID = textinput.value;
var selectorString = "System.Devices.InterfaceClassGuid:=\"" +
textDeviceInterfaceClassGUID +
"\" AND System.Devices.InterfaceEnabled:=true";
var Enum = Windows.Devices.Enumeration;
Enum.DeviceInformation.findAllAsync(selectorString, null).then(
successCallback,
errorCallback
);
// Handles successful completion of the findAllAsync method.
function successCallback(deviceInformationCollection) {
// Add your code here for processing the enumerated device collection.
}
// Handles an error completion of the findAllAsync method.
function errorCallback(e) {
// Add your error-handling code here.
}
注 このサンプルでは列挙を 1 回だけ実行しましたが、ユーザーがデバイスを追加、削除、または変更したときにユーザー インターフェイスを更新する必要があるアプリには不十分です。次のトピックでは、CreateWatcher を使って、デバイスを列挙してデバイス通知を取得する方法を説明します。
関連トピック
列挙用にセレクター文字列を提供する Windows ランタイム API
Windows.Media.Devices.MediaDevice.getAudioCaptureSelector
Windows.Media.Devices.MediaDevice.getAudioRenderSelector
Windows.Media.Devices.MediaDevice.getVideoCaptureSelector
Windows.Media.Devices.MediaDevice.getDefaultAudioRenderId
Windows.Media.Devices.MediaDevice.getDefaultAudioCaptureId
Windows.Devices.Portable.StorageDevice.GetDeviceSelector
Windows.Devices.Portable.ServiceDevice.GetDeviceSelector
Windows.Devices.Portable.ServiceDevice.GetDeviceSelectorFromServiceId
Windows.Devices.Sms.SmsDevice.GetDeviceSelector
Windows.Networking.Proximity.ProximityDevice.GetDeviceSelector
セレクター文字列を構築するための高度なクエリ構文 (AQS)