Gmailが送られてきた時にAPIを叩きたい~準備~


# はじめに

こんにちは、エンジニアのkeitaMaxです。
https://qiita.com/muuuuuwa/items/822c6cffedb9b3c27e21

この記事を参考にGmailでメールを受け取った時にAPIを叩くようなものを作成しようと思います。

 https://console.cloud.google.com/
 https://developers.google.com/gmail/api/quickstart/js?hl=ja

 こちらを使用します。

# プロジェクト作成


 https://console.cloud.google.com/

 
上記URLから`新しいプロジェクト`を押し、プロジェクト名を入力してプロジェクトを作成します。

![スクリーンショット 2025-02-05 19.46.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/bb30916c-ba60-d24b-f7f2-ce4c3c55a517.png)

作成ボタンを押してからしばらくするとプロジェクトの作成が完了します。

![スクリーンショット 2025-02-05 19.47.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/84391529-fb28-493b-192d-a97858a5e95d.png)

作成完了してプロジェクトを選択すると、このような感じで「ようこそ」と表示されます。

# GmailAPIを有効にする

参考記事にあるようにGmailAPIを有効にします。

参考記事とは少しだけUIが変わっているので注意です。

![スクリーンショット 2025-02-05 19.49.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/3d2ff741-3f0a-861e-cb1e-d586022204db.png)

左メニューの「APIとサービス」からライブラリをクリックします。

このページにある`Gmail API`をクリックします。

![スクリーンショット 2025-02-05 19.50.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/15880ff0-749e-bda4-7753-0c0881b835af.png)

「有効にする」をクリックします。

![スクリーンショット 2025-02-05 19.51.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/e2ec8ec5-b816-071a-0024-90cd1144ce4a.png)

# OAuth同意

参考記事と同様の手順で行います。

![スクリーンショット 2025-02-05 19.54.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/52574fdd-c33f-d214-89e0-832e7f55b4de.png)

左メニューの「APIとサービス」からOAuth同意画面をクリックします。

外部を選択し、作成ボタンをクリックします。

![スクリーンショット 2025-02-05 19.55.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/3018f220-8135-aeb2-42b2-f6f36c6bd9c1.png)

アプリ登録の編集画面に行くので、アプリ名とデベロッパーメールアドレスを入力し、「保存して次へ」ボタンをクリックします。

![スクリーンショット 2025-02-05 19.56.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/8f2654d5-ea41-1a74-6333-aac7d3b3d66b.png)

![スクリーンショット 2025-02-05 19.57.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/c68dbdd5-59e2-35ee-14ed-c8c14f088940.png)

スコープ追加画面に行くので、`スコープを追加または削除`ボタンを押して、以下のように参考元の記事と同様にチェックをつけて保存します。

![スクリーンショット 2025-02-05 20.03.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/8ac8475d-3a74-9b23-772e-eaaa2a9de9aa.png)

![スクリーンショット 2025-02-05 20.03.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/b0e47b54-bc22-f8d5-0feb-b77258c34e54.png)

# 認証情報の作成

参考記事の通りに行なっていきます。

左メニューの「APIとサービス」から認証情報をクリックします。

![スクリーンショット 2025-02-05 20.06.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/005d409d-695b-e650-e461-dc734012573e.png)

認証情報を作成→ウィザードで選択をクリックします。

![スクリーンショット 2025-02-05 20.07.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/3b28ac40-b2f3-5732-3eda-32093ff480e3.png)

認証情報の種類を選択する画面が表示されるので、APIをGmail,データの種類をユーザーデータを選択して次へを押します。

![スクリーンショット 2025-02-05 20.09.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/f996fb65-5250-b363-b0b2-f67c592899b0.png)

スコープは飛ばして、ウェブアプリケーションを選択し、名前を入力して作成を押します。

![スクリーンショット 2025-02-05 20.11.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3715123/5394c95a-7977-7847-d251-aa03e69412b8.png)

すると認証情報がでるのでダウンロードしてから、完了を押します。


# おわりに

このあとは

https://developers.google.com/gmail/api/guides/push?hl=ja

こちらで試して行ってみます！

この記事での質問や、間違っている、もっといい方法があるといったご意見などありましたらご指摘していただけると幸いです。

最後まで読んでいただきありがとうございました！