Tutorial membangun layanan Chat WebSocket untuk Cloud Run

Tutorial ini menunjukkan cara membuat layanan chat real-time multi-ruangan menggunakan WebSockets dengan koneksi persisten untuk komunikasi dua arah. Dengan WebSockets, klien dan server dapat mengirim pesan satu sama lain tanpa melakukan polling di server untuk update.

Meskipun Anda dapat mengonfigurasi Cloud Run untuk menggunakan afinitas sesi, hal ini memberikan afinitas upaya terbaik, yang berarti bahwa setiap permintaan baru masih dapat berpotensi dirutekan ke instance yang berbeda. Akibatnya, pesan pengguna dalam layanan chat perlu disinkronkan di semua instance, bukan hanya antara klien yang terhubung ke satu instance.

Desain untuk layanan chat real-time

Layanan chat contoh ini menggunakan instance Memorystore for Redis untuk menyimpan dan menyinkronkan pesan pengguna di semua instance. Redis menggunakan mekanisme Pub/Sub, yang berbeda dengan produk Cloud Pub/Sub, untuk mengirim data ke klien yang berlangganan yang terhubung ke instance apa pun, guna menghilangkan polling HTTP untuk update.

Namun, meskipun dengan update push, instance apa pun yang dijalankan hanya akan menerima pesan baru yang dikirim ke container. Untuk memuat pesan sebelumnya, histori pesan harus disimpan dan diambil dari solusi penyimpanan persisten. Contoh ini menggunakan fungsi konvensional Redis tentang penyimpanan objek untuk meng-cache dan mengambil histori pesan.

Instance Redis dilindungi dari internet menggunakan IP pribadi dengan akses yang dikontrol dan terbatas untuk layanan yang berjalan pada Virtual Private Network yang sama dengan instance Redis. Sebaiknya gunakan traffic keluar VPC Langsung.

Batasan

• Tutorial ini tidak menunjukkan autentikasi pengguna akhir atau cache sesi. Untuk mempelajari autentikasi pengguna akhir lebih lanjut, lihat tutorial Cloud Run untuk autentikasi pengguna akhir.

• Tutorial ini tidak menerapkan database seperti Firestore untuk penyimpanan tanpa batas dan pengambilan histori pesan chat.

• Elemen tambahan diperlukan agar layanan contoh ini siap produksi. Sebaiknya gunakan instance Redis Tingkat Standar untuk menyediakan Ketersediaan Tinggi menggunakan replikasi dan failover otomatis.

Tujuan

• Menulis, membangun, dan men-deploy layanan Cloud Run yang menggunakan WebSockets.

• Menghubungkan ke instance Memorystore untuk Redis untuk memublikasikan dan berlangganan ke pesan baru di berbagai instance.

• Menghubungkan layanan Cloud Run dengan Memorystore menggunakan Traffic keluar VPC Langsung.

Biaya

Dalam dokumen ini, Anda akan menggunakan komponen Google Cloudyang dapat ditagih berikut:

• Cloud Build
• Artifact Registry
• Memorystore
• Cloud Run

Untuk membuat perkiraan biaya berdasarkan proyeksi penggunaan Anda, gunakan kalkulator harga.

Pengguna Google Cloud baru mungkin memenuhi syarat untuk mendapatkan uji coba gratis.

Sebelum memulai

Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.

In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

Roles required to select or create a project

• Select a project: Selecting a project doesn't require a specific IAM role—you can select any project that you've been granted a role on.
• Create a project: To create a project, you need the Project Creator role (roles/resourcemanager.projectCreator), which contains the resourcemanager.projects.create permission. Learn how to grant roles.

Note: If you don't plan to keep the resources that you create in this procedure, create a project instead of selecting an existing project. After you finish these steps, you can delete the project, removing all resources associated with the project.

Go to project selector

Verify that billing is enabled for your Google Cloud project.

In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

Roles required to select or create a project

• Select a project: Selecting a project doesn't require a specific IAM role—you can select any project that you've been granted a role on.
• Create a project: To create a project, you need the Project Creator role (roles/resourcemanager.projectCreator), which contains the resourcemanager.projects.create permission. Learn how to grant roles.

Note: If you don't plan to keep the resources that you create in this procedure, create a project instead of selecting an existing project. After you finish these steps, you can delete the project, removing all resources associated with the project.

Go to project selector

Verify that billing is enabled for your Google Cloud project.

1. Enable the Cloud Run, Memorystore for Redis, Artifact Registry, and Cloud Build APIs.

   Roles required to enable APIs

   To enable APIs, you need the Service Usage Admin IAM role (roles/serviceusage.serviceUsageAdmin), which contains the serviceusage.services.enable permission. Learn how to grant roles.

   Enable the APIs

2. Instal dan lakukan inisialisasi gcloud CLI.

Peran yang diperlukan

Untuk mendapatkan izin yang Anda perlukan untuk menyelesaikan tutorial, minta administrator Anda untuk memberi Anda peran IAM berikut di project Anda:

• Pembaca Artifact Registry (roles/artifactregistry.reader)
• Editor Cloud Build (roles/cloudbuild.builds.editor)
• Admin Cloud Memorystore Redis (roles/redis.admin)
• Admin Cloud Run (roles/run.admin)
• Buat Akun Layanan (roles/iam.serviceAccountCreator)
• Project IAM Admin (roles/resourcemanager.projectIamAdmin)
• Service Account Admin (roles/iam.serviceAccountAdmin)
• Service Usage Consumer (roles/serviceusage.serviceUsageConsumer)

Untuk mengetahui informasi selengkapnya tentang pemberian peran, lihat Mengelola akses ke project, folder, dan organisasi.

Anda mungkin juga bisa mendapatkan izin yang diperlukan melalui peran khusus atau peran bawaan lainnya.

Catatan: Peran dasar IAM mungkin juga berisi izin untuk menyelesaikan tutorial. Anda tidak boleh memberikan peran dasar dalam lingkungan produksi, tetapi Anda dapat memberikannya dalam lingkungan pengembangan atau pengujian.

Menyiapkan default gcloud

Untuk mengonfigurasi gcloud dengan setelan default untuk layanan Cloud Run Anda:

1. Setel project default Anda:

   gcloud config set project PROJECT_ID

   Ganti PROJECT_ID dengan nama project yang Anda buat untuk tutorial ini.

2. Konfigurasi gcloud untuk region yang Anda pilih:

   gcloud config set run/region REGION

   Ganti REGION dengan region Cloud Run pilihan Anda yang didukung.

Lokasi Cloud Run

Cloud Run bersifat regional, berarti infrastruktur yang menjalankan layanan Cloud Run Anda terletak di region tertentu dan dikelola oleh Google agar tersedia secara redundan di semua zona dalam region tersebut.

Memenuhi persyaratan latensi, ketersediaan, atau ketahanan adalah faktor utama untuk memilih region tempat layanan Cloud Run dijalankan. Pada umumnya, Anda dapat memilih region yang paling dekat dengan pengguna Anda, tetapi Anda harus mempertimbangkan lokasi produk Google Cloud lainnya yang digunakan oleh layanan Cloud Run Anda. Menggunakan Google Cloud produk secara bersamaan di beberapa lokasi dapat memengaruhi latensi serta biaya layanan Anda.

Cloud Run tersedia di region berikut:

Tergantung harga Tingkat 1

• asia-east1 (Taiwan)
• asia-northeast1 (Tokyo)
• asia-northeast2 (Osaka)
• asia-south1 (Mumbai, India)
• europe-north1 (Finlandia) CO₂ Rendah
• europe-north2 (Stockholm) CO₂ Rendah
• europe-southwest1 (Madrid) CO₂ Rendah
• europe-west1 (Belgia) CO₂ Rendah
• europe-west4 (Belanda) CO₂ Rendah
• europe-west8 (Milan)
• europe-west9 (Paris) CO₂ Rendah
• me-west1 (Tel Aviv)
• northamerica-south1 (Meksiko)
• us-central1 (Iowa) CO₂ Rendah
• us-east1 (South Carolina)
• us-east4 (North Virginia)
• us-east5 (Columbus)
• us-south1 (Dallas) CO₂ Rendah
• us-west1 (Oregon) CO₂ Rendah

Tergantung harga Tingkat 2

• africa-south1 (Johannesburg)
• asia-east2 (Hong Kong)
• asia-northeast3 (Seoul, Korea Selatan)
• asia-southeast1 (Singapura)
• asia-southeast2 (Jakarta)
• asia-south2 (Delhi, India)
• australia-southeast1 (Sydney)
• australia-southeast2 (Melbourne)
• europe-central2 (Warsawa, Polandia)
• europe-west10 (Berlin)
• europe-west12 (Turin)
• europe-west2 (London, Inggris Raya) CO₂ Rendah
• europe-west3 (Frankfurt, Jerman)
• europe-west6 (Zurich, Swiss) CO₂ Rendah
• me-central1 (Doha)
• me-central2 (Dammam)
• northamerica-northeast1 (Montreal) CO₂ Rendah
• northamerica-northeast2 (Toronto) CO₂ Rendah
• southamerica-east1 (Sao Paulo, Brasil) CO₂ Rendah
• southamerica-west1 (Santiago, Cile) CO₂ Rendah
• us-west2 (Los Angeles)
• us-west3 (Salt Lake City)
• us-west4 (Las Vegas)

Jika sudah membuat layanan Cloud Run, Anda dapat melihat region di dasbor Cloud Run di konsolGoogle Cloud .

Oke

Mengambil contoh kode

Untuk mengambil contoh kode agar dapat digunakan:

1. Clone repositori contoh ke komputer lokal Anda:

   Node.js

   git clone https://github.com/GoogleCloudPlatform/nodejs-docs-samples.git

   Atau, Anda dapat mendownload contoh sebagai file ZIP dan mengekstraknya.

2. Ubah ke direktori yang memuat kode contoh Cloud Run:

   Node.js

   cd nodejs-docs-samples/run/websockets/

Memahami kode WebSockets

Socket.io adalah library yang memungkinkan komunikasi dua arah secara real-time antara browser dan server. Meskipun bukan implementasi WebSocket, Socket.io menggabungkan fungsi untuk menyediakan API yang lebih sederhana bagi beberapa protokol komunikasi dengan fitur tambahan seperti keandalan yang lebih baik, sambungan ulang otomatis, dan menyiarkan pesan ke semua atau sebagian klien.

Integrasi sisi klien

<script src="/socket.io/socket.io.js"></script>

Klien membuat instance instance Socket baru untuk setiap koneksi. Karena contoh ini dirender di sisi server, URL server tidak perlu ditentukan. Instance soket dapat memunculkan dan memproses peristiwa.

// Initialize Socket.io
const socket = io('', {
  transports: ['websocket'],
});

// Emit "sendMessage" event with message
socket.emit('sendMessage', msg, error => {
  if (error) {
    console.error(error);
  } else {
    // Clear message
    $('#msg').val('');
  }
});

// Listen for new messages
socket.on('message', msg => {
  log(msg.user, msg.text);
});

// Listen for notifications
socket.on('notification', msg => {
  log(msg.title, msg.description);
});

// Listen connect event
socket.on('connect', () => {
  console.log('connected');
});

Catatan: Untuk arsitektur beberapa instance tanpa afinitas sesi, Socket.io hanya boleh menggunakan transpor Websocket. Jika Socket.io kembali ke polling panjang, Socket.io akan mengirim beberapa permintaan HTTP selama masa aktif sesi. Permintaan pertama menghasilkan "handshake" dengan informasi penting seperti ID sesi. Setelah permintaan pertama, permintaan mungkin dirutekan ke instance lain yang akan menghasilkan error karena ID sesi tidak dikenali server.

Integrasi sisi server

Di sisi server, server Socket.io diinisialisasi dan dipasang ke server HTTP. Mirip dengan sisi klien, setelah server Socket.io membuat koneksi ke klien, instance socket dibuat untuk setiap koneksi yang dapat digunakan untuk memunculkan dan memproses pesan. Socket.io juga menyediakan antarmuka untuk membuat "ruang" atau saluran arbitrer tempat soket dapat bergabung dan keluar.

// Initialize Socket.io
const server = require('http').Server(app);
const io = require('socket.io')(server);

const {createAdapter} = require('@socket.io/redis-adapter');
// Replace in-memory adapter with Redis
const subClient = redisClient.duplicate();
io.adapter(createAdapter(redisClient, subClient));
// Add error handlers
redisClient.on('error', err => {
  console.error(err.message);
});

subClient.on('error', err => {
  console.error(err.message);
});

// Listen for new connection
io.on('connection', socket => {
  // Add listener for "signin" event
  socket.on('signin', async ({user, room}, callback) => {
    try {
      // Record socket ID to user's name and chat room
      addUser(socket.id, user, room);
      // Call join to subscribe the socket to a given channel
      socket.join(room);
      // Emit notification event
      socket.in(room).emit('notification', {
        title: "Someone's here",
        description: `${user} just entered the room`,
      });
      // Retrieve room's message history or return null
      const messages = await getRoomFromCache(room);
      // Use the callback to respond with the room's message history
      // Callbacks are more commonly used for event listeners than promises
      callback(null, messages);
    } catch (err) {
      callback(err, null);
    }
  });

  // Add listener for "updateSocketId" event
  socket.on('updateSocketId', async ({user, room}) => {
    try {
      addUser(socket.id, user, room);
      socket.join(room);
    } catch (err) {
      console.error(err);
    }
  });

  // Add listener for "sendMessage" event
  socket.on('sendMessage', (message, callback) => {
    // Retrieve user's name and chat room  from socket ID
    const {user, room} = getUser(socket.id);
    if (room) {
      const msg = {user, text: message};
      // Push message to clients in chat room
      io.in(room).emit('message', msg);
      addMessageToCache(room, msg);
      callback();
    } else {
      callback('User session not found.');
    }
  });

  // Add listener for disconnection
  socket.on('disconnect', () => {
    // Remove socket ID from list
    const {user, room} = deleteUser(socket.id);
    if (user) {
      io.in(room).emit('notification', {
        title: 'Someone just left',
        description: `${user} just left the room`,
      });
    }
  });
});

Socket.io juga menyediakan adaptor Redis untuk menyiarkan peristiwa ke semua klien, terlepas dari server mana yang melayani soket. Socket.io hanya menggunakan mekanisme Pub/Sub Redis dan tidak menyimpan data apa pun.

const {createAdapter} = require('@socket.io/redis-adapter');
// Replace in-memory adapter with Redis
const subClient = redisClient.duplicate();
io.adapter(createAdapter(redisClient, subClient));

Adaptor Redis Socket.io dapat menggunakan kembali klien Redis yang digunakan untuk menyimpan histori pesan ruang. Setiap container akan membuat koneksi ke instance Redis dan Cloud Run dapat membuat instance dalam jumlah besar. Koneksi ini jauh di bawah 65.000 koneksi yang dapat didukung Redis.

Catatan: Siklus proses container Cloud Run tidak mempertimbangkan permintaan keluar seperti koneksi Redis; oleh karena itu, koneksi aktif ke Redis tidak akan mencegah container melakukan penskalaan.

Sambungan ulang

Cloud Run memiliki waktu tunggu maksimum 60 menit. Jadi, Anda perlu menambahkan logika sambungan ulang untuk kemungkinan waktu tunggu. Dalam beberapa kasus, Socket.io secara otomatis mencoba menghubungkan kembali setelah peristiwa pemutusan koneksi atau error koneksi. Tidak ada jaminan bahwa klien akan terhubung kembali ke instance yang sama.

// Listen for reconnect event
socket.io.on('reconnect', () => {
  console.log('reconnected');
  // Emit "updateSocketId" event to update the recorded socket ID with user and room
  socket.emit('updateSocketId', {user, room}, error => {
    if (error) {
      console.error(error);
    }
  });
});

// Add listener for "updateSocketId" event
socket.on('updateSocketId', async ({user, room}) => {
  try {
    addUser(socket.id, user, room);
    socket.join(room);
  } catch (err) {
    console.error(err);
  }
});

Instance akan tetap ada jika ada koneksi yang aktif hingga semua permintaan ditutup atau waktu habis. Meskipun Anda menggunakan afinitas sesi Cloud Run, permintaan baru dapat di-load balanced ke container aktif, sehingga container dapat menurunkan skala. Jika Anda khawatir mengenai banyaknya container yang terus ada setelah terjadi lonjakan traffic, Anda dapat menurunkan nilai waktu tunggu maksimum agar soket yang tidak digunakan lebih sering dibersihkan.

Mengirimkan layanan

1. Buat instance Memorystore untuk Redis:

   gcloud redis instances create INSTANCE_ID --size=1 --region=REGION

   Ganti kode berikut:

   • INSTANCE_ID: nama instance—misalnya, my-redis-instance.
   • REGION_ID: region untuk semua resource dan layanan Anda—misalnya, europe-west1.

   Instance akan secara otomatis mendapatkan alokasi rentang IP dari rentang jaringan layanan default. Tutorial ini menggunakan memori 1 GB untuk cache lokal pesan dalam instance Redis. Pelajari lebih lanjut cara Menentukan ukuran awal instance Memorystore untuk kasus penggunaan Anda.

2. Tentukan variabel lingkungan dengan alamat IP jaringan yang diizinkan instance Redis:

    export REDISHOST=$(gcloud redis instances describe INSTANCE_ID --region REGION --format "value(host)")

   Catatan: Tutorial ini menggunakan nilai default untuk port Redis, 6379.

3. Buat akun layanan untuk dijadikan sebagai identitas layanan. Secara default, opsi ini tidak memiliki hak istimewa selain keanggotaan project.

   gcloud iam service-accounts create chat-identity
   gcloud projects add-iam-policy-binding PROJECT_ID \
   --member=serviceAccount:chat-identity@PROJECT_ID.iam.gserviceaccount.com \
   --role=roles/serviceusage.serviceUsageConsumer

4. Temukan nama jaringan VPC yang diberi otorisasi instance Redis Anda dengan menjalankan perintah berikut:

     gcloud redis instances describe INSTANCE_ID --region REGION --format "value(authorizedNetwork)"
   

   Ganti kode berikut:

   • INSTANCE_ID: nama instance—misalnya, my-redis-instance.
   • REGION_ID: region untuk semua resource dan layanan Anda—misalnya, europe-west1.

   Catat nama jaringan VPC.

5. Bangun dan deploy image container ke Cloud Run:

   gcloud run deploy chat-app --source . \
       --allow-unauthenticated \
       --timeout 3600 \
       --service-account chat-identity \
       --network NETWORK \
       --subnet SUBNET \
       --update-env-vars REDISHOST=$REDISHOST

   Ganti kode berikut:

   • NETWORK adalah nama jaringan VPC resmi yang terhubung ke instance Redis Anda.
   • SUBNET adalah nama subnet Anda. Subnet harus berukuran /26 atau lebih besar. Traffic keluar VPC langsung mendukung rentang IPv4 RFC 1918, RFC 6598, dan Class E.

   Merespon setiap permintaan untuk menginstal API yang diperlukan dengan merespons y ketika diminta. Anda hanya perlu melakukan ini sekali untuk sebuah project. Merespons permintaan lainnya dengan menyediakan platform dan region, jika Anda belum menetapkan setelan default untuk permintaan tersebut seperti yang dijelaskan di halaman penyiapan. Pelajari lebih lanjut cara Men-deploy dari kode sumber.

Mencoba layanan

Untuk mencoba layanan lengkap:

1. Buka browser Anda ke URL yang diberikan pada langkah deployment.

2. Tambahkan nama Anda dan ruang chat untuk login.

3. Kirim pesan ke ruang.

Berhasil: Anda telah membangun layanan chat real-time multi-ruangan menggunakan WebSockets untuk mempertahankan koneksi persisten untuk komunikasi dua arah.

Jika Anda memilih untuk terus mengembangkan layanan ini, perlu diingat bahwa layanan tersebut telah membatasi akses Identity and Access Management (IAM) ke bagian lain dari Google Cloud dan perlu diberi peran IAM tambahan guna mengakses banyak layanan lainnya.

Pembersihan

Agar tidak menimbulkan biaya tambahan pada akun Google Cloud Anda, hapus semua resource yang Anda deploy dengan tutorial ini.

Menghapus project

Jika Anda membuat project baru untuk tutorial ini, hapus project tersebut. Jika Anda menggunakan project yang ada dan perlu mempertahankannya tanpa perubahan yang Anda tambahkan dalam tutorial ini, hapus resource yang Anda buat untuk tutorial.

Cara termudah untuk menghilangkan penagihan adalah dengan menghapus project yang Anda buat untuk tutorial.

Untuk menghapus project:

Perhatian: Penghapusan project memiliki efek berikut:

• Semua hal dalam project akan dihapus. Jika Anda menggunakan project yang ada untuk mengerjakan tugas di dokumen ini, saat Anda menghapusnya, pekerjaan lain dalam project tersebut juga akan dihapus.
• Project ID kustom akan hilang. Saat membuat project ini, Anda mungkin juga membuat project ID kustom yang masih ingin digunakan pada masa mendatang. Agar tidak kehilangan URL yang menggunakan project ID tersebut, seperti URL appspot.com, hapus resource yang dipilih di dalam project, bukan menghapus seluruh project.

Jika Anda berencana mempelajari berbagai arsitektur, tutorial, atau panduan memulai, project dapat digunakan kembali agar Anda tidak melampaui batas kuota project.

1. In the Google Cloud console, go to the Manage resources page.

   Go to Manage resources

2. In the project list, select the project that you want to delete, and then click Delete.
3. In the dialog, type the project ID, and then click Shut down to delete the project.

Menghapus resource tutorial

1. Hapus layanan Cloud Run yang Anda deploy dalam tutorial ini. Layanan Cloud Run tidak menimbulkan biaya hingga menerima permintaan.

   Untuk menghapus layanan Cloud Run, jalankan perintah berikut:

   gcloud run services delete SERVICE-NAME

   Ganti SERVICE-NAME dengan nama layanan Anda.

   Anda juga dapat menghapus layanan Cloud Run dari Google Cloud console.

2. Hapus konfigurasi region default gcloud yang Anda tambahkan selama penyiapan tutorial:

    gcloud config unset run/region
   

3. Hapus konfigurasi project:

    gcloud config unset project
   

4. Hapus resource Google Cloud lain yang dibuat dalam tutorial ini:

   • Hapus image container layanan yang bernama gcr.io/PROJECT_ID/chat-app dari Artifact Registry
   • Hapus akun layanan chat-identity@PROJECT_ID.iam.gserviceaccount.com
   • Hapus instance Memorystore untuk Redis

Langkah berikutnya

• Pelajari lebih lanjut cara kerja Socket.io dan penggunaan lebih lanjut.

• Pelajari lebih lanjut Traffic keluar VPC langsung dengan jaringan VPC.

• Tinjau praktik terbaik untuk Memorystore dan untuk Penggunaan WebSockets di Cloud Run.