Come ricevere notifiche in caso di aggiunta, rimozione o sostituzione di dispositivi (HTML)

Articolo
12/11/2015

[ Questo articolo è rivolto agli sviluppatori per Windows 8.x e Windows Phone 8.x che realizzano app di Windows Runtime. Gli sviluppatori che usano Windows 10 possono vedere Documentazione aggiornata ]

In questa esercitazione viene illustrato come enumerare dinamicamente i dispositivi. Successivamente, la tua app potrà ricevere notifiche in caso di aggiunta o rimozione dei dispositivi o se le relative proprietà vengono modificate.

Per avviare un'enumerazione di dispositivi, si usa la classe DeviceWatcher. Per ogni dispositivo individuato, DeviceWatcher genera un evento Add finché non vengono trovati tutti i dispositivi e l'enumerazione è completata. Al termine dell'enumerazione iniziale, DeviceWatcher continua a generare eventi in caso di aggiunta, aggiornamento o rimozione di un dispositivo.

Cosa sapere

Tecnologie

Windows Runtime

Prerequisiti

JavaScript e HTML

Istruzioni

Passaggio 1: Apri Microsoft Visual Studio

Apri un'istanza di Visual Studio.

Passaggio 2: Creare un nuovo progetto

Nella finestra di dialogo Nuovo progetto, dai tipi di progetto disponibili in JavaScript > Windows Store apps, seleziona un'app vuota.

Passaggio 3: Inserire il codice JavaScript e HTML dell'applicazione

Apri il tuo file Default.html e copiaci questo codice HTML sostituendo il contenuto originale.

<!DOCTYPE html>
<html>
<head>
  <title>Device Enumeration Sample</title>
  <meta charset="utf-8" />
  <script src="/js/default.js"></script>
</head>
<body role="application">
    <h1>Device Enumeration Sample</h1>
    <h2 >Input</h2>
    <div >            
            <div >
            <p>This example incrementally enumerates devices, adding them to a list each time a device is found, and also watching for updates.
               Once enumeration is complete, the list of devices is printed.</p> 
                <input type="button" value="Watch(All Devices)" onclick="WatchDevices()"/>
                <br /><br />

                <input type="button" value="Stop" onclick="stopWatcher()"/>
                <br /><br />
            </div>
    </div>

    <h2 > Output</h2>
            <div id="statusMessage"></div>
            <!--  Output -->
            <div  id="output"></div>
</body>
</html>

Passaggio 4:

Incolla questo codice in default.js, sostituendo il contenuto del file.

    var watcher;
    var isEnumerationComplete = false;
    var deviceArray = new Array(); // Saves the enumeration results

    function WatchDevices() {
        try {
            output.innerHTML = ""; // clear output field

            watcher = 
                Windows.Devices.Enumeration.DeviceInformation.createWatcher();
            // Add event handlers
            watcher.addEventListener("added", onAdded);
            watcher.addEventListener("removed", onRemoved);
            watcher.addEventListener("updated", onUpdated);
            watcher.addEventListener("enumerationcompleted", 
                onEnumerationCompleted);
            watcher.addEventListener("stopped", onStopped);
            // Start enumerating and listening for events
            watcher.start();
        } catch (e) {
            document.getElementById("statusMessage").innerHTML = 
                "Failed to create watcher, error: " + e.message;
        }
    }

    function stopWatcher() {
        try {
            watcher.stop();
        }
        catch (e) {
            document.getElementById("statusMessage").innerHTML = 
                "Failed to stop watcher: " + e.message;
        }
    }

    function onAdded(devinfo) {
        document.getElementById("output").innerHTML += "<p>Device added: " + 
            devinfo.name + "</p>";
        deviceArray.push(devinfo);
        if (isEnumerationComplete) {
            output.innerHTML = ""; // clear output field
            printDeviceArray(document.getElementById("output"));
        }
        
    }

    function onUpdated(devUpdate) {
        document.getElementById("output").innerHTML += "<p>Device updated.</p>";
        for (var i = 0; i < deviceArray.length; i++) {
            if (deviceArray[i].id == devUpdate.id) {
                deviceArray[i].update(devUpdate);
            }
        }
        output.innerHTML = ""; // clear output field
        printDeviceArray(document.getElementById("output"));
    }

    function onRemoved(devupdate) {
        document.getElementById("output").innerHTML += "<p>Device removed.</p>";
        for (var i = 0; i < deviceArray.length; i++) {
            if (deviceArray[i].id == devupdate.id) {
                deviceArray[i].slice(devupdate);
            }
        }
        output.innerHTML = ""; // clear output field
        printDeviceArray(document.getElementById("output"));
    }

    function onEnumerationCompleted(obj) {
        isEnumerationComplete = true;
        document.getElementById("output").innerHTML += 
            "<p>Enumeration Completed.</p>";
        printDeviceArray(document.getElementById("output"));
    }

    function onStopped(obj) {
        document.getElementById("output").innerHTML += "<p>Stopped.</p>";
        if (watcher.status == Windows.Devices.Enumeration.DeviceWatcherStatus.aborted) {
           document.getElementById("output").innerHTML += 
            "<p>Enumeration stopped unexpectedly. </p>";
           document.getElementById("output").innerHTML += 
            "<p>Click the Watch button to restart enumeration.</p>";
        } else if (watcher.status == Windows.Devices.Enumeration.DeviceWatcherStatus.stopped) {
           document.getElementById("output").innerHTML += 
            "<p>You requested to stop enumeration. </p>";
           document.getElementById("output").innerHTML += 
            "<p>Click the Watch button to restart enumeration.</p>";
        }

    }


    // Prints the friendly name of the device interface, 
    // its ID (device interface path), and whether it is enabled.
    function printDevice(deviceInterface, outputDestination) {
        outputDestination.innerHTML += "<p>Name: " + 
            deviceInterface.name + "<p/>"; 
        outputDestination.innerHTML += "<p>Interface ID: " + 
            deviceInterface.id + "<p/>";    
        outputDestination.innerHTML += "<p>Enabled: " + 
            deviceInterface.isEnabled + "<p/>";
        outputDestination.innerHTML += "<br />";
    }

    function printDeviceArray(outputDestination) {
        for (var i = 0; i < deviceArray.length; i++) {
            printDevice(deviceArray[i], outputDestination);
        }
    }

Osservazioni

In questo esempio i dispositivi vengono enumerati in modo incrementale. Vengono aggiunti a un elenco ogni volta che viene individuato un dispositivo e viene verificata la presenza di aggiornamenti. Al termine dell'enumerazione, l'app stampa un elenco di dispositivi. Stampa inoltre un messaggio in caso di aggiunta, aggiornamento o rimozione di dispositivi dopo il completamento dell'enumerazione iniziale.

Nota Perché un'app possa ricevere una notifica in caso di aggiunta, rimozione o aggiornamento di dispositivi, è necessario che sottoscriva tutti gli eventi added, removed e updated. Se un'app gestisce solo l'evento added, non riceverà un aggiornamento in caso di aggiunta di un dispositivo al sistema dopo il completamento dell'enumerazione iniziale dei dispositivi.

Condividi tramite