Configura el SDK del consumidor de JavaScript

Con el SDK de JavaScript Consumer, tu app para el consumidor puede mostrar la ubicación de los vehículos y otras ubicaciones de interés que se rastrean en Fleet Engine en un mapa basado en la Web. Esto permite que los usuarios finales vean el progreso de sus envíos. En esta guía, se supone que configuraste Fleet Engine con su proyecto de Google Cloud y sus claves de API asociados. Consulta Fleet Engine para obtener más detalles.

Para configurar el SDK de JavaScript Consumer, sigue estos pasos:

  1. Habilita la API de Maps JavaScript.
  2. Configura la autorización.

Habilita la API de Maps JavaScript

Habilita la API de Maps JavaScript en el proyecto de la consola de Google Cloud que usas para tu instancia de Fleet Engine. Para obtener más detalles, consulta Habilita APIs en la documentación de la API de Maps JavaScript.

Configura la autorización

Fleet Engine requiere el uso de tokens web JSON (JWT) para las llamadas a métodos de la API desde entornos de baja confianza: smartphones y navegadores.

Un JWT se origina en tu servidor, se firma, se encripta y se pasa al cliente para las interacciones posteriores del servidor hasta que vence o ya no es válido.

Detalles clave

Tu app para consumidores debe autenticar a tus usuarios finales con el rol de delivery_consumer de tu proyecto de Google Cloud para devolver solo información específica para los consumidores. De esta manera, Fleet Engine filtra y oculta toda la demás información en las respuestas. Por ejemplo, durante una tarea de no disponibilidad, no se comparte información de ubicación con un usuario final. Consulta Roles de cuentas de servicio para tareas programadas.

¿Cómo funciona la autorización?

La autorización con datos de Fleet Engine implica la implementación tanto del servidor como del cliente.

Autorización del servidor

Antes de configurar la autenticación y la autorización en tu aplicación basada en la Web, tu servidor de backend debe poder emitir tokens web JSON a tu aplicación basada en la Web para acceder a Fleet Engine. Tu aplicación basada en la Web envía estos JWT con sus solicitudes para que Fleet Engine las reconozca como autenticadas y autorizadas para acceder a los datos de la solicitud. Para obtener instrucciones sobre la implementación de JWT del servidor, consulta Cómo emitir tokens web JSON en Aspectos básicos de Fleet Engine.

Específicamente, ten en cuenta lo siguiente para el SDK de JavaScript Consumer para el seguimiento de envíos:

Autorización del cliente

Cuando usas el SDK de JavaScript Consumer, se solicita un token del servidor a través de un captador de tokens de autorización. Esto sucede cuando se cumple alguna de las siguientes condiciones:

  • No existe ningún token válido, por ejemplo, cuando el SDK no llamó al captador en una carga de página nueva o cuando el captador no devolvió un token.

  • El token caducó.

  • El token está a menos de un minuto de vencer.

De lo contrario, el SDK de JavaScript Consumer usa el token válido emitido anteriormente y no llama al captador.

Crea un objeto para recuperar tokens de autorización

Crea tu buscador de tokens de autorización con estos lineamientos:

  • El captador debe devolver una estructura de datos con dos campos, envuelta en un Promise de la siguiente manera:

    • Es una cadena token.

    • Un número expiresInSeconds. Un token vence después de este período tras recuperarse. El recuperador de tokens de autenticación debe pasar la hora de vencimiento en segundos, desde el momento de la recuperación hasta la biblioteca, como se muestra en el ejemplo.

  • El captador debe llamar a una URL en tu servidor para recuperar un token. Esta URL, el SERVER_TOKEN_URL, depende de la implementación del backend. La siguiente URL de ejemplo es para el backend de la app de ejemplo en GitHub:

    • https://SERVER_URL/token/delivery_consumer/TRACKING_ID

Ejemplo: Crea un objeto para recuperar tokens de autenticación

En los siguientes ejemplos, se muestra cómo crear un objeto de recuperación de tokens de autorización:

JavaScript

async function authTokenFetcher(options) {
  // options is a record containing two keys called
  // serviceType and context. The developer should
  // generate the correct SERVER_TOKEN_URL and request
  // based on the values of these fields.
  const response = await fetch(SERVER_TOKEN_URL);
  if (!response.ok) {
    throw new Error(response.statusText);
  }
  const data = await response.json();
  return {
    token: data.Token,
    expiresInSeconds: data.ExpiresInSeconds
  };
}

TypeScript

function authTokenFetcher(options: {
  serviceType: google.maps.journeySharing.FleetEngineServiceType,
  context: google.maps.journeySharing.AuthTokenContext,
}): Promise<google.maps.journeySharing.AuthToken> {
  // The developer should generate the correct
  // SERVER_TOKEN_URL based on options.
  const response = await fetch(SERVER_TOKEN_URL);
  if (!response.ok) {
    throw new Error(response.statusText);
  }
  const data = await response.json();
  return {
    token: data.token,
    expiresInSeconds: data.ExpiresInSeconds,
  };
}

¿Qué sigue?