このページは Cloud Translation API によって翻訳されました。

Node.js を使用して Google Workspace アドオンを作成する
コレクションでコンテンツを整理必要に応じて、コンテンツの保存と分類を行います。

Node.js ランタイムを使用して、Cloud Functions で Google Workspace アドオンを作成します。

目標

環境をセットアップする。
Cloud Functions の関数を作成してデプロイします。
アドオンを作成してデプロイします。
アドオンをインストールします。

前提条件

Google Cloud プロジェクト。
Cloud プロジェクトの課金が有効になっていることを確認します。詳しくは、プロジェクトの課金ステータスを確認するをご覧ください。
Cloud SDK が Cloud プロジェクトで構成されている。

環境の設定

Google Cloud コンソールで Cloud プロジェクトを開きます。

Google Cloud コンソールで [プロジェクトを選択] ページに移動します。
Cloud プロジェクトを選択する
使用する Google Cloud プロジェクトを選択します。または、[プロジェクトを作成] をクリックし、画面の指示に沿って操作します。Google Cloud プロジェクトを作成する場合は、プロジェクトの課金を有効にする必要がある場合があります。

OAuth 同意画面を構成する

Google Workspace アドオンを使用するには、同意画面を設定する必要があります。アドオンの OAuth 同意画面を構成すると、Google がユーザーに表示する内容を定義できます。

Google Cloud コンソールで、メニュー > > [ブランディング] に移動します。
[ブランディング] に移動
をすでに構成している場合は、[ブランディング]、[オーディエンス]、[データアクセス] で次の OAuth 同意画面の設定を構成できます。[ まだ設定されていません] というメッセージが表示された場合は、[使ってみる] をクリックします。

[アプリ情報] の [アプリ名] に、アプリの名前を入力します。
[ユーザーサポートメール] で、ユーザーが同意について問い合わせる際に使用するサポートのメールアドレスを選択します。
[続行] をクリックします。
[対象] で [内部] を選択します。
[続行] をクリックします。
[連絡先情報] で、プロジェクトの変更に関する通知を受け取るメールアドレスを入力します。
[続行] をクリックします。
[完了] で Google API サービスのユーザーデータポリシーを確認し、同意する場合は [Google API サービス: ユーザーデータに関するポリシーに同意します] を選択します。
[続行] をクリックします。
[作成] をクリックします。

現時点では、スコープの追加はスキップできます。今後、Google Workspace 組織の外部で使用するアプリを作成する場合は、[ユーザータイプ] を [外部] に変更する必要があります。次に、アプリに必要な認可スコープを追加します。詳細については、OAuth 同意画面を構成するガイドをご覧ください。

Cloud 関数を作成してデプロイする

Google Cloud コンソールで、[Cloud Shell をアクティブにする] をクリックします。

Cloud Shell をアクティブにする

Cloud Shell ターミナルが開き、Google Cloud コンソールの下部ペインでセッションが起動します。
[承認] をクリックして、Cloud Shell をプロビジョニングして接続します。

Cloud Shell ターミナルで、Cloud Functions API、Cloud Build API、Google Workspace アドオン API、Compute Engine API を有効にします。

gcloud services enable cloudfunctions.googleapis.com  \
                    cloudbuild.googleapis.com  \
                    gsuiteaddons.googleapis.com  \
                    compute.googleapis.com

Cloud Shell エディタを起動するには、Cloud Shell ウィンドウのツールバーにある [エディタを開く] をクリックします。

この組み込みコードエディタを使用すると、プロジェクトがビルドやデプロイされるのと同じ環境でファイルの表示や編集を簡単に行うことができます。

空のディレクトリに、次のサンプルコードを使用して function.js ファイルを作成します。

/**
 * 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"
                     }
                  }
                ]
              }
            ]
          }
        }
      ]
    }
  };
}

同じディレクトリに、次のサンプルコードを使用して package.json ファイルを作成します。
```
{
  "dependencies": {
    "@google-cloud/functions-framework": "^3.0.0"
  }
}
```
[ターミナルを開く] をクリックして、Cloud Shell ターミナルに戻ります。

Compute Engine のデフォルトサービスアカウントに Cloud Build Service Account ロール（roles/cloudbuild.builds.builder）を追加します。

まず、サービスアカウントの権限を設定します。

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

次に、不足しているサービスアカウント権限を付与します。

gcloud projects add-iam-policy-binding $PROJECT_ID \
  --member="serviceAccount:$SERVICE_ACCOUNT_NAME" \
  --role="roles/cloudbuild.builds.builder"

次のコマンドを実行して、関数をデプロイします。
```
gcloud functions deploy loadHomePage --runtime nodejs22 --trigger-http
```
プロンプトが表示されたら、関数の未認証の呼び出しを許可しないことを指定します。関数のデプロイには数分かかることがあります。

アドオンのデプロイを作成する

アドオンのサービスアカウントのメールアドレスを確認します。
```
gcloud workspace-add-ons get-authorization
```
サービスアカウントに cloudfunctions.invoker ロールを付与します。SERVICE_ACCOUNT_EMAIL は、前の手順でコピーした serviceAccountEmail フィールドに置き換えます。
```
gcloud functions add-iam-policy-binding loadHomePage \
   --role roles/cloudfunctions.invoker \
   --member serviceAccount:SERVICE_ACCOUNT_EMAIL
```
デプロイされた関数の URL を取得します。URL を取得するには、次のコマンドを実行して、httpsTrigger セクションの url フィールドを探します。
```
gcloud functions describe loadHomePage
```
[エディタを開く] をクリックして、Cloud Shell エディタに戻ります。

package.json と同じディレクトリに、次のサンプルコードを含む deployment.json ファイルを作成します。URL は、前の手順でデプロイした関数の url に置き換えます。

{
  "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"
    }
  }
}

Cloud Shell ターミナルに戻ってデプロイメントを作成します。

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

アドオンをインストールする

デプロイメントを開発モードでインストールします。
```
gcloud workspace-add-ons deployments install quickstart
```
Gmail を開くか再読み込みして、アドオンを表示します。右側のツールバーで、ビーカーアイコンを探します。
アイコンをクリックしてアドオンを開きます。メッセージが表示されたら、アドオンを承認します。

オプション: クリーンアップ

アカウントに課金されないようにするには、作成したリソースを削除します。

Google アカウントからアドオンをアンインストールします。
```
gcloud workspace-add-ons deployments uninstall quickstart
```
このクイックスタートで使用したリソースに対して課金されないようにするには、Cloud プロジェクトを削除します。
```
gcloud projects delete PROJECT_ID
```
PROJECT_ID は、クイックスタートに使用した Cloud プロジェクトの ID に置き換えます。Cloud プロジェクト ID は、Google Cloud コンソールの [ダッシュボード] ページで確認できます。

Google Workspace アドオンに機能を追加するには、以下をご覧ください。

Node.js を使用して Google Workspace アドオンを作成する コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。

目標