Mem-build add-on Google Workspace dengan Node.js

Buat add-on Google Workspace di Cloud Functions menggunakan runtime Node.js yang berfungsi di Gmail, Google Drive, Google Kalender, Google Dokumen, Google Spreadsheet, dan Google Slide.

Tujuan

  • Siapkan lingkungan Anda.
  • Buat dan deploy Cloud Function.
  • Buat dan deploy add-on.
  • Instal add-on.

Prasyarat

Menyiapkan lingkungan Anda

Buka project Cloud Anda di konsol Google Cloud

  1. Di konsol Google Cloud, buka halaman Select a project.

    Pilih project Cloud

  2. Pilih project Google Cloud yang ingin Anda gunakan. Atau, klik Buat project dan ikuti petunjuk di layar. Jika membuat project Google Cloud, Anda mungkin perlu mengaktifkan penagihan untuk project tersebut.

Mengonfigurasi layar izin OAuth

Add-on Google Workspace memerlukan konfigurasi layar izin. Mengonfigurasi layar izin OAuth add-on Anda menentukan konten yang ditampilkan Google kepada pengguna.

  1. Di Konsol Google Cloud, buka Menu > Google Auth platform > Branding.

    Buka Branding

  2. Jika sudah mengonfigurasi Google Auth platform, Anda dapat mengonfigurasi setelan Layar Izin OAuth berikut di Branding, Audiens, dan Akses Data. Jika Anda melihat pesan yang bertuliskan Google Auth platform belum dikonfigurasi, klik Mulai:
    1. Di bagian Informasi Aplikasi, di Nama aplikasi, masukkan nama untuk aplikasi.
    2. Di Email dukungan pengguna, pilih alamat email dukungan yang dapat dihubungi pengguna jika mereka memiliki pertanyaan tentang izin mereka.
    3. Klik Berikutnya.
    4. Di bagian Audiens, pilih Internal.
    5. Klik Berikutnya.
    6. Di bagian Informasi Kontak, masukkan Alamat email tempat Anda dapat menerima notifikasi tentang perubahan apa pun pada project Anda.
    7. Klik Berikutnya.
    8. Di bagian Selesai, tinjau Kebijakan Data Pengguna Layanan Google API dan jika Anda setuju, pilih Saya setuju dengan Kebijakan Data Pengguna Layanan Google API.
    9. Klik Lanjutkan.
    10. Klik Buat.
  3. Untuk saat ini, Anda dapat melewati penambahan cakupan. Pada masa mendatang, saat membuat aplikasi untuk digunakan di luar organisasi Google Workspace Anda, Anda harus mengubah Jenis pengguna menjadi Eksternal. Kemudian tambahkan cakupan otorisasi yang diperlukan aplikasi Anda. Untuk mempelajari lebih lanjut, lihat panduan Mengonfigurasi izin OAuth selengkapnya.

Membuat dan men-deploy Cloud Function

  1. Dari Konsol Google Cloud, klik Activate Cloud Shell Tombol Aktifkan Cloud Shell.

    Aktifkan Cloud Shell

    Terminal Cloud Shell akan terbuka dan meluncurkan sesi di panel bawah konsol Google Cloud.

  2. Klik Authorize untuk menyediakan dan terhubung ke Cloud Shell.

  3. Di Terminal Cloud Shell, aktifkan Cloud Functions API, Cloud Build API, Google Workspace Add-on API, dan Compute Engine API:

    gcloud services enable cloudfunctions.googleapis.com  \
                        cloudbuild.googleapis.com  \
                        gsuiteaddons.googleapis.com  \
                        compute.googleapis.com
    
  4. Luncurkan Cloud Shell Editor dengan mengklik Tombol
Code Editor Open Editor di toolbar jendela Cloud Shell.

    Editor kode bawaan ini memberikan kemudahan untuk melihat dan mengedit file di lingkungan yang sama tempat project dibuat dan di-deploy.

  5. Di direktori kosong, buat file function.js dengan kode contoh berikut:

    /**
     * Cloud Function that loads the homepage for a
     * Google Workspace add-on.
     *
     * @param {Object} req Request sent from Google
     * @param {Object} res Response to send back
     */
    exports.loadHomePage = function addonsHomePage (req, res) {
      res.send(createAction());
    };
    
    /** Creates a card with two widgets. */
    function createAction() {
      return {
        "action": {
          "navigations": [
            {
              "pushCard": {
                "header": {
                  "title": "Cats!"
                },
                "sections": [
                  {
                    "widgets": [
                      {
                        "textParagraph": {
                          "text": "Your random cat:"
                        }
                      },
                      {
                        "image": {
                          "imageUrl": "https://cataas.com/cat"
                         }
                      }
                    ]
                  }
                ]
              }
            }
          ]
        }
      };
    }
    
  6. Dalam direktori yang sama, buat file package.json dengan kode contoh berikut:

    {
      "dependencies": {
        "@google-cloud/functions-framework": "^3.0.0"
      }
    }
    
  7. Kembali ke Terminal Cloud Shell dengan mengklik Tombol Activate Cloud Shell Open Terminal.

  8. Tambahkan peran Cloud Build Service Account (roles/cloudbuild.builds.builder) ke akun layanan default Compute Engine.

    Pertama, siapkan izin akun layanan:

    export PROJECT_ID=$(gcloud config get project)
    export SERVICE_ACCOUNT_NAME=$(gcloud compute project-info describe \
      --format="value(defaultServiceAccount)")
    

    Selanjutnya, berikan izin akun layanan yang tidak ada:

    gcloud projects add-iam-policy-binding $PROJECT_ID \
      --member="serviceAccount:$SERVICE_ACCOUNT_NAME" \
      --role="roles/cloudbuild.builds.builder"
    
  9. Jalankan perintah berikut untuk men-deploy fungsi:

    gcloud functions deploy loadHomePage --runtime nodejs22 --trigger-http
    

    Jika diminta, tentukan bahwa Anda tidak mengizinkan pemanggilan fungsi yang tidak diautentikasi. Mungkin perlu waktu beberapa menit hingga fungsi di-deploy.

Membuat deployment add-on

  1. Temukan email akun layanan untuk add-on:

    gcloud workspace-add-ons get-authorization
    
  2. Berikan peran cloudfunctions.invoker kepada akun layanan. Ganti SERVICE_ACCOUNT_EMAIL dengan kolom serviceAccountEmail dari langkah sebelumnya.

    gcloud functions add-iam-policy-binding loadHomePage \
       --role roles/cloudfunctions.invoker \
       --member serviceAccount:SERVICE_ACCOUNT_EMAIL
    
  3. Dapatkan URL fungsi yang di-deploy. Untuk mendapatkan URL, jalankan perintah berikut dan cari kolom url di bagian httpsTrigger:

    gcloud functions describe loadHomePage
    
  4. Kembali ke Cloud Shell Editor dengan mengklik Tombol
Code Editor Open Editor.

  5. Di direktori yang sama dengan package.json, buat file deployment.json dengan kode contoh berikut. Ganti URL dengan url fungsi yang di-deploy dari langkah sebelumnya.

    {
      "oauthScopes": ["https://www.googleapis.com/auth/gmail.addons.execute"],
      "addOns": {
        "common": {
          "name": "My HTTP Add-on",
          "logoUrl": "https://raw.githubusercontent.com/webdog/octicons-png/main/black/beaker.png",
          "homepageTrigger": {
            "runFunction": "URL"
          }
        },
        "gmail": {},
        "drive": {},
        "calendar": {},
        "docs": {},
        "sheets": {},
        "slides": {},
        "httpOptions": {
          "granularOauthPermissionSupport": "OPT_IN"
        }
      }
    }
    
  6. Kembali ke Terminal Cloud Shell untuk membuat deployment:

    gcloud workspace-add-ons deployments create quickstart \
       --deployment-file=deployment.json
    

Menginstal add-on

  1. Instal deployment dalam mode pengembangan:

    gcloud workspace-add-ons deployments install quickstart
    
  2. Buka atau muat ulang Gmail untuk melihat add-on. Di toolbar di sebelah kanan, cari ikon gelas kimia.

  3. Klik ikon untuk membuka add-on. Jika diminta, berikan otorisasi add-on.

Opsional: Pembersihan

Agar tidak menimbulkan biaya pada akun Anda, hapus resource yang Anda buat:

  1. Menghapus instalan add-on dari Akun Google Anda:

    gcloud workspace-add-ons deployments uninstall quickstart
    
  2. Untuk menghindari biaya atas resource yang digunakan dalam panduan memulai ini, hapus project Cloud:

    gcloud projects delete PROJECT_ID
    

    Ganti PROJECT_ID dengan ID project Cloud yang Anda gunakan untuk panduan memulai. Anda dapat menemukan ID project Cloud di konsol Google Cloud pada halaman Dasbor.

Untuk menambahkan lebih banyak fitur ke add-on Google Workspace Anda, lihat hal berikut: