googleスプレッドシートをGoogle Apps ScriptでHTMLページとして出力する

ちょっと機会があって手を出した、googleスプレッドシートの情報を元にwebページ出力させる方法をまとめます。

以下のURLに記載しているようなスプレッドシートの情報を元に、GASを使ってwebページとして出力します。
https://docs.google.com/spreadsheets/d/1BqDVWjXT5lYw6UKPcCXlnxPleMkfnwF1Dhe01Icbwdo/edit?usp=sharing

GASでdoGet,doPostメソッドを作成した上で、ウェブアプリケーションとして公開するとその公開URLにGET,POSTリクエストが投げられた際に、その各メソッドの返り値がブラウザに返されます。
これを使えば、任意のHTMLをブラウザに返すことが出来ます。さらにGASなので、スプレッドシート等の情報を利用して返すことも可能です。

この時、テンプレートとなるHTMLを作成し、そこに任意のコードを記載した状態で動的にページを返すようにもすることが出来ます。
単純にスプレッドシートの中身をそのままHTMLのテーブルとして出力しようとした場合、以下のdogetメソッドと、テンプレートHTMLで実現できます。

また、テンプレートHTMLには任意のコードを記載できるので、条件に当てはまるものだけを出力するといったことも可能です。以下のコードでは2列目に記述のある行だけを出力するテーブルと、2列目に記述のない行だけを出力するテーブルを分けて出力するようにしています。(テンプレートの記載方法に関しては、公式のhelp等を参考に)

このように単純にそのまま記載した内容を表示するだけでなく、任意の条件で表示させることもでき、かつスプレッドシートの中身を書き換えれば記載内容も修正できるため、簡単な集計ページの作成や、技術者以外の人にも更新作業を簡単に行えるページなどを作る際に良いのではないかと思います。

上記のコードを利用して作成したページを以下に記載します。
https://script.google.com/macros/s/AKfycbzZdW82VldvJDFue9-YYCXHTc_4pPL_tuRGP_aZBahL3N5kRzE/exec

Leave a Comment


NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>