この節では、Google Apps ScriptからmicroCMSのContent APIへアクセスし、ポートフォリオの記事データを取得します。

記事一覧と記事詳細の取得処理は、Code.gsに記述します。

GASプロジェクトを作成する

Googleドライブを開き、Google Apps Scriptのプロジェクトを作成します。

Googleドライブ
→ 新規
→ その他
→ Google Apps Script

プロジェクト名は、内容が分かるように設定します。

ポートフォリオ

初期状態では、コード.gsというファイルが作成されます。本教材では、これをCode.gsとして扱います。

Code.gsの役割

Code.gsは、Webアプリのサーバー側の処理を担当します。

主な役割は次のとおりです。

• microCMSの接続情報を取得する
• microCMSへAPIリクエストを送る
• 記事一覧を取得する
• 記事を1件取得する
• HTMLテンプレートへ記事データを渡す
• 一覧ページと詳細ページを切り替える

microCMSのAPIキーをHTML側へ書かず、Code.gsから通信することで、ブラウザへAPIキーが公開されることを防ぎます。