如何在 Express.js 中使用 Webhooks

什么是 Webhooks?

Webhooks 是一种自动化通知机制,通过 HTTP 请求从其他应用程序向你的应用程序发送数据,实现两个应用程序之间的信息交流。比如,当某个 Github 仓库有新的提交时,Github 会向指定的 URL 发送 HTTP 请求,你的应用程序就能获取到该提交的详情,进行相关的处理。

Webhooks 的应用场景

Webhooks 的应用场景非常广泛,比如:

  1. 实时更新信息:比如社交网络应用程序,可以通过 Webhooks 实时获取用户发布的内容。
  2. 自动同步数据:比如企业内部系统和电商平台之间,通过 Webhooks 实时同步订单信息。
  3. 自动化部署:比如将代码仓库和服务器进行绑定,当仓库有新的提交时,服务器可以自动部署最新代码。

Webhooks 的实现需要有一个接收 HTTP 请求的服务端程序,这里我们使用 Express.js。下面给出一个简单的示例代码:

----- ------- - -------------------
----- ---------- - -----------------------
----- --- - ----------

-- -- ----------- ---
---------------------------

-- -- -------- ---
---------------------------- ----- ---- -- -
  ----------------- ------ - -------- -----
  ----------------------
  ------------ -------- -----
---

-- -- ------- ----
---------------- -- -- -
  -------------------- ------ --------- -- ---- -------
---

代码说明:

  1. 首先引入 expressbody-parser 模块。
  2. 创建一个 Express 应用程序实例。
  3. 配置 body-parser 中间件,用于解析 HTTP 请求体中的 JSON 格式数据。
  4. 定义 Webhooks 的路由,接收 POST 请求,并输出请求体中的内容。
  5. 启动 Express 应用程序,监听 3000 端口。

Webhooks 的安全性问题

考虑到 Webhooks 的安全性问题,我们需要对接收到的 HTTP 请求进行验证,确认请求是否来自合法的源,请求中的数据是否被篡改。常用的验证方式包括:

  1. 通过 SSL/TLS 协议建立加密通道,保证数据传输过程中的安全性。
  2. 对请求头中的 X-Hub-Signature 字段进行验证,确认请求是否来自 Github,并且请求中的数据是否被篡改。

下面给出加密签名的验证示例代码:

----- ------ - ------------------

-- ----
-------- -------------------- ---- ----- -
  ----- ------- - -------------------------
  -- ---------- -
    ------ ------------- ---- -- --------
  -
  ----- ------ - ------------------ -- ----------
  ----- --------- - ---------------------------
  ----- ---- - ------------------------- --------
  ----- ------ - ------------------- - ----------------------------------- --------
  ----- -------- - ---------------------- --------
  -- ---------------- --- ------------- -- ------------------------------- ---------- -
    ------ ------------- ------------
  -
  ------ -------
-

-- -- -------- --
---------------------------- ---------------- ----- ---- -- -
  ----------------- ------ - -------- -----
  ----------------------
  ------------------------ -------- -----
---

代码说明:

  1. 引入 crypto 模块,用于计算 HMAC 值和比较字符串是否相等。
  2. 定义一个验证签名的中间件函数 verifySignature,计算请求体中的 HMAC 值,比较请求头中的签名和计算出的 HMAC 值是否相等,如果相等则表示请求来自 Github,否则抛出 Invalid signature
  3. 在 Webhooks 的路由中,通过 verifySignature 中间件进行签名验证,如果通过验证则输出请求体中的内容。

总结

以上是介绍了如何在 Express.js 中使用 Webhooks,Webhooks 的应用场景非常广泛,需要注意保障其安全性。希望本文能给大家带来一些有用的指导和帮助。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/64c9edb05ad90b6d04189bba


猜你喜欢

  • ES6 中的字面量函数使用详解

    ES6 中的字面量函数使用详解 在 JavaScript 的 ES6 版本中,新增了一种新的函数定义方式,叫做“字面量函数”。字面量函数可以简化函数的定义,使代码更加简洁易懂,并且可以让开发者更加方便...

    1 年前
  • 解决 Jest 中测试 DOM 元素的 'innerHTML' 出现 'null' 错误

    在使用 Jest 进行前端单元测试时,经常会涉及到对 DOM 元素进行测试。其中,最常用的就是测试 DOM 元素的 innerHTML 属性。但是,有时候在测试中会出现 'null' 错误,导致测试失...

    1 年前
  • React Hooks 实现登录授权功能

    在前端开发中,登录授权是一个必不可少的功能。而针对于 React,Hooks 技术可以极大地简化代码并且增强组件的可重用性。本文将介绍如何使用 React Hooks 实现登录授权功能。

    1 年前
  • CSS Reset 之 normalize.css 简析

    在前端开发中,经常会遇到浏览器之间的兼容性问题。其中一个常见的问题就是浏览器默认样式的不同,导致网页在不同浏览器中显示效果不一致。为了解决这个问题,前端开发者们开发了各种 CSS Reset 工具。

    1 年前
  • 使用 babel-plugin-transform-runtime 避免 babel-runtime 在每个文件中生成垃圾代码

    在前端开发中,babel 是一个非常常用的工具,它可以将 ES6+ 的代码转换为可以在当前浏览器上运行的代码,也可以将 JSX 转换为一般的 JavaScript 代码。

    1 年前
  • ES7 async/await 功能的详细介绍及实际使用案例

    异步编程是 JavaScript 中一个非常重要的概念,而在 ES7 中,添加了 async/await 这一新特性,以更加简单和可控的方式来处理异步操作。本文将详细介绍 async/await 的语...

    1 年前
  • MongoDB 中的全文检索优化方法

    在大数据时代,数据量的增加给全文检索带来了新的挑战。MongoDB 作为一个颇为流行的数据库,在提供完整的文本检索功能的同时,也面临着检索效率低下的问题。本文将介绍 MongoDB 中的全文检索优化方...

    1 年前
  • SASS 中 @at-root 与规则插入

    在前端开发中,使用 CSS 预处理器可以提高开发效率和代码可维护性。SASS 作为其中的一种领先者,已经成为了众多开发者的首选。本文将介绍 SASS 的一个重要特性 @at-root 和规则插入功能,...

    1 年前
  • 实现 CSS Grid 布局的最佳实践

    CSS Grid 布局是一种用于设计响应式网格的强大工具。可以用于设计方便易用的布局,从而使网站看起来更加专业和有条理性。本文将为您介绍如何实现最佳实践的 CSS Grid 布局。

    1 年前
  • webpack配置中的 devServer 详解

    在前端开发中,Webpack 是一个很常用的工具。它可以将多个 JS 文件打包合并为一个文件,也可以转换 JSX 和 ES6 代码为浏览器可以识别的代码。除此之外,Webpack 还有一个非常重要的功...

    1 年前
  • TypeScript 中的装饰器使用教程

    装饰器是 TypeScript 中的一种特殊语法,它可以在类和类的属性和方法上添加一些特殊的元数据。TypeScript 的装饰器是以 @ 符号为前缀的一个函数,它可以被附加到类的声明、方法、属性或参...

    1 年前
  • 解决在 Node.js 中使用 ES11 的 import/export 模块语法的问题

    在 ES6 中引入了 import/export 语法,让 JavaScript 模块化开发变得更加方便和标准化。然而,这些语法在 Node.js 中使用时会出现一些问题,例如无法直接使用 impor...

    1 年前
  • 错误汇总:如何处理 ESLint 带来的语法提示

    错误汇总:如何处理 ESLint 带来的语法提示 作为一名前端开发人员,我们都知道 ESLint 是一个非常有用的工具,可以在编码的过程中为我们提供语法错误、拼写错误等提示,能够大大减少我们代码中的错...

    1 年前
  • 使用 RxJS 实现 Redux middleware

    使用 RxJS 实现 Redux middleware 在前端开发中,Redux 是一种流行的数据管理库,它可以帮助我们管理应用程序的状态数据。同时,Redux 提供了 middleware 的功能,...

    1 年前
  • 解决无障碍设备中视频播放等模块存在的问题

    背景 在现代化的移动互联网时代,视频播放已经成为了重要的信息传播方式,然而,我们的视觉系统只是人类感知能力的一个方面。全球有超过1.3亿人处于不同种类的失聪或失明状态,这些人在使用电脑或移动设备时也需...

    1 年前
  • Chai 如何断言一个函数是否返回了一个 Promise

    背景介绍 前端测试是保证软件质量的关键步骤之一。随着前端技术的发展,前端测试也越来越重要。而断言是测试中的核心步骤,它是用来确认一个结果是否符合预期。在前端测试中,使用 Chai 断言库可以方便地进行...

    1 年前
  • Redux 源码阅读笔记——applyMiddleware

    Redux 是一种强有力的状态管理器,可以为中大型应用程序提供可预测的状态管理机制。Redux 的核心代码非常小巧,也非常明晰,但是其实现过程可以比较复杂。 其中,Redux 的 applyMiddl...

    1 年前
  • Android Material Design 中实现多种 Header 样式

    随着 Android Material Design 的不断发展,Header 样式在应用中扮演了非常重要的角色,不仅仅是提供应用标题的作用,而且还有着丰富、多样化的样式,让应用更加美观、用户友好。

    1 年前
  • Redis 架构设计与实现方法的详解

    简介 Redis 是一个内存数据库,拥有极高的性能和可靠性,在前端领域中应用广泛。Redis 将所有数据保存在内存中,读写速度非常快,同时支持多种数据结构,配合良好的持久化方案,使得 Redis 在数...

    1 年前
  • 如何用 PWA 技术实现可离线的电子商务网站?

    前言 近年来,随着移动端设备的普及,手机成为了人们生活中不可或缺的工具之一。同时,人们对于网站性能和用户体验的要求也越来越高。因此,一种名为“渐进式Web应用程序(PWA)”的技术逐渐兴起。

    1 年前

相关推荐

    暂无文章