GoogleのスクリプトでWebサイトに文字を表示する
Google Appsとは…
Google Appsとは、Google社が提供しているパブリッククラウド型のサービスのことです。
Google Appsを導入することにより、
Gmailやハングアウト、スプレッドシートなどのドキュメントの共有(管理や編集)だけでなく、スケジュール共有(Googleカレンダー)といったサービスによる情報共有ができるようになります。
またGoogle Appsを使用することにより、IT コストを削減できるだけでなく生産性を高めることができます。これらのGoogle Appsを使ったことがないという方は少ないのではないでしょうか。
Google Apps Script (GAS)とは…
Google Apps Scriptは頭文字をとって「GAS(ガス)」と略されます。
Google Apps Scriptとは、GmailやGoogleカレンダー、Googleドライブなど、Googleが提供しているさまざまなツールやサービスを連携して利用するためにGoogleが開発し、提供しているJavaScript ベースのプログラミング言語です。Google Apps Scriptは開発環境の構築が必要なく、Googleアカウントとインターネット環境さえあれば利用できます。また、Google Apps Scriptは無料で利用できます。
JavaScriptというのは、Webブラウザ上で動作するプログラミング言語で、Webサービスを作ろうと思ったときには避けては通ることができない言語ですので、ある程度の学習が必要になります。ただし、JavaScriptはエンジニアにとってはポピュラーな言語なので学習コストは多少低いのではないでしょうか。
Google Apps Scripを使えば、カスタムのメニューやダイアログ、サイドバーを Google ドキュメント、スプレッドシート、フォームに追加することができますし、GmailやGoogleカレンダなどのGoogleが提供しているさまざまなサービスと連携して活用することができます。
例えば、GoogleスプレッドシートやGoogleドキュメントなどの操作を自動化して表やグラフを作成することや、決まったフォーマットにドキュメントを整理すること、ファイルの共有管理などができます。
また、Gmailに届いた添付ファイルをGoogleドライブに共有する場合にも、ファイルを自動で共有フォルダにアップロードするように設定できますし、メールの自動送信や返信もできます。
今回はGoogle Apps Scriptを使ってサイトに文字を表示する手順について紹介していきます。
Webサイトに文字を表示させる手順
Webサイトに文字を表示してみましょう。手順を書いていきますので、一緒に進めてください！
2：Googleドライブを開き、左上にある「新規」から「その他」→「Google Apps Script」を開きます。
3：無題のプロジェクトはこのままでは何をするためのスクリプトなのかわかりませんので、左上の
「無題のプロジェクト」をクリックして名前を変更しましょう。
プロジェクトの中には「コード.gs」と書かれたファイルがあり、プロジェクトの中は
function myFunction() {
}
と書かれています。
4：その画面のまま、「ファイル」→「New」→「HTMLファイル」を開きます。
ファイル名を決めるよう表示されますので、何のファイルかわかる名前をつけましょう!
5：そうするとHTMLの画面が現れます。中は
<html>
<head>
<base target=”_top”>
</head>
<body>
</body>
</html>
となっているはずです。標準装備されていてありがたいですね！
6：さて、ここからWebサイトに文字を表示するために先ほどの内容に中身を追加いきます。
今回は挨拶を表示してみます。
<html>
<head>
<base target=”_top”>
</head>
<body>
HELLO! こんにちは！
</body>
</html>
と書くことができます。これだけでは表示されませんので、ここからさらに作業していきます。
7：doGet関数を使って「コード.gs」の中身を書いていきます。
すでに書かれていた「myFunction()」という関数を消して、代わりに「doGet」という関数を作成します。
function doGet() {
return HtmlService.createTemplateFromFile(“ファイル名”).evaluate(); }
というふうに書きます。ファイル名には4の時につけた名前を入れます。「.html」は書きません。
※doGetとはWebページを表示する際に呼び出されるメソッドのことです。
8：公開します！
スクリプトエディタのメニューにある「公開」→「ウェブアプリケーションとして導入」を選択して、
アクセスできるユーザーで公開範囲を決めます。
そして「導入」を選択すると完了で、ウェブアプリケーションのURLが生成されます。
そのURLにブラウザからアクセスすると内容が表示されます。
最後に…
今回はGoogle Apps Scriptを使ってWebサイトに文字を表示する方法を紹介しました。
「コード.gs」の中に書くdoGetが、個人的にはややこしいなと思いました。なので、テンプレートのようにコピーして保存して使い回してもいいかもしれませんね。
私もまだまだ初心者ですので、もっと色々と試していこうと思いますので共に頑張りましょう。
