ウェブアプリ

スクリプトのユーザー インターフェースを作成する場合は、スクリプトをウェブアプリとして公開できます。たとえば、ユーザーがサポートチームのメンバーとの予約をスケジュールできるスクリプトは、ユーザーがブラウザから直接アクセスできるようにウェブアプリとして提示することをおすすめします。

スタンドアロン スクリプトとアプリケーションにバインドされたスクリプトはどちらも、以下の要件を満たしていれば、ウェブアプリに変換できます。 Google Workspace

ウェブアプリの要件

スクリプトが次の要件を満たしている場合は、ウェブアプリとして公開できます。

リクエスト パラメータ

ユーザーがアプリにアクセスするか、プログラムがアプリに HTTP GET リクエストを送信すると、Apps Script は関数 doGet(e) を実行します。プログラムがアプリに HTTP POST リクエストを送信すると、Apps Script は代わりに doPost(e) を実行します。どちらの場合も、e 引数は、任意のリクエスト パラメータに関する情報を含むことができるイベント パラメータを表します。次の表に、イベント オブジェクトの構造を示します。

フィールド
e.queryString

URL のクエリ文字列部分の値。クエリ文字列が指定されていない場合は null

name=alice&n=1&n=2
e.parameter

リクエスト パラメータに対応する Key-Value ペアのオブジェクト。パラメータが複数の値を持つ場合は、最初の値のみが返されます。

{"name": "alice", "n": "1"}
e.parameters

e.parameter に類似したオブジェクト。ただし、キーごとに値の配列を持ちます。

{"name": ["alice"], "n": ["1", "2"]}
e.pathInfo

/exec または /dev の後の URL パス。たとえば、URL パスが /exec/hello で終わる場合、パス情報は hello です。
e.contextPath 使用されず、常に空の文字列です。
e.contentLength

POST リクエストの場合はリクエスト本文の長さ、GET リクエストの場合は -1

332
e.postData.length

e.contentLength と同じ

332
e.postData.type

POST 本文の MIME タイプ

text/csv
e.postData.contents

POST 本文のコンテンツ テキスト

Alice,21
e.postData.name

常に値「postData」

postData

たとえば、次のように username や age などのパラメータを URL に渡すことができます。

https://script.google.com/.../exec?username=jsmith&age=21

その後、次のようにパラメータを表示できます。

function doGet(e) {
  var params = JSON.stringify(e);
  return ContentService.createTextOutput(params).setMimeType(ContentService.MimeType.JSON);
}

上記の例では、doGet(e) は次の出力を返します。

{
  "queryString": "username=jsmith&age=21",
  "parameter": {
    "username": "jsmith",
    "age": "21"
  },
  "contextPath": "",
  "parameters": {
    "username": [
      "jsmith"
    ],
    "age": [
      "21"
    ]
  },
  "contentLength": -1
}

スクリプトをウェブアプリとしてデプロイする

スクリプトをウェブアプリとしてデプロイする手順は次のとおりです。

  1. スクリプト プロジェクトの右上にある [デプロイ] > [新しいデプロイ] をクリックします。
  2. [タイプを選択] の横にある「デプロイタイプを有効にする」アイコン > [ウェブアプリ] をクリックします。
  3. [デプロイ構成] の下のフィールドにウェブアプリに関する情報を入力します。
  4. [Deploy] をクリックします。

ウェブアプリの URL は、アプリの使用を許可している相手と共有できます。

ウェブアプリのデプロイをテストする

スクリプトをウェブアプリとしてテストする手順は次のとおりです。

  1. スクリプト プロジェクトの右上にある [デプロイ] > [デプロイをテスト] をクリックします。
  2. [タイプの選択] の横にある「デプロイタイプを有効にする」アイコン > [ウェブアプリ] をクリックします。
  3. [ウェブアプリの URL] の下にある [コピー] をクリックします。

  4. コピーした URL をブラウザに貼り付けて、ウェブアプリをテストします。

    この URL は /dev で終わります。この URL にアクセスできるのは、スクリプトの編集権限を持つユーザーのみです。アプリのこのインスタンスは常に最後に保存されたコードを実行し、開発中のテストのみを目的としています。

権限

ウェブアプリの権限は、アプリの実行方法によって異なります。

  • 私としてアプリを実行する - この場合、ウェブアプリにアクセスするユーザーに関係なく、スクリプトは常にスクリプトのオーナーとして実行されます。
  • ウェブアプリにアクセスするユーザーとしてアプリを実行する - この場合、ウェブアプリを使用するアクティブ ユーザーの ID でスクリプトが実行されます。この権限アプローチにより、ユーザーがアクセスを承認したときに、ウェブアプリにスクリプトのオーナーのメールアドレスが表示されます。

Google サイトにウェブアプリを埋め込む

Google サイトにウェブアプリを埋め込むには、まずアプリをデプロイする必要があります。また、Deploy ダイアログの [Deployed URL] も必要です。

ウェブアプリを [サイト] ページに埋め込む手順は次のとおりです。

  1. ウェブアプリを追加する Google サイトページを開きます。
  2. [挿入] > [URL を埋め込む] を選択します。
  3. ウェブアプリの URL を貼り付けて、[追加] をクリックします。

ページのプレビューのフレーム内にウェブアプリが表示されます。ページを公開する際に、サイト閲覧者はウェブアプリを通常どおり実行する前に承認する必要があります。未承認のウェブアプリがユーザーに認証プロンプトを表示します。

ウェブアプリとブラウザの履歴

Apps Script ウェブアプリで複数ページ アプリケーションをシミュレートすることや、URL パラメータで制御される動的 UI を備えたアプリケーションをシミュレートすることが望ましい場合があります。そのためには、アプリの UI またはページを表す状態オブジェクトを定義し、ユーザーがアプリを操作したときにその状態をブラウザ履歴にプッシュします。また、履歴イベントをリッスンして、ユーザーがブラウザボタンを前後に移動したときにウェブアプリが正しい UI を表示することもできます。読み込み時に URL パラメータをクエリすると、それらのパラメータに基づいてアプリで動的に UI を作成でき、ユーザーは特定の状態でアプリを起動できます。

Apps Script には、ブラウザ履歴にリンクされたウェブアプリの作成を支援する、2 つの非同期のクライアントサイド JavaScript API が用意されています。

  • google.script.history は、ブラウザ履歴の変更に動的に対応するメソッドを提供します。これには、状態（定義可能な単純なオブジェクト）をブラウザ履歴に push する、履歴スタックの最上位の状態を置き換える、履歴の変更に応答するリスナー コールバック関数の設定などが含まれます。

  • google.script.url は、現在のページの URL パラメータと URL フラグメント（存在する場合）を取得する手段を提供します。

これらの履歴 API はウェブアプリでのみ使用できます。サイドバー、ダイアログ、アドオンではサポートされていません。また、Google サイトに埋め込まれたウェブアプリでこの機能を使用することもおすすめしません。