見出し画像

Googleカレンダー連携：最新・完全ガイド

ちーみつ｜AIで「めんどくさい」を減らす人

このガイドは、私が自作ウェブアプリとGoogleカレンダーを表示・連携させるためにまとめた設定手順です。
※Google Cloudの画面は頻繁に変わるため、項目名などが変わっている場合があります。


Step 1. 「プロジェクト（作業場）」を作成する

まずは、設定を保存するための「入れ物（プロジェクト）」をGoogle Cloud上に作ります。
※Googleカレンダーの利用は基本的に無料です。決済情報の入力なしで作成できます。

  1. こちらのリンク（プロジェクト作成画面） を直接クリックします。

    • Googleアカウントへのログインを求められたらログインしてください。

    • 画面のあちこちに「無料トライアル（$300クレジット）」などの案内が出ることがありますが、 基本的には無視（閉じてもOK） です。クリックすると決済情報の入力を求められてしまいます。

  2. 設定を以下のように入力します：

    • プロジェクト名： 好きな名前を入力してください
      （例： `yoyaku-calendar` ）。

      • 【注意】 日本語はエラーになるため、必ず 「半角英数字とハイフン」 のみで入力してください。

    • 親リソース（場所）： ［組織なし］のままでOKです。

  3. 一番下の ［作成］ を押します。

【重要】作成後の手順：
作成後、画面は自動で切り替わりません。

  • 画面右上の 「ベルのマーク（通知）」 をクリックします。

  • 通知内の ［プロジェクトを選択］ という青い文字をクリックします。

  • 左上のロゴ横が、先ほど入力したプロジェクト名になれば準備完了です。

Step 2. カレンダー機能を「有効」にする

作成したプロジェクトで、Googleカレンダーを使えるように許可を出します。

  1. 画面上部の大きな 「検索窓（虫眼鏡マーク）」 に、直接 `` と入力します。

  2. 検索結果の候補から 「Google Calendar API」 を選んでクリックします。

  3. 青い ［有効にする］ ボタンを押し、画面が切り替わるまで数秒待ちます。

Step 3. アプリの初期設定をする（最新：Google Auth Platform）

外部からカレンダーにアクセスできるように、アプリの初期設定を「ウィザード形式」で進めます。

画面左上の ［三本線メニュー］ ➔ ［API とサービス］ ➔ ［OAuth 同意画面］ をクリックします。

画面中央の青い ［開始］ ボタンをクリックします。

ここから、以下のステップを順に進めます。

① アプリ情報

  • アプリ名： `yoyaku-calendar`（好きな名前でOK）

  • ユーザー サポートメール： 自分のメールアドレスを選択

  • 入力したら、下にある ［次へ］ をクリックします。

② 対象（Audience）

  • ユーザータイプ： ［外部（External）］ にチェックを入れます。

  • 下にある ［次へ］ をクリックします。

③ 連絡先情報

  • 一番下の 「デベロッパーの連絡先情報」 に、自分のメールアドレスを入力します。

  • 入力したら、下にある ［次へ］ をクリックします。

④ 終了

  1. 「Google API サービス: ユーザーデータに関するポリシーに同意します。」 というチェックボックスをオンにします。

  2. 下にある青い ［続行］ ボタンをクリックします。

  3. 画面が切り替わったら、最後に ［完了］ ボタンをクリックして設定を確定させます。

Step 4. アプリを「公開」状態にする

ウィザードが完了したら、最後にアプリを「本番環境」へ移行させます。この手順を忘れると、1週間で連携が切れてしまうため、必ず行います。

  1. 左側のメニューにある 「対象（Audience）」 をクリックします。

  2. 「公開ステータス」の下にある ［アプリを公開］ というボタンをクリックします。

  3. 画面が切り替わり、「本番環境」 という表示に変われば完了です！

【なぜ「公開」するの？】
「テスト中」だと1週間で連携が自動的に切れてしまうからです。「本番環境」にしておくことで、ずっと使い続けることができます。
※公開しても、許可した人以外にカレンダーが見られることはありません。

Step 5. 「クライアント ID」と「シークレット」を取得する

最後に、システム側に設定するための「合言葉」を発行します。

  1. 左側のメニューにある 「クライアント（Clients）」 をクリックします。

    • 四角が並んでいるアイコンのメニューです。

  2. 上部の ［＋ クライアントを作成］ をクリックします。

  3. 設定を以下のように入力します：

    • アプリケーションの種類： ［ウェブ アプリケーション］ を選びます。

    • 名前： 好きな名前でOK（例： `yoyaku-client` ）。最初から入っている名前のままでも構いません。

  4. 下の方にある「承認済みのリダイレクト URI」の ［＋ URI を追加］ を押し、ウェブアプリの URL を正確にコピーして貼り付けます。

  1. 一番下の ［作成］ を押すと、画面に 「クライアント ID」 と 「クライアント シークレット」 が表示されます。これらをコピーして、ウェブアプリの設定画面に貼り付けてください。

これで完了です。

トラブルシューティング

プロジェクトを間違えて作ったので削除したい

  1. こちらの設定ページ を開きます。

  2. 画面上部で「削除したいプロジェクト」が選ばれていることを確認します。

  3. ［シャットダウン］ をクリックし、指示通りにIDを入力して確定します。

IDやシークレットを忘れてしまった場合

一度画面を閉じても大丈夫です。

  1. 左メニューの 「クライアント（Clients）」 をクリック。

  2. 自分で作った名前（ `yoyaku-client` など）をクリック。

  3. 画面の右側（詳細情報）に、IDとシークレットが載っています。コピーして使いましょう。

よろしければスキやフォローなどお願いします🙇

いいなと思ったら応援しよう！