GASでWebアプリ、プロ向けのかんどころ
以前にも書きましたが、GASの勉強を続けています。いちおうLINEとSlackに通知を送ってみたりしていますが、Webアプリを作れることを全然知りませんでした。これは個人で使うちょっとしたツールとか、もしくはプログラミングを始めてみたい！という人がスクールにお金を払う前に適性を見るのには充分なんじゃないでしょうか。ということでご紹介。
検索すればGASでWebアプリを作る記事はいくらでも出てくるので、アカウントを作って、Hello Worldするところまではそちらでどうぞ。とはいえ、軽く見た感じだと、最近UIが変わって、書籍とも整合性がなくなっている部分があるので、適宜、自分が気になったポイントだけスクリーンショットも置いておきます。
ファイル構成
まず、Webアプリを作るとき。
まず、ふだんお仕事でWebアプリ書いている人なら理解は早いと思いますが、サーバー側のJSのコードと、あとは大抵のWAFと同じでテンプレートファイルが用意されています。コード.gs（何回見てもこのファイル名は慣れないけど）と、その下にindex.htmlがありますね。新規作成の時にどちらかを選んで作る感じです。
値の受け渡し
リクエストを受ける専用のハンドラがある
doGet(e) とdoPost(e)という名前で関数を作れば、それぞれGET/POSTでリクエストを受け取れます。GETでフォームの値を取得する時は例えば<input type="text" name="foo" value="bar">で送られてきていればe.parameter.fooの中身がbarになるわけです。POSTも調べてませんがたぶんそう。
テンプレート記法は<? 〜 ?>が基本
3種類あるみたいですけど、お仕事で書いている人なら特に違和感ないでしょう。タグ内の記法はJSを使います。サーバ側のコード内の関数が呼べます。
<? ?>タグ内を実行<?= ?>タグ内を実行して結果をsanitizeして出力<?!= ?>タグ内を実行して結果をそのまま出力
formのaction属性にはURLを貼る必要があるみたい
これが今回参考にした書籍には書いていなくて一瞬困りました。新しい書籍なので、しょうがないですかね。そのURLは以下のデプロイ機能で発行する必要があります。
デプロイ
開発中は「デプロイでテスト」、できたら「新しいデプロイ」
ここも書籍とはUIが変わってて数秒戸惑ったので、スクリーンショット貼っておきます。画面右上の「デプロイ」ボタンです。
「デプロイをテスト」を押すと、殺風景なボタンが出てきます。リンク先クリックで動作確認できます。また、このURLをHTMLないからフォーム送信するときにはaction属性に埋め込みます。
実際に公開する時は「デプロイ」の方でやってください。GAS独特なのはこれぐらいなので、あとは好きにやってください。使い道とかはいろいろ思いつくので、機会があればそれについても書きますね。
