メむンコンテンツぞスキップ
芋出し画像

Googleカレンダヌ連携最新・完党ガむド

    このガむドは、私が自䜜りェブアプリず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ずシヌクレットが茉っおいたす。コピヌしお䜿いたしょう。

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

    あなたぞのおすすめ