JavaScript Tüketici SDK'sını ayarlama

JavaScript Consumer SDK ile tüketici uygulamanız, Fleet Engine'de izlenen araçların konumunu ve diğer ilgi çekici yerleri web tabanlı bir haritada gösterebilir. Bu sayede tüketicileriniz sürücünün yolculuğundaki ilerleme durumunu görebilir. Bu kılavuzda, Fleet Engine'i ilişkili Google Cloud projesi ve API anahtarlarıyla birlikte kurduğunuz varsayılır. Ayrıntılar için Fleet Engine'e bakın.

Aşağıdaki adımları uygulayarak JavaScript Consumer SDK'sını ayarlarsınız:

1. Maps JavaScript API'yi etkinleştirme
2. Yetkilendirme kurulumu

Maps JavaScript API'yi etkinleştirme

Google Cloud Console'da Maps JavaScript API'yi etkinleştirin. Daha fazla bilgi için Google Cloud belgelerindeki API'leri etkinleştirme başlıklı makaleyi inceleyin. Bu, JavaScript için Tüketici SDK'sını etkinleştirir.

Yetkilendirme kurulumu

Fleet Engine, düşük güvenli ortamlardan (akıllı telefonlar ve tarayıcılar) gelen API yöntemi çağrıları için JSON Web Jetonlarının (JWT'ler) kullanılmasını gerektirir.

JWT, sunucunuzda oluşturulur, imzalanır, şifrelenir ve süresi dolana veya geçerliliğini yitirene kadar sonraki sunucu etkileşimleri için istemciye iletilir.

Önemli ayrıntılar

• Fleet Engine'e karşı kimlik doğrulamak ve yetkilendirmek için Uygulama Varsayılan Kimlik Bilgileri'ni kullanın.
• JWT'leri imzalamak için uygun bir hizmet hesabı kullanın. Fleet Engine Temel Bilgileri bölümündeki Fleet Engine hizmet hesabı rollerine bakın.

Yetkilendirme nasıl çalışır?

Fleet Engine verileriyle yetkilendirme hem sunucu tarafı hem de istemci tarafı uygulamayı içerir.

Sunucu tarafı yetkilendirme

Web tabanlı uygulamanızda kimlik doğrulama ve yetkilendirme ayarlamadan önce arka uç sunucunuz, Fleet Engine'e erişim için web tabanlı uygulamanıza JSON web jetonları verebilmelidir. Web tabanlı uygulamanız, bu JWT'leri istekleriyle birlikte gönderir. Böylece Fleet Engine, istekleri kimliği doğrulanmış ve istekteki verilere erişmek için yetkilendirilmiş olarak tanır. Sunucu tarafında JWT uygulamasıyla ilgili talimatlar için Fleet Engine'in Temel Özellikleri bölümündeki JSON Web Jetonları Verme başlıklı makaleyi inceleyin.

• JSON Web Jetonları yayınlamayla ilgili genel yönergeler
• Talep üzerine yolculuklar için JWT yönergeleri
• Tüketici işlemi için örnek jeton

İstemci tarafı yetkilendirme

JavaScript Consumer SDK'yı kullandığınızda, yetkilendirme jetonu alıcı kullanarak sunucudan jeton istenir. Aşağıdakilerden herhangi biri doğru olduğunda bu işlemi yapar:

• Geçerli bir jeton yoktur. Örneğin, SDK yeni bir sayfa yüklemesinde getiriciyi çağırmadığında veya getirici bir jetonla geri dönmediğinde bu durum oluşur.

• Jetonun süresi doldu.

• Jetonun kullanım süresinin dolmasına bir dakika kaldı.

Aksi takdirde, JavaScript Consumer SDK daha önce verilmiş geçerli jetonu kullanır ve getiriciyi çağırmaz.

Yetkilendirme jetonu alıcı oluşturma

Aşağıdaki yönergeleri kullanarak yetkilendirme jetonu alıcınızı oluşturun:

• Getirici, iki alan içeren bir veri yapısı döndürmelidir. Bu yapı, aşağıdaki gibi bir Promise içine yerleştirilir:

  • Bir dize token.

  • Bir sayı expiresInSeconds. Jeton, getirilmesinden sonra bu süre içinde sona erer. Kimlik doğrulama jetonu alıcı, son kullanma zamanını saniye cinsinden, alma zamanından kitaplığa kadar olan süre olarak iletmelidir. Bu süre, örnekte gösterildiği gibi olmalıdır.

• Getirici, jeton almak için sunucunuzdaki bir URL'yi çağırmalıdır. Bu URL (SERVER_TOKEN_URL), arka uç uygulamanıza bağlıdır. Aşağıdaki örnek URL, GitHub'daki örnek uygulama arka ucu içindir:

  • https://SERVER_URL/token/consumer/TRIPID

Örnek: Kimlik doğrulama jetonu getirici oluşturma

Aşağıdaki örneklerde, yetkilendirme jetonu alıcısının nasıl oluşturulacağı gösterilmektedir:

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

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

Sırada ne var?

JavaScript'te bir geziyi takip etme