設定 JavaScript 機群追蹤程式庫

使用 JavaScript 車隊追蹤程式庫前，請先熟悉並設定 Fleet Engine。詳情請參閱 Fleet Engine。

本文說明如何在網頁應用程式和 Fleet Engine 之間啟用授權。設定 Fleet Engine 要求時，請使用正確的授權權杖，這樣您就能在地圖上追蹤車輛。

設定授權

Fleet Engine 要求使用 JSON Web Token (JWT) 來呼叫來自信任程度較低的環境 (智慧型手機和瀏覽器) 的 API 方法。

JWT 會在您的伺服器上產生，並經過簽署和加密，然後傳遞至用戶端，以便在後續的伺服器互動中使用，直到過期或不再有效為止。

重要詳細資料

授權的運作方式為何？

使用 Fleet Engine 資料進行授權時，必須同時在伺服器端和用戶端實作。

伺服器端授權

在設定車隊追蹤應用程式的驗證和授權之前，後端伺服器必須能夠向車隊追蹤應用程式發出 JSON Web Token，以便存取車隊引擎。您的 Fleet 追蹤應用程式會隨要求傳送這些 JWT，讓 Fleet Engine 將要求視為經過驗證且有權存取要求中資料的應用程式。如需伺服器端 JWT 實作說明，請參閱「Fleet Engine 重點」一節中的「發出 JSON Web Token」。

如要在實作車隊追蹤時從伺服器產生權杖，請參閱以下說明：

用戶端授權

使用 JavaScript Fleet 追蹤程式庫時，系統會使用授權權杖擷取器向伺服器要求權杖。在下列任一情況下，系統就會執行這項操作：

  • 沒有有效的權杖，例如 SDK 在載入新網頁時未呼叫擷取器，或是擷取器未傳回權杖。

  • 權杖已過期。

  • 權杖即將在 1 分鐘內到期。

否則，JavaScript Fleet 追蹤程式庫會使用先前核發的有效權杖，且不會呼叫擷取器。

建立授權權杖擷取工具

請按照下列規範建立授權權杖擷取器：

  • 擷取器必須傳回具有兩個欄位的資料結構，並以 Promise 包裝，如下所示：

    • 字串 token。

    • 數字 expiresInSeconds。憑證會在擷取後的這段時間內到期。驗證權杖擷取器必須從擷取到程式庫的時間開始，以秒為單位傳遞到期時間，如範例所示。

  • 擷取器應呼叫伺服器上的網址，以便擷取權杖。這個網址 (SERVER_TOKEN_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,
  };
}

後續步驟