比较 Wayne.js 与 Express.js 的服务工作线程路由

在本文中,我们将描述如何将简单的 REST API 从 Express.js 导出到 Wayne.js。 我们不只是改变一个框架;而是改变一个框架。 我们将从云范式转换为边缘范式。 Express.js 是一个简单的 Web 服务器,旨在容纳 REST API ,并且在较小的规模上,它再现了在云设置中的服务器上执行 REST API 工作负载的概念。 Wayne.js 是一个小工具包,允许您在浏览器中组装 REST API。

令人惊讶的是,如今您可以看到不同的设计范例将阐述推向两个不同的方向。 可以理解这两种截然不同的愿景仍然有意义。 的概念 我指的是边缘计算 和 云计算 ,它们是决定系统大部分计算在何处执行的完全不同的方法。 在云计算中,计算是在云中进行的。 在边缘计算中,工作负载在边缘设备上执行,例如在用户的 PC、移动电话等上运行的浏览器。

我准备了一个 包含三个目录的GitHub 存储库 ,以便更好地理解这些机制。 首先, basic目录包含 Service Worker 的基本实现,让我们探索它提供的简单机制。 第二个目录是 simple-express,一个使用 Express.js 和 Node.js 实现的简单 REST API。 这将是我们的参考实现,我将向您展示如何将其迁移到 Wayne.js。 第三个目录是 Wayne目录,其中包含 REST API 的 Wayne.js 版本。

跳跃前进:

  • 什么是 Wayne.js?

  • 将 REST API 从 Express.js 迁移到 Wayne.js

  • 比较 Wayne.js 和 Express.js

什么是 Wayne.js?

Wayne.js 旨在在浏览器中运行的 Service Worker 中实现 HTTP 服务器。 服务工作人员在浏览器内托管简单的代理机制,如何修复Windows 11上的ntoskrnl.exe BSOD错误(8种最佳方法)以控制浏览器和云之间的流量,特别是在没有互联网访问或互联网访问不可用的情况下。 的概念 Wayne.js 利用服务工作者 来托管比简单代理机制更具表现力的东西。

Wayne.js 在服务工作线程中使用 Express.js 的确切语义来实现直接在浏览器中运行的 REST API。 使用 Service Worker 很简单,它由安装它们的代码及其实现的逻辑组成。 安装 Wayne.js 的代码非常简单。

安装 Wayne.js

首先,检查该设备的可用性 serviceWorker容器中的 navigator目的。 如何在 Windows 11/10 上备份和恢复驱动程序这是必需的,因为它可能在较旧的浏览器或隐私浏览模式下不可用:

if ('serviceWorker' in navigator) {
 navigator.serviceWorker.register('/sw.js').then(function (registration) { 
  console.log('Service Worker installation success! Scope:',
   registration.scope);
 }).catch(function (error) {
  console.log('Service Worker installation failed:', error);
 });
}

这 serviceWorker介绍了 register方法告诉浏览器要为 Service Worker 的逻辑实现哪个 JavaScript 文件。 这是一个示例,显示了 sw.js文件:

self.addEventListener('install', event => {
    console.log("Service Worker Installed");
});
​
self.addEventListener('activate', event => {
    console.log("Service Worker Activated");
});
​
self.addEventListener('fetch', event => {
    console.log("Requested URL: " + event.request.url);
});

如您所见,它将在 Service Worker 生命周期的每个事件上打印一条消息。 第一个活动是 install,这对于服务工作人员所需的一次性初始化很有帮助。

激活 Wayne.js

第二件事在服务人员的一生中只会发生一次。 这不同于 install因为不是每次安装新版本的 Service Worker 时都会触发, activate仅当第一次安装 Service Worker 时才会被触发。 这是因为以前版本的 Service Worker 已经在运行。

要强制激活新版本的 Service Worker,如何在 Windows 11 上录制屏幕(4 种方法)您可以要求浏览器在每个页面上安装并激活,重新加载以始终运行最新版本。 例如,Google Chrome 中的“重新加载更新”复选框位于开发人员窗口的“应用程序”选项卡中。 开发 Service Worker 的一个好的经验法则是始终检查您是否正在运行最新版本,甚至卸载并重新安装它,以确保这一点。 当事情无法正常工作时,这可以避免很多麻烦。

)来提供页面 要检查一切是否正常,请使用您选择的 Web 服务器(我通常使用http-server ,您将在控制台窗口中看到正确触发的事件:

一次 index.html and wayne-service-worker.js提供给浏览器,如何修复“内核安全检查失败”BSOD错误与前端的每次连续交互都将在浏览器中发生,不会在浏览器上产生任何日志 http-server。 这显示了这种方法的真正潜力,因为您甚至可以关闭服务器。 因此,交互和 API 调用永远不会离开浏览器,使您的应用程序即使在离线模式下也能运行:

Wayne.js 和 Express.js 在服务工作线程路由方面的区别之一在于如何 query处理字符串参数。 在 Express.js(右)中,参数用冒号指定,而在 Wayne.js 中,每个参数由大括号定义(右侧第 19 行,左侧第 11 行)。

另一个区别是请求 body立即可用,而在 Wayne.js 中,它是通过 Promise 访问的(左侧第 32 行,右侧第 24 行)。 关于这个机制, 文档 更深入一些。 它提供了各种访问器 body以不同的格式返回它:

  • arrayBuffer(): 为 ArrayBuffer表示

  • blob(): 得到一个非结构化的 Blob请求主体的表示

  • formData(): 为了 FormData处理基于结构化表单的请求

  • json():这可以让你像处理身体一样 JSON

  • text():请求正文最直接的表示,任何进一步的解析都留给您

正如您所看到的,通过这些方法,您将能够处理您希望在 REST API 中处理的所有标准格式。 Wayne 上可用的附加功能是 redirect()允许您将 API 调用重定向到其他端点的操作。 它的工作原理与 Express 中相同,但考虑到浏览器内 API 的不同架构,您可以使用此机制来做一些聪明的事情。

假设您的本地 API 可以在浏览器离线时提供近似结果,并且可以在浏览器再次上线时重定向到同一 API 的更强大版本,这可以通过重定向调用来完成。

(PWA)的正确方法 这是实现渐进式 Web 应用程序 。 这些网络应用程序将在互联网访问受限或缺失的情况下继续工作,并在重新建立连接时无缝工作。

如果您一直关注我到现在,如何修复YouTube视频黑屏问题?通过查看代码应该可以清楚地看出,为 Express.js 或 Wayne.js 编写 REST API 之间没有(显着)差异。 主要区别在于 Wayne.js 允许您直接在浏览器中迁移 REST API,为您的 Web 应用程序/API 组合提供完全不同的架构支持。 这意味着更多的代码在浏览器中执行,将计算推向边缘,并且可以在极端情况下提供更大的灵活性,使您的 Web 应用程序可以在极端条件下(即没有或不可靠的互联网连接)继续工作。

结论

Wayne.js 是一种设计 REST API 及其前端的智能方法,趣知笔记 - 分享有价值的教程!让您可以将任何 REST API 迁移到直接在浏览器中运行,而无需(太多)修改。 本文介绍了如何将简单的 REST API 从 Express.js 导出到 Wayne.js。 这个想法是展示如何在浏览器中运行的 Wayne.js 服务工作线程中实现 REST API。 从更具战略性的角度来看,Wayne.js 可以成为开发 PWA 的一步,该 PWA 将在有限的互联网连接下继续工作。

猜你喜欢

转载自blog.csdn.net/weixin_47967031/article/details/132847602