# 目次

1. はじめに
2. 必要なツールとライブラリ
3. 環境構築
   - 3.1 Firebase プロジェクトのセットアップ
   - 3.2 Gmail API の設定
   - 3.3 必要なライブラリをインストール
4. コード実装
   - 4.1 Firestore へのメール通知データの保存
   - 4.2 Gmail API を用いたメール送信
5. デプロイとテスト
   - 5.1 Firebase Functions のデプロイ
   - 5.2 Firestore にデータを追加し通知を確認
6. まとめ

## 1. はじめに

Gmail APIとFirestoreを組み合わせることで、特定のイベントが発生したときにメールで通知するシステムを構築できます。本記事では、Firebase Functionsを用いてFirestoreに保存されたデータをトリガーにし、Gmailを通じて通知メールを送信する方法を詳しく解説します。

## 2. 必要なツールとライブラリ

- Firebase (Firestore, Firebase Functions)
- Gmail API
- Node.js 環境
- Google Cloud SDK

## 3. 環境構築

### 3.1 Firebase プロジェクトのセットアップ

まず、Firebase CLIをインストールし、新しいFirebaseプロジェクトをセットアップします。

![img](/mosaic-code.jpg)

TypeScriptを使用する場合、functionsディレクトリ内にTypeScript設定を追加してください。

### 3.2 Gmail API の設定

Google Cloud Consoleでプロジェクトを作成し、Gmail APIを有効にします。OAuth 2.0クライアントを作成し、クライアントIDとシークレットを取得してください。

### 3.3 必要なライブラリをインストール

functionsディレクトリで以下のライブラリをインストールします。

![img](/mosaic-code.jpg)

## 4. コード実装

### 4.1 Firestore へのメール通知データの保存

Firestoreドキュメントの変更をトリガーにしてメール通知を行います。トリガーは以下のように設定します。

![img](/mosaic-code.jpg)

### 4.2 Gmail API を用いたメール送信

Google OAuth2を使ってメールを送信します。以下は、Gmail APIを用いてメールを送信する関数です。

![img](/mosaic-code.jpg)

## 5. デプロイとテスト

### 5.1 Firebase Functions のデプロイ

Firebase CLIを使って、Functionsをデプロイします。

![img](/mosaic-code.jpg)

### 5.2 Firestore にデータを追加し通知を確認

FirestoreコンソールまたはFirestore SDKを使用してnotificationsコレクションにドキュメントを追加すると、メール通知が行われます。

![img](/mosaic-code.jpg)

## 6. まとめ

本記事では、Gmail APIとFirestoreを組み合わせた通知システムを構築する方法を紹介しました。Firestoreに新しいドキュメントが追加されたらメールを送信する、というシンプルな実装ですが、これを応用することで様々な通知システムを構築することができます。是非、試してみてください。 [cv:issue_marketplace_engineer]

# 目次

1. はじめに
2. 必要なツールとライブラリ
3. 環境構築
   - 3.1 Firebase プロジェクトのセットアップ
   - 3.2 Gmail API の設定
   - 3.3 必要なライブラリをインストール
4. コード実装
   - 4.1 Firestore へのメール通知データの保存
   - 4.2 Gmail API を用いたメール送信
5. デプロイとテスト
   - 5.1 Firebase Functions のデプロイ
   - 5.2 Firestore にデータを追加し通知を確認
6. まとめ

## 1. はじめに

Gmail APIとFirestoreを組み合わせることで、特定のイベントが発生したときにメールで通知するシステムを構築できます。本記事では、Firebase Functionsを用いてFirestoreに保存されたデータをトリガーにし、Gmailを通じて通知メールを送信する方法を詳しく解説します。

## 2. 必要なツールとライブラリ

- Firebase (Firestore, Firebase Functions)
- Gmail API
- Node.js 環境
- Google Cloud SDK

## 3. 環境構築

### 3.1 Firebase プロジェクトのセットアップ

まず、Firebase CLIをインストールし、新しいFirebaseプロジェクトをセットアップします。

```bash
npm install -g firebase-tools
firebase login
firebase init functions
```

TypeScriptを使用する場合、functionsディレクトリ内にTypeScript設定を追加してください。

### 3.2 Gmail API の設定

Google Cloud Consoleでプロジェクトを作成し、Gmail APIを有効にします。OAuth 2.0クライアントを作成し、クライアントIDとシークレットを取得してください。

### 3.3 必要なライブラリをインストール

functionsディレクトリで以下のライブラリをインストールします。

```bash
cd functions
npm install firebase-admin firebase-functions googleapis
```

## 4. コード実装

### 4.1 Firestore へのメール通知データの保存

Firestoreドキュメントの変更をトリガーにしてメール通知を行います。トリガーは以下のように設定します。

```typescript
import * as functions from 'firebase-functions';
import * as admin from 'firebase-admin';
import { google } from 'googleapis';

admin.initializeApp();
const db = admin.firestore();

export const sendEmailOnFirestoreWrite = functions.firestore
  .document('notifications/{docId}')
  .onCreate(async (snap, context) => {
    const data = snap.data();
    if (!data || !data.email || !data.message) {
      console.error('Invalid data:', data);
      return;
    }

    // メール送信
    await sendEmail(data.email, data.subject || 'Notification', data.message);
  });
```

### 4.2 Gmail API を用いたメール送信

Google OAuth2を使ってメールを送信します。以下は、Gmail APIを用いてメールを送信する関数です。

```typescript
const { OAuth2 } = google.auth;

const oAuth2Client = new OAuth2(
  'YOUR_CLIENT_ID',
  'YOUR_CLIENT_SECRET',
  'YOUR_REDIRECT_URI'
);

oAuth2Client.setCredentials({ refresh_token: 'YOUR_REFRESH_TOKEN' });

async function sendEmail(to: string, subject: string, message: string) {
  const gmail = google.gmail({ version: 'v1', auth: oAuth2Client });
  
  const email = [
    `To: ${to}`,
    'Content-Type: text/html; charset=utf-8',
    'MIME-Version: 1.0',
    `Subject: =?utf-8?B?${Buffer.from(subject).toString('base64')}?=`,
    '',
    message,
  ].join('\n');

  const res = await gmail.users.messages.send({
    userId: 'me',
    requestBody: {
      raw: Buffer.from(email).toString('base64'),
    },
  });

  console.log('Email sent', res.data);
}
```

## 5. デプロイとテスト

### 5.1 Firebase Functions のデプロイ

Firebase CLIを使って、Functionsをデプロイします。

```bash
firebase deploy --only functions
```

### 5.2 Firestore にデータを追加し通知を確認

FirestoreコンソールまたはFirestore SDKを使用してnotificationsコレクションにドキュメントを追加すると、メール通知が行われます。

```typescript
const firestore = admin.firestore();
firestore.collection('notifications').add({
  email: 'example@example.com',
  subject: 'Test Notification',
  message: 'This is a test notification.',
});
```

## 6. まとめ

本記事では、Gmail APIとFirestoreを組み合わせた通知システムを構築する方法を紹介しました。Firestoreに新しいドキュメントが追加されたらメールを送信する、というシンプルな実装ですが、これを応用することで様々な通知システムを構築することができます。是非、試してみてください。 

目次

続きを読むには単価診断を受けてください（30秒）