Solicitud de permisos de dispositivo para la aplicación de Teams

Puede enriquecer la aplicación de Teams con funcionalidades nativas del dispositivo, como la cámara, el micrófono y la ubicación. Este documento le guiará sobre cómo solicitar el consentimiento del usuario y acceder a los permisos nativos del dispositivo.

Nota:

Permisos de dispositivos nativos

Deberá solicitar los permisos del dispositivo para acceder a las funcionalidades nativas del mismo. Los permisos de dispositivo funcionan de forma similar para todas las construcciones de aplicaciones, como pestañas, diálogos (denominados módulos de tareas en TeamsJS v1.x) o extensiones de mensaje. El usuario deberá ir a la página de permisos de la configuración de Teams para administrar los permisos del dispositivo. Al acceder a las funcionalidades del dispositivo, podrá crear mejores experiencias en la plataforma de Teams, como:

  • Captura y visualización de imágenes
  • Escanear QR o código de barras
  • Grabación y uso compartido de vídeos cortos
  • Grabar notas de audio y guardarlas para su uso posterior
  • Usar la información de ubicación del usuario para mostrar la información pertinente

Nota:

  • Los permisos de dispositivo son diferentes en el explorador. Para obtener más información, vea Permisos de dispositivo en el navegador.
  • Teams admite la funcionalidad de escáner de códigos de barras QR, que solo está disponible para clientes móviles.

Acceso a los permisos del dispositivo

La biblioteca cliente javascript de Microsoft Teams proporciona las herramientas necesarias para que la aplicación de Teams acceda a los permisos de dispositivo del usuario y cree una experiencia más enriquecida.

Aunque el acceso a estas características es estándar en los exploradores web modernos, deberá informar a Teams sobre las características que use actualizando el manifiesto de la aplicación. Esta actualización le permite solicitar permisos mientras la aplicación se ejecuta en el escritorio de Teams.

Administrar permisos

Un usuario podrá administrar la configuración de los permisos del dispositivo en Teams seleccionando Permitir o Denegar permisos a aplicaciones específicas.

  1. Abra Teams.

  2. Vaya a Configuración Permisos>de la aplicación.

  3. Seleccione la aplicación para la que desea personalizar la configuración.

  4. Seleccione la configuración deseada.

    Captura de pantalla que muestra los permisos de la aplicación móvil.

Especificar los permisos

Actualice la aplicación manifest.json agregando devicePermissions y especificando cuál de las cinco propiedades siguientes usa en la aplicación:

"devicePermissions": [
    "media",
    "geolocation",
    "notifications",
    "midi",
    "openExternal"
],

Cada propiedad le permite pedir a los usuarios su consentimiento:

Propiedad Descripción
medios Permiso para usar la cámara, el micrófono, los altavoces y acceder a la galería multimedia.
geolocalización Permiso para devolver la ubicación del usuario.
notificaciones Permiso para enviar las notificaciones del usuario.
midi Permiso para enviar y recibir información de la Interfaz Digital de Instrumento Musical (MIDI) desde un instrumento musical digital.
openExternal Permiso para abrir vínculos en aplicaciones externas.

Para obtener más información, vea manifiesto de aplicación.

Comprobación de permisos desde la aplicación

Después de agregar devicePermissions al manifiesto de la aplicación, compruebe los permisos mediante la API de permisos HTML5 sin que se muestre un mensaje:

// Different query options:
navigator.permissions.query({ name: 'camera' });
navigator.permissions.query({ name: 'microphone' });
navigator.permissions.query({ name: 'geolocation' });
navigator.permissions.query({ name: 'notifications' });
navigator.permissions.query({ name: 'midi', sysex: true });

// Example:
navigator.permissions.query({name:'geolocation'}).then(function(result) {
  if (result.state == 'granted') {
    // Access granted
  } else if (result.state == 'prompt') {
    // Access has not been granted
  }
});

Use la API de Teams para obtener permisos de dispositivo

Aproveche la API de Teams o HTML5 adecuada para mostrar un mensaje para obtener el consentimiento para acceder a los permisos del dispositivo.

Importante

  • La compatibilidad con camera, gallery y microphone se habilita a través de la API selectMedia. Use la API captureImage para una única captura de imagen.
  • La compatibilidad con location se habilita a través de la API getLocation. Debe usarlo getLocation API para la ubicación, ya que la API de geolocalización HTML5 no es totalmente compatible en el escritorio de Teams.

Por ejemplo:

  • Para pedir al usuario que acceda a su ubicación, debe llamar a getCurrentPosition():

    navigator.geolocation.getCurrentPosition(function (position) { /*... */ });
    
  • Para pedir al usuario que acceda a su cámara en escritorio o web, debe llamar a getUserMedia():

    navigator.mediaDevices.getUserMedia({ audio: true, video: true });
    
  • Para capturar las imágenes en dispositivos móviles, Teams Mobile solicita permiso al llamar a captureImage():

            function captureImage() {
            microsoftTeams.media.captureImage((error, files) => {
                // If there's any error, an alert shows the error message/code
                if (error) {
                    if (error.message) {
                        alert(" ErrorCode: " + error.errorCode + error.message);
                    } else {
                        alert(" ErrorCode: " + error.errorCode);
                    }
                } else if (files) {
                    image = files[0].content;
                    // Adding this image string in src attr of image tag will display the image on web page.
                    let imageString = "data:" + item.mimeType + ";base64," + image;
                }
            });
        } 
    
  • Las notificaciones solicitan al usuario que llame a requestPermission():

    Notification.requestPermission(function(result) { /* ... */ });
    
  • Para usar la cámara o acceder a la galería de fotos, la aplicación Teams pide permiso al llamar a selectMedia():

     function selectMedia() {
     microsoftTeams.media.selectMedia(mediaInput, (error, attachments) => {
         // If there's any error, an alert shows the error message/code
         if (error) {
             if (error.message) {
                 alert(" ErrorCode: " + error.errorCode + error.message);
             } else {
                 alert(" ErrorCode: " + error.errorCode);
             }
         } else if (attachments) {
             // creating image array which contains image string for all attached images. 
             const imageArray = attachments.map((item, index) => {
                 return ("data:" + item.mimeType + ";base64," + item.preview)
             })
         }
     });
    } 
    
  • Para usar el micrófono, Teams para móviles solicitará permiso al llamar a selectMedia():

     function selectMedia() {
     microsoftTeams.media.selectMedia({ maxMediaCount: 1, mediaType: microsoftTeams.media.MediaType.Audio }, (error: microsoftTeams.SdkError, attachments: microsoftTeams.media.Media[]) => {
         // If there's any error, an alert shows the error message/code
         if (error) {
             if (error.message) {
                 alert(" ErrorCode: " + error.errorCode + error.message);
             } else {
                 alert(" ErrorCode: " + error.errorCode);
             }
         }
    
         if (attachments) {
             // taking the first attachment  
             let audioResult = attachments[0];
    
             // setting audio string which can be used in Video tag
             let audioData = "data:" + audioResult.mimeType + ";base64," + audioResult.preview
         }
     });
     }
    
  • Para pedir al usuario que comparta la ubicación en la interfaz de mapa, la aplicación Teams pide permiso al llamar a getLocation():

     function getLocation() {
        location.getLocation({ allowChooseLocation: true, showMap: true }).then((location) => { 
            let currentLocation = JSON.stringify(location);
     }).catch((error) => { /*Error getting location*/ })} 

Así es como los mensajes de permisos de dispositivo aparecen a los usuarios en dispositivos móviles y de escritorio.

Comportamiento de permisos en sesiones de inicio de sesión

Los permisos de dispositivo se almacenan para cada sesión de inicio de sesión. Esto significa que si inicia sesión en otra instancia de Teams, por ejemplo, en otro equipo, los permisos de dispositivo de las sesiones anteriores no están disponibles. Por lo tanto, debe volver a admitir los permisos de dispositivo para la nueva sesión. También significa que, si cierra la sesión de Teams o cambia de inquilino en Teams, los permisos de dispositivo se eliminan de la sesión de inicio de sesión anterior.

Nota:

Cuando de su consentimiento a los permisos del dispositivo nativo, solo será válido para el inicio de sesión en curso.

Ejemplo de código

Ejemplo de nombre Descripción Node.js Manifiesto
Permisos de dispositivo En el ejemplo se muestra cómo usar los permisos de dispositivo mediante el SDK de TeamsJS y las API de explorador. View View

Paso siguiente

Consulte también