Configurar o SDK JavaScript Consumer

Com o SDK do Consumidor para JavaScript, seu aplicativo para o consumidor pode mostrar a localização de veículos e outros locais de interesse rastreados no Fleet Engine em um mapa baseado na Web. Isso permite que os usuários consumidores vejam o progresso das remessas. Neste guia, pressupomos que você tenha configurado o Fleet Engine com o projeto na nuvem do Google Cloud e as chaves de API associados. Consulte Fleet Engine para mais detalhes.

Para configurar o SDK do Consumidor para JavaScript, siga estas etapas:

  1. Ative a API Maps JavaScript.
  2. Configure a autorização.

Ativar a API Maps JavaScript

Ative a API Maps JavaScript no projeto do console do Google Cloud que você usa para sua instância do Fleet Engine. Para mais detalhes, consulte Ativar APIs na documentação da API Maps JavaScript.

Configurar a autorização

O Fleet Engine exige o uso de JSON Web Tokens (JWTs) para chamadas de método de API em ambientes de baixa confiança: smartphones e navegadores.

Um JWT é originado no seu servidor, assinado, criptografado e transmitido ao cliente para interações subsequentes com o servidor até que ele expire ou não seja mais válido.

Detalhes importantes

Seu aplicativo para o consumidor precisa autenticar os usuários finais com o papel delivery_consumer do seu projeto do Google Cloud para retornar apenas informações específicas do consumidor. Dessa forma, o Fleet Engine filtra e oculta todas as outras informações nas respostas. Por exemplo, durante uma tarefa de indisponibilidade, nenhuma informação de localização é compartilhada com um usuário final. Consulte Papéis de conta de serviço para tarefas programadas.

Como funciona a autorização?

A autorização com dados do Fleet Engine envolve a implementação do lado do servidor e do lado do cliente.

Autorização do lado do servidor

Antes de configurar a autenticação e a autorização no aplicativo baseado na Web, o servidor de back-end precisa emitir JSON Web Tokens para o aplicativo baseado na Web para acessar o Fleet Engine. O aplicativo baseado na Web envia esses JWTs com as solicitações para que o Fleet Engine as reconheça como autenticadas e autorizadas a acessar os dados na solicitação. Para instruções sobre a implementação de JWT no servidor, consulte Emitir JSON Web Tokens em Noções básicas do Fleet Engine.

Especificamente, lembre-se do seguinte sobre o SDK do Consumidor para JavaScript para rastrear remessas:

Autorização do lado do cliente

Quando você usa o SDK do Consumidor para JavaScript, ele solicita um token do servidor usando um buscador de tokens de autorização. Isso acontece quando qualquer uma das seguintes condições é verdadeira:

  • Não há um token válido, como quando o SDK não chamou o buscador em um carregamento de página recente ou quando o buscador não retornou com um token.

  • O token expirou.

  • O token vai expirar em um minuto.

Caso contrário, o SDK do Consumidor para JavaScript vai usar o token válido emitido anteriormente e não vai chamar o buscador.

Criar um buscador de tokens de autorização

Crie o buscador de tokens de autorização usando estas diretrizes:

  • O buscador precisa retornar uma estrutura de dados com dois campos, encapsulados em um Promise da seguinte maneira:

    • Uma string token.

    • Um número expiresInSeconds. Um token expira nesse período após a busca. O buscador de tokens de autenticação precisa transmitir o tempo de validade em segundos, do momento da busca até a biblioteca, conforme mostrado no exemplo.

  • O buscador precisa chamar um URL no seu servidor para recuperar um token. Esse URL, o SERVER_TOKEN_URL, depende da implementação do back-end. O URL de exemplo a seguir é para o back-end do app de exemplo no GitHub:

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

Exemplo: criar um buscador de token de autenticação

Os exemplos a seguir mostram como criar um buscador de token de autorização:

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,
  };
}

A seguir