satoshi_komyのブログ

気になったことを書き連ねていきます

Google Apps Scriptで簡単なWebサイトやWebアプリ、Webサービスを作る その1

タイトルはその1としましたが、はたしてその2以降が続くのかは不明です…

Google Apps Script クイックリファレンス

Google Apps Script クイックリファレンス

Google Apps Scriptは便利なもので、ものすごく簡単に言うとGoogleが自前のWebサーバを用意してくれているので、そのうえでHTMLやJavaScriptベースでWebサイトを構築することができるわけです。やり方次第ではかなり細かいことをいろいろとできるようですが、Google Apps Script自体に5分程度の関数実行制限時間*1があるので、そこまで高負荷の処理をすることはできませんが、一般的なWebサイト程度でしたら問題なく作成することができるでしょう。

とりあえず始めてみる

Googleドライブから[新規] → [その他] → [Google Apps Script]を選択してください。Google Apps Scriptは拡張機能のため、標準では入っていない可能性もあります。その場合は[新規] → [その他] → [アプリを追加]を選択し、出てきた画面でGoogle Apps Scriptを検索・インストールしてください。またGoogleアカウントの種類によってはアプリの追加が許可されていないこともあるようです。その場合は新規でスプレッドシートを作成して[ツール] → [スクリプトエディタ]を選択することで、同じようにGoogle Apps Scriptの開発環境・実行環境*2を得ることができます。

スクリプト記述画面が立ち上がったら[ファイル] → [新規作成] → [HTMLファイル]を選択し、新規でHTMLファイルを作成します。ファイル名ですが、ありきたりに「index.html」としておきます。
ここまでで「コード.gs」「index.html」のソースコードを記述できるようになっているはずですので、それぞれ以下のコードを記述します。とりあえず内容にはこだわらず、よくあるオマジナイと思って記述すればOKです。ともかくアクセスすると「Hello, Google Apps Script!」と表示されるはずです。

コード.gs

function doGet(e){
  var html_template = HtmlService.createTemplateFromFile('index.html');
  return html_template.evaluate();
}

index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    Hello, Google Apps Script!
  </body>
</html>

ここまでできたらあとはWebサイトとして公開するだけです。[公開] → [ウェブアプリケーションとして導入]を選択し、サイトとしてのリリース処理を行います。お好みで記述や選択をして[導入]をクリック。ウェブアプリケーションとしてのURLが画面に表示されるので、そこへアクセスして問題なく「Hello, Google Apps Script!」と表示されていれば成功です。

↓実際に作ってみたのがこちら↓
script.google.com
アクセスするにはGoogleアカウントのログインが必要です。

まとめ

簡単ながらもGoogle Apps ScriptでWebサイトを作成することができました。インターネット黎明期のように、ただ単にHTMLを記載して公開するだけならばこれで問題ないかもしれません。WebサーバはGoogleが用意してくれているわけですし。ただしそれだけでは芸もないしおもしろくもない、他にも色々とできることはたくさんあるわけです。

さて、内容としてのその1はここまで。次回以降を書くことがあれば動的にページを作成したり、他のGoogleのサービスと組み合わせる方法をまとめていこうと考えています。

*1:つまるところタイムアウト

*2:ベースがスプレッドシートになるだけで、機能的にはなにも変わりありません