借助 JavaScript Consumer SDK,您的消费者应用可以在基于 Web 的地图上显示在 Fleet Engine 中跟踪的车辆位置和其他感兴趣的位置。这样,您的消费者就可以查看驾驶员行程的进度。 本指南假定您已设置 Fleet Engine 及其关联的 Google Cloud 项目和 API 密钥。如需了解详情,请参阅 Fleet Engine。
您可以按照以下步骤设置 JavaScript Consumer SDK:
启用 Maps JavaScript API
在 Google Cloud 控制台中启用 Maps JavaScript API。如需了解详情,请参阅 Google Cloud 文档中的 启用 API。这样便可启用适用于 JavaScript 的 Consumer SDK。
设置授权
Fleet Engine 要求使用 JSON Web 令牌 (JWT) 从 低信任环境 (智能手机和浏览器)调用 API 方法。
JWT 源自您的服务器,经过签名、加密并传递给客户端,以供后续服务器互动,直到 JWT 过期或失效为止。
关键详细信息
- 使用 应用默认凭据 针对 Fleet Engine 进行身份验证和 授权。
- 使用适当的服务账号对 JWT 进行签名。请参阅 Fleet Engine 服务账号角色(位于Fleet Engine 基础知识中)。
授权的工作原理是什么?
使用 Fleet Engine 数据进行授权涉及服务器端和客户端实现。
服务器端授权
在基于 Web 的应用中设置身份验证和授权之前,后端服务器必须能够向基于 Web 的应用发布 JSON Web 令牌,以便访问 Fleet Engine。基于 Web 的应用会随请求发送这些 JWT,以便 Fleet Engine 将请求识别为经过身份验证并已获授权访问请求中的数据。如需了解服务器端 JWT 实现方面的说明,请参阅 发布 JSON Web 令牌 下的 Fleet Engine 基础知识。
具体而言,请注意以下适用于 JavaScript Consumer SDK 的信息,以便共享行程进度:客户端授权
当您使用 JavaScript Consumer SDK 时,它会使用授权令牌提取器从服务器请求令牌。在满足以下任一条件时,它会执行此操作:
不存在有效令牌,例如,当 SDK 在新页面加载时未调用提取器,或者提取器未返回令牌时。
令牌已过期。
令牌将在 1 分钟内过期。
否则,JavaScript Consumer SDK 会使用之前发布的有效令牌,并且不会调用提取器。
创建授权令牌提取器
请按照以下准则创建授权令牌提取器:
提取器必须返回包含两个字段的数据结构,并封装在
Promise中,如下所示:字符串
token。数字
expiresInSeconds。令牌会在提取后经过此时间量后过期。身份验证令牌提取器必须将过期时间(以秒为单位,从提取时间开始)传递给库,如示例所示。
提取器应调用服务器上的网址 以检索令牌。此 网址(即
SERVER_TOKEN_URL)取决于您的后端实现。以下示例网址适用于 GitHub 上的示例应用后端:https://SERVER_URL/token/consumer/TRIPID
示例 - 创建身份验证令牌提取器
以下示例展示了如何创建授权令牌提取器:
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,
};
}