Inicio rápido: crear una lista de los dispositivos de almacenamiento extraíbles (HTML)

[ Este artículo está destinado a desarrolladores de Windows 8.x y Windows Phone 8.x que escriben aplicaciones de Windows en tiempo de ejecución. Si estás desarrollando para Windows 10, consulta la documentación más reciente

Este tutorial te muestra cómo usar Windows.Storage.KnownFolders para obtener una instantánea de los dispositivos conectados actualmente como objetos de StorageFolder.

Objetivo: Te enseñaremos a crear una lista de los dispositivos de almacenamiento extraíbles mediante Windows.Storage.KnownFolders.

Requisitos previos

Debes tener conocimientos de JavaScript y HTML.

Debes tener disponible un dispositivo de almacenamiento extraíble.

Tiempo para finalizar: 20 minutos.

Instrucciones

1. Abrir Microsoft Visual Studio

Abre una sesión de Visual Studio.

2. Crear un nuevo proyecto

En el cuadro de diálogo Nuevo proyecto, elige una aplicación vacía en los tipos de proyecto JavaScript.

3. Declarar la funcionalidad de almacenamiento extraíble

Haz doble clic en package.appxmanifest en el Explorador de soluciones. Selecciona la pestaña Funcionalidad. Activa la opción Almacenamiento extraíble en la lista Funcionalidad.

4. Insertar el código JavaScript y HTML de la aplicación

Abre el archivo Default.html y copia el siguiente código en él, sustituyendo su contenido original.


<!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. Probar la aplicación

  1. Conecta el dispositivo de almacenamiento extraíble, si aún no está conectado.
  2. En el menú Depurar, haz clic en Iniciar depuración para probar la solución.
  3. Haz clic en el botón List Storages (Mostrar almacenamientos) para ver una lista de los dispositivos de almacenamiento extraíbles.

Nota  Si obtienes un error, realiza las siguientes comprobaciones:

  • Asegúrate de que has habilitado el acceso al almacenamiento extraíble. Para ello, abre package.appxmanifest en el Explorador de soluciones y activa Almacenamiento extraíble en la pestaña Funcionalidades.

 

Resumen

A continuación copiarás un archivo de Imágenes en un dispositivo de almacenamiento.

Temas relacionados

Acceso a la tarjeta SD en las aplicaciones de Windows Phone