」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 建立專業的電子郵件服務:Gmail OAuth Express + Webhooks

建立專業的電子郵件服務:Gmail OAuth Express + Webhooks

發佈於2024-11-03
瀏覽:533

电子邮件通知对于现代 Web 应用程序至关重要。在本指南中,我们将使用 Express.js 和 Gmail 的 OAuth2 身份验证构建安全的电子邮件通知服务。我们的服务将接受 webhook 请求并根据传入数据自动发送电子邮件。

我们正在建设什么

我们将创建一个 Express 服务器:

  • 通过 POST 请求接收 webhook 数据
  • 使用 OAuth2 通过 Gmail 进行身份验证
  • 根据 webhook 负载发送自定义电子邮件
  • 优雅地处理错误

先决条件

  • Node.js 安装在您的计算机上
  • 启用 Gmail API 的 Google Cloud Console 项目
  • OAuth2 凭据(客户端 ID、客户端密钥、刷新令牌)
  • Express.js 和 async/await 的基本了解

项目设置

首先,安装所需的软件包:

npm install express body-parser nodemailer googleapis dotenv

使用您的凭据创建 .env 文件:

CLIENT_ID=your_client_id
CLIENT_SECRET=your_client_secret
REDIRECT_URI=your_redirect_uri
REFRESH_TOKEN=your_refresh_token
[email protected]

如果您在设置这些凭据时遇到任何困难,就像我一样,您可以按照以下步骤操作...

第 1 步:创建新的 Google Cloud 项目:

一个。转到 https://console.cloud.google.com/
b.单击页面顶部的项目下拉列表
c.点击“新建项目”
d.输入项目名称,点击“创建”

Build a Professional Email Service: Gmail OAuth Express   Webhooks

第 2 步:启用 Gmail API:
一个。在左侧边栏中,转到“API 和服务”>“库”
b.搜索“Gmail API”
c.点击“Gmail API”,然后点击“启用”

Build a Professional Email Service: Gmail OAuth Express   Webhooks


第 3 步:配置 OAuth 同意屏幕:
一个。转到“API 和服务”>“OAuth 同意屏幕”
b.选择“外部”作为用户类型,然后单击“创建”
c.填写必填字段:
- 应用程序名称:[您的应用程序名称]
- 用户支持电子邮件:[您的电子邮件]
- 开发者联系信息:[您的电子邮件]
d.点击“保存并继续”
e.在“范围”页面上,单击“添加或删除范围”
f.查找并选择“https://mail.google.com/”范围
g。单击“更新”,然后单击“保存并继续”
h.在“测试用户”页面,点击“添加用户”
我。添加您的 Gmail 地址并点击“保存并继续”
j。查看摘要并单击“返回仪表板”


第 4 步:创建 OAuth2 凭据:
一个。转到“API 和服务”>“凭据”
b.单击“创建凭据”>“OAuth 客户端 ID”
c.选择“Web应用程序”作为应用程序类型
d.名称:[您的应用名称]
e.授权的 JavaScript 来源:添加服务器的域(例如,用于本地开发的 http://localhost:3000)
Build a Professional Email Service: Gmail OAuth Express   Webhooks
f.授权重定向 URI:
- 添加:https://developers.google.com/oauthplayground
- 添加服务器的回调 URL(如果有的话)(例如,http://localhost:3000/auth/google/callback)
g。点击“创建”
h.弹出窗口将显示您的客户端 ID 和客户端密钥。安全地保存这些。


第五步:获取新的刷新令牌:
一个。转到 https://developers.google.com/oauthplayground/

Build a Professional Email Service: Gmail OAuth Express   Webhooks

b.单击右上角的齿轮图标(如设置)
c.单击复选框“使用您自己的 OAuth 凭据”
d.输入您的新客户端 ID 和客户端密钥
e.关闭设置
f.在左侧边栏中,找到“Gmail API v1”
g。选择 https://mail.google.com/
h.点击“授权API”
我。选择您的 Google 帐户并授予请求的权限
j。在下一个屏幕上,单击“将授权码兑换为令牌”
k.从响应中复制“刷新令牌”

如果您在此过程中或测试电子邮件功能时遇到任何问题,请提供您在评论中看到的具体错误消息或行为。


代码解释

我们来一步步分解实现:

1. 初始设置和依赖关系

const express = require("express");
const bodyParser = require("body-parser");
const nodemailer = require("nodemailer");
const { google } = require("googleapis");
require("dotenv").config();

const app = express();
app.use(bodyParser.json());

这部分设置我们的 Express 服务器并导入必要的依赖项。我们使用 body-parser 来解析 JSON 请求,并使用 dotenv 来管理环境变量。

2.OAuth2配置

const oAuth2Client = new google.auth.OAuth2(
  CLIENT_ID,
  CLIENT_SECRET,
  REDIRECT_URI
);
oAuth2Client.setCredentials({ refresh_token: REFRESH_TOKEN });

我们使用 Google 的身份验证库创建 OAuth2 客户端。这可以使用 Gmail 的 API 处理令牌刷新和身份验证。

3. 邮件发送功能

async function sendEmail(webhookData) {
  const {
    receiver_email, //change data based on your needs
  } = webhookData;

  try {
    const accessToken = await oAuth2Client.getAccessToken();
    const transport = nodemailer.createTransport({
      service: "gmail",
      auth: {
        type: "OAuth2",
        user: process.env.EMAIL_USER,
        clientId: CLIENT_ID,
        clientSecret: CLIENT_SECRET,
        refreshToken: REFRESH_TOKEN,
        accessToken: accessToken,
      },
    });

    const mailOptions = {
      from: `Your Name `,
      to: receiver_email,
      subject: ``, //Add Subject of Email
      html: ``, // Add your HTML template here
    };

    return await transport.sendMail(mailOptions);
  } catch (error) {
    console.error("Error in sendMail function:", error);
    throw error;
  }
}

该函数:

  • 从webhook负载中提取数据,您可以根据需要修改负载
  • 获取新的访问令牌
  • 使用 OAuth2 身份验证创建传输
  • 发送包含自定义内容的电子邮件

4.Webhook端点

app.post("/webhook", async (req, res) => {
  try {
    const webhookData = req.body;
    await sendEmail(webhookData);
    res.status(200).send("Email sent successfully");
  } catch (error) {
    console.error("Error processing webhook:", error);
    res.status(500).send("Error processing webhook");
  }
});

我们的 webhook 端点:

  • 接收POST请求
  • 处理 webhook 数据
  • 发送电子邮件
  • 返回适当的响应

测试

使用curl或Postman测试您的webhook:

curl -X POST http://localhost:4000/webhook \
-H "Content-Type: application/json" \
-d '{
  "receiver_email": "[email protected]",
}'

故障排除

常见问题及解决方案:

  1. 身份验证错误:检查您的 OAuth2 凭据
  2. 令牌过期:确保刷新令牌有效
  3. 缺少数据:验证 webhook 有效负载

结论

您现在拥有一个安全的、OAuth2验证的电子邮件通知系统!此实现为构建更复杂的通知系统提供了坚实的基础,同时保持安全性和可靠性。

希望这篇文章对您设置电子邮件服务有用。

编码愉快! ?

版本聲明 本文轉載於:https://dev.to/yashrajxdev/build-a-professional-email-service-gmail-oauth2-express-webhooks-2gp8?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>
  • 為什麼 Visual Studio 2010 中 x86 和 x64 的浮點運算不同?
    為什麼 Visual Studio 2010 中 x86 和 x64 的浮點運算不同?
    x86 與x64 之間的浮點算術差異在Visual Studio 2010 中,x86 與x64 版本之間的浮點算術存在明顯差異當比較某些表達式的值時出現。這種差異體現在以下程式碼:float a = 50.0f; float b = 65.0f; float c = 1.3f; float d =...
    程式設計 發佈於2024-11-15
  • 如何提高帶有通配符的 MySQL LIKE 運算子的效能?
    如何提高帶有通配符的 MySQL LIKE 運算子的效能?
    MySQL LIKE 運算子最佳化MySQL LIKE 運算子最佳化問題:使用萬用字元(例如'%test% ')?答案: 是的,在查詢中使用特定模式時,MySQL 可以最佳化LIKE 運算子的效能。 前綴通配符: 如果您的查詢類似於 foo LIKE 'abc%' 或...
    程式設計 發佈於2024-11-15
  • 如何使用 PHP 透過 POST 向外部網站發送資料?
    如何使用 PHP 透過 POST 向外部網站發送資料?
    在PHP 中透過POST 重新導向並傳送資料在PHP 中,您可能會遇到需要將使用者重新導向到外部的情況網站並透過POST 將資料傳遞到該網站。與 HTML 表單不同,PHP 本身並不支援此行為。 GET 與POST在Web 開發中,有兩種​​主要方法用於從來源發送資料到目的地: GET:資料作為查詢...
    程式設計 發佈於2024-11-15
  • 大批
    大批
    方法是可以在物件上呼叫的 fns 數組是對象,因此它們在 JS 中也有方法。 slice(begin):將陣列的一部分提取到新數組中,而不改變原始數組。 let arr = ['a','b','c','d','e']; // Usecase: Extract till index ...
    程式設計 發佈於2024-11-15
  • 在 Go 中使用 WebSocket 進行即時通信
    在 Go 中使用 WebSocket 進行即時通信
    构建需要实时更新的应用程序(例如聊天应用程序、实时通知或协作工具)需要一种比传统 HTTP 更快、更具交互性的通信方法。这就是 WebSockets 发挥作用的地方!今天,我们将探讨如何在 Go 中使用 WebSocket,以便您可以向应用程序添加实时功能。 在这篇文章中,我们将介绍: WebSoc...
    程式設計 發佈於2024-11-15
  • Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta:列偏移的刪除和恢復Bootstrap 4 在其Beta 1 版本中引入了重大更改柱子偏移了。然而,隨著 Beta 2 的後續發布,這些變化已經逆轉。 從 offset-md-* 到 ml-auto在 Bootstrap 4 Beta 1 中, offset-md-*...
    程式設計 發佈於2024-11-15
  • 如何使用 GCC 捕捉 Linux 中的分段錯誤?
    如何使用 GCC 捕捉 Linux 中的分段錯誤?
    捕獲Linux 中的分段錯誤問:我在第三方庫中遇到分段錯誤,但我無法解決根本問題。是否有跨平台或特定於平台的解決方案來使用 gcc 捕獲 Linux 中的這些錯誤? A:Linux 允許將分段錯誤作為異常處理。當程式遇到此類故障時,它會收到 SIGSEGV 訊號。透過設定訊號處理程序,您可以攔截此訊...
    程式設計 發佈於2024-11-15
  • 如何在不建立實例的情況下存取Go結構體的類型?
    如何在不建立實例的情況下存取Go結構體的類型?
    在不創建物理結構的情況下訪問Reflect.Type在Go 中,動態加載問題的解決方案需要訪問結構的類型,而無需物理創建它們。雖然現有的解決方案要求在類型註冊之前建立結構體並清除零,但有一種更有效的方法。 人們可以利用 reflect.TypeOf((*Struct)(nil)).Elem()手術。...
    程式設計 發佈於2024-11-15
  • Java中如何有效率地將整數轉換為位元組數組?
    Java中如何有效率地將整數轉換為位元組數組?
    Java 中整數到位元組數組的高效轉換將整數轉換為位元組數組可用於多種目的,例如網路傳輸或資料儲存。有多種方法可以實現此轉換。 ByteBuffer 類別:一個有效的方法是使用 ByteBuffer 類別。 ByteBuffer 是一個儲存二進位資料並提供各種操作來操縱它的緩衝區。使用 ByteBu...
    程式設計 發佈於2024-11-15
  • 如何在 Go 中按多個欄位對結構體切片進行排序?
    如何在 Go 中按多個欄位對結構體切片進行排序?
    按多個欄位對切片物件進行排序依多個條件排序考慮以下Parent 和Child 結構:type Parent struct { id string children []Child } type Child struct { id string }假設我們有一個帶有...
    程式設計 發佈於2024-11-15
  • Qt 線程與 Python 線程:我應該在 PyQt 應用程式中使用哪個?
    Qt 線程與 Python 線程:我應該在 PyQt 應用程式中使用哪個?
    PyQt 應用程式中的線程:Qt 線程與Python 線程尋求使用PyQt 創建響應式GUI 應用程式的開發人員經常遇到到執行的挑戰長時間運行的任務而不影響UI 的功能。一種解決方案是使用單獨的執行緒來完成這些任務。這就提出了使用 Qt 執行緒還是原生 Python 執行緒模組的問題。 Qt 執行緒...
    程式設計 發佈於2024-11-15
  • 為什麼我的PHP提交按鈕沒有觸發回顯和表格顯示?
    為什麼我的PHP提交按鈕沒有觸發回顯和表格顯示?
    PHP 提交按鈕困境:不可用的回顯和表格您的程式碼打算在點擊「提交」按鈕時顯示回顯和表格在PHP 表單上。但是,您遇到了這些元素仍然隱藏的問題。這是因為您使用 if(isset($_POST['submit'])) 來控制這些元素的顯示,但提交按鈕缺少 name 屬性。 解決方案:提...
    程式設計 發佈於2024-11-15
  • 為什麼我的 @font-face EOT 字型無法在 Internet Explorer 中透過 HTTPS 載入?
    為什麼我的 @font-face EOT 字型無法在 Internet Explorer 中透過 HTTPS 載入?
    @font-face EOT 無法透過HTTPS 載入:解決方案在Internet 中與@font-face EOT 檔案在Internet 中無法透過HTTPS 載入的問題在Explorer 版本7、8 和9 中,使用者發現無論HTTPS 上包含的HTML 頁面的託管狀態如何,問題仍然存在。經過實...
    程式設計 發佈於2024-11-15
  • 為什麼透過 Makefile 運行 Go 程式時出現「權限被拒絕」錯誤?
    為什麼透過 Makefile 運行 Go 程式時出現「權限被拒絕」錯誤?
    權限被拒絕:調查「go run」和Makefile 呼叫之間的差異透過Makefile 執行Go 程式時遇到權限被拒絕錯誤可能會令人困惑。此問題源自於 GNU make 或其 gnulib 元件中的錯誤。根本原因在於系統 PATH 中存在一個名為「go」的目錄,該目錄位於實際 Go 執行檔所在的目錄...
    程式設計 發佈於2024-11-15
  • 可以使用 CSS 設計 SVG 背景圖片嗎?
    可以使用 CSS 設計 SVG 背景圖片嗎?
    您可以使用 CSS 設計 SVG 背景圖片嗎? 作為 SVG 愛好者,您精通將 SVG 用作背景圖像。然而,仍然存在一個持續存在的問題:您是否也可以在同一個檔案中使用 CSS 設計 SVG 樣式? 遺憾的是,答案是不。用作背景圖片的 SVG 被視為與 CSS 樣式表隔離的單一實體。 CSS 檔案中的...
    程式設計 發佈於2024-11-15

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3