JavaScript フリート トラッキング ライブラリを設定する

JavaScript フリート トラッキング ライブラリを使用する前に、Fleet Engine に精通していることと、Fleet Engine が設定されていることを確認してください。詳細については、Fleet Engine をご覧ください。

このドキュメントでは、ウェブページ アプリと Fleet Engine 間の認可を有効にする方法について説明します。Fleet Engine へのリクエストが適切な認可トークンで設定されたら、地図上で車両を追跡できるようになります。

認可を設定する

Fleet Engine では、信頼性の低い環境（スマートフォンやブラウザ）からの API メソッド呼び出しに JSON Web Token（JWT）を使用する必要があります。

JWT はサーバー上で生成され、署名、暗号化され、期限切れになるか無効になるまで、その後のサーバー インタラクションのためにクライアントに渡されます。

主な詳細

認可の仕組み

Fleet Engine データによる認証には、サーバーサイドとクライアントサイドの両方の実装が含まれます。

サーバーサイド認可

フリート トラッキング アプリケーションで認証と承認を設定する前に、バックエンド サーバーがフリート エンジンにアクセスするために、フリート トラッキング アプリケーションに JSON Web Token を発行できる必要があります。フリート トラッキング アプリケーションは、これらの JWT をリクエストとともに送信します。これにより、Fleet Engine はリクエストが認証済みで、リクエスト内のデータにアクセスする権限があることを認識します。サーバーサイドの JWT の実装手順については、Fleet Engine の基本のJSON Web Token を発行するをご覧ください。

フリート トラッキングを実装する際にサーバーからトークンを生成するには、以下をご覧ください。

クライアントサイドの認可

JavaScript フリート トラッキング ライブラリを使用すると、認可トークン取得ツールを使用してサーバーからトークンがリクエストされます。これは、次のいずれかに該当する場合に実行されます。

  • 有効なトークンが存在しない（SDK が新しいページの読み込みで取得ツールを呼び出していない場合や、取得ツールがトークンを返さなかった場合など）。

  • トークンの有効期限が切れています。

  • トークンの有効期限が 1 分以内である。

それ以外の場合、JavaScript フリート トラッキング ライブラリは、以前に発行された有効なトークンを使用し、フェッチャーを呼び出しません。

認証トークン取得ツールを作成する

以下のガイドラインに沿って、認可トークン取得ツールを作成します。

  • フェッチャーは、2 つのフィールドを含むデータ構造を返す必要があります。次のように Promise でラップします。

    • 文字列 token。

    • 数値 expiresInSeconds。トークンは取得後、この時間内に期限切れになります。認証トークン取得ツールは、例に示すように、取得からライブラリへの期限切れ時間を秒単位で渡す必要があります。

  • フェッチャーは、サーバーの URL を呼び出してトークンを取得する必要があります。この URL（SERVER_TOKEN_URL）は、バックエンドの実装によって異なります。次の URL の例は、GitHub のサンプルアプリ バックエンドのものです。

    • https://SERVER_URL/token/fleet_reader

例 - 認可トークン取得ツールを作成する

次の例は、認可トークン取得ツールを作成する方法を示しています。

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

次のステップ