Node.js 中如何实现缓存控制

AI 编程助手,豆包旗下的编程助手,提供智能补全、智能预测、智能问答等能力,节省开发时间,释放脑海中的创造力,支持 VSCode,点击体验 AI

在 Web 开发中,缓存是提高网站性能的重要手段,通过缓存可以显著减少服务器的响应时间,提升用户体验。对于 Node.js 这种基于 JavaScript 的运行时环境来说,实现缓存控制同样非常重要。

本文将介绍 Node.js 中如何实现缓存控制,包括浏览器缓存和服务器缓存,希望能为前端开发者提供一些指导。本文的主要内容包括:

  1. 什么是缓存控制
  2. 浏览器缓存控制
  3. 服务器缓存控制
  4. 缓存控制实例代码

什么是缓存控制

缓存控制指的是对于网站资源的缓存策略,主要包括两种:浏览器缓存和服务器缓存。

浏览器缓存是指当用户访问某个网站的资源时,例如 JavaScript 文件、CSS 文件、图片等,在第一次请求成功后,下一次再请求同一个资源时,浏览器会先在本地缓存中查找是否已经存在该资源,如果存在,则直接将缓存中的资源返回给用户,从而加快了网站的访问速度。

服务器缓存则是指服务器端对于资源的缓存策略。当用户请求某个资源时,服务器会先判断该资源是否已经被缓存,如果已经被缓存,则直接将缓存的资源返回给用户,从而加快了服务器的响应时间,减轻了服务器的负担。

浏览器缓存控制

浏览器缓存控制主要包括两个方面:

  1. 设置 HTTP 头信息:通过设置 HTTP 头信息中的 Expires和Cache-Control 字段,告诉浏览器该资源的缓存时间。
  2. 修改文件名:通过修改文件名的方式实现缓存控制,例如为静态文件添加版本号,从而避免浏览器缓存。

设置 HTTP 头信息

设置 Expires 和 Cache-Control 字段是比较常见的浏览器缓存控制方式,其中 Expires 告诉浏览器在什么时间之前该资源可以从缓存中获取,Cache-Control 则更加灵活,可以设置更多的参数。

例如,设置一个静态文件的缓存时间为一周:

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

其中,第一行代码设置 Expires 字段,new Date(Date.now() + 604800000).toGMTString() 表示在当前时间的基础上加上一周的毫秒数,转换成 GMT 时间格式。第二行代码设置 Cache-Control 字段,max-age=604800 表示该资源可以缓存的最长时间为一周。

修改文件名

修改文件名也是一个常见的浏览器缓存控制方式,通过添加版本号或者将文件名改为哈希值的方式可以避免浏览器缓存。例如:

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

其中,my-script-1.0.0.js 表示该文件的版本号为 1.0.0,当更新该文件时,只需要将版本号修改为 1.0.1 即可,从而避免了浏览器缓存问题。

服务器缓存控制

服务器缓存控制主要包括两个方面:

  1. 设置 HTTP 头信息:通过设置 HTTP 头信息中的 Expires 和 Cache-Control 字段,告诉浏览器该资源的缓存时间。
  2. 使用缓存中间件:通过使用 Node.js 提供的一些缓存中间件来实现服务器缓存控制。

设置 HTTP 头信息

设置 Expires 和 Cache-Control 字段同样也适用于服务器端缓存控制,例如:

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

其中,第一行代码设置 Expires 字段,new Date(Date.now() + 604800000).toGMTString() 表示在当前时间的基础上加上一周的毫秒数,转换成 GMT 时间格式。第二行代码设置 Cache-Control 字段,max-age=604800 表示该资源可以缓存的最长时间为一周。

使用缓存中间件

Node.js 提供了一些优秀的缓存中间件,例如 memory-cacheexpress-cache-controller 等。这些中间件可以很好地对服务器端的缓存进行控制和管理。

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

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

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

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

在上面的代码中,使用了 express-cache-controller 中间件来实现服务器端的缓存控制。其中,maxAge: 604800 表示资源可以缓存的最长时间为一周。

同时,通过设置 res.cacheControl 可以将某个资源进行缓存,例如上面的例子将获取到的用户数据缓存了 1 小时。

缓存控制实例代码

以下是一个简单的 Node.js 缓存控制实例代码,用于演示浏览器和服务器端的缓存控制。该示例代码会启动一个 Node.js 服务器,当用户访问页面时,会从服务器读取静态文件(例如 CSS 和 JavaScript),并对这些文件进行缓存控制。

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

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

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

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

在上面的代码中,首先使用了 express.static 中间件来指定静态文件所在的目录(public 目录),当用户访问静态文件时,express.static 会自动将文件返回给用户。

同时,通过使用 app.use 中间件来对静态文件进行缓存控制,例如当用户访问 JavaScript 文件时,会自动将该文件的 Expires 和 Cache-Control 字段设置成一周,从而实现浏览器和服务器端的缓存控制。

结论

本文介绍了 Node.js 中如何实现缓存控制,包括浏览器缓存和服务器缓存两个方面。通过设置 HTTP 头信息和使用缓存中间件等方式,可以较好地实现缓存控制,提升网站性能,减轻服务器的负担。在开发过程中,我们应该灵活运用这些技术手段,实现高效的缓存控制,从而提升用户体验。

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


猜你喜欢

  • 在 ES7 中使用 includes 和 startsWith 来判断字符串是否包含特定字符或开头

    在前端开发中,经常需要对字符串进行匹配和处理。ES7 中引入的 includes 和 startsWith 方法,可以方便地判断一个字符串是否包含某个特定的字符或者以某个特定的字符开头。

    8 天前
  • 在 Angular 中解决 “TS2339:属性 'find' 不存在于类型的值上”

    当你在使用 Angular 开发网页应用时,你可能会遇到一些 TypeScript 报错,其中比较常见的一种就是“TS2339:属性 'find' 不存在于类型的值上”。

    8 天前
  • Cypress 测试:如何提高定位器的稳定性?

    前言 在编写前端自动化测试时,正确的元素定位非常重要,而 Cypress 是一个强大的前端自动化测试工具,我们需要掌握一些技巧来确保它的定位函数(如 cy.get())稳定可靠,接下来我们将为大家分享...

    8 天前
  • Hapi 框架的日志记录配置详解

    在前端开发中,日志记录是一个十分重要的环节。Hapi 是 Node.js 的一个开源框架,提供了丰富的插件和工具来简化 web 应用程序的构建和测试。Hapi 框架自带了日志记录功能,并提供了许多配置...

    8 天前
  • Deno 中的缓存管理技术浅析

    前言 Deno 是一个现代化的 JavaScript 和 TypeScript 运行时,具有安全性和高效性,可以用于写后端服务和前端应用。Deno 内置了很多有用的功能,其中缓存管理是其中之一。

    8 天前
  • Vue.js 3.0 + Tailwind 快速搭建网页的方法和技巧

    作为一名前端开发者,我们需要不断寻找和掌握新的技术和工具,以便能够快速高效地开发网页和应用。在本文中,我将向大家介绍如何利用 Vue.js 3.0 和 Tailwind CSS 快速搭建网页的方法和技...

    8 天前
  • 利用 SASS 编写可伸缩的 SVG 图形

    利用 SASS 编写可伸缩的 SVG 图形 SVG 是一种矢量图像格式,它具有良好的可伸缩性和动画性能。在前端开发中,经常会使用 SVG 来展示图标和图形。而在编写 SVG 图形时,使用 SASS 可...

    8 天前
  • Redis 高可用方案选型分析

    前言 Redis 是当前最流行的内存数据库之一,在 Web 开发中有着广泛的应用。但是,随着数据量和访问量的逐渐增大,如何选择合适的高可用方案便显得至关重要。 本文将对 Redis 的高可用方案进行分...

    8 天前
  • Serverless的无服务架构与容器架构的优劣分析

    Serverless架构和容器架构是当今最流行的两种云计算架构。它们都有各自的优点和局限性,但它们都是用于处理前端开发的最佳实践。在本文中,我们将深入研究Serverless框架和容器框架,探讨它们的...

    8 天前
  • 初学者必备的 Docker 术语介绍及常见问题解析

    Docker 是一个开源的容器化平台,以其高度的可移植性和灵活性而在前端开发中广受欢迎。对于初学者来说,了解 Docker 的术语和常见问题非常重要。在本文章中,我将介绍一些 Docker 的术语以及...

    8 天前
  • AngularJS:SPA 应用中的多语言处理方案

    作为一种现代的 web 应用程序设计模式,SPA(Single Page Application,单页面应用程序)越来越受到开发者的欢迎。作为一个 SPA 应用程序,多语言支持是一个重要的功能。

    8 天前
  • 在 Express.js 应用程序中使用 Nodemailer 发送电子邮件的方法

    随着 web 应用程序的普及,有些时候我们需要在我们的应用中集成邮件服务。Nodemailer 是一个流行的 Node.js 库,用于发送电子邮件。在这篇文章中,我将介绍如何在 Express.js ...

    8 天前
  • Vue.js2.0 中 watch 和 computed 的区别及使用

    引言 Vue.js 是一个流行的前端框架,它提供了很多工具让我们轻松地构建交互式的 Web 应用程序。Vue.js 中经常使用 watch 和 computed 来实现数据的双向绑定。

    8 天前
  • ES10 中新增的 Function.toString 方法的应用实践

    ES10 中新增的 Function.toString 方法允许我们获取函数的原始代码字符串表示,包括函数内部的所有内容。这个特性在前端中有很多实用的应用场景,本文将详细探讨这个新特性的使用方法和指导...

    8 天前
  • 解决 Jasmine 无法解析所提供的测试文件 错误

    在 Angular 中,我们使用 Jasmine 来进行单元测试。但是有时候,在运行 Jasmine 进行测试时,你可能会遇到 Jasmine 无法解析所提供的测试文件的错误。

    8 天前
  • 初步掌握 Mark Otto 版的 CSS Reset

    在前端开发过程中,常常遭遇浏览器之间样式差异的问题。这是因为不同浏览器的默认样式表不同,而这些默认样式表会影响我们的页面布局和样式。 为了解决这个问题,CSS Reset 是一种很好的解决方案。

    8 天前
  • ECMAScript 2021 (ES12) 中使用 BigInt 时遇到的常见错误及解决方法

    背景 ECMAScript 2021(ES12)是 JavaScript 语言的最新标准,其中引入了一种新的原始数据类型 BigInt,用于表示更大范围的整数,解决了在之前版本中 Int 型整数的精度...

    8 天前
  • TypeScript 高级类型总结及应用

    在前端开发中,JavaScript 可能是最常用的编程语言之一。虽然它允许我们执行简单的任务,但在处理大型项目时,存在很多困难。TypeScript 作为 TypeScript 的扩展,为开发其提供新...

    8 天前
  • Hapi 框架的资源压缩技巧

    在前端开发中,Web 应用的性能是至关重要的,其中资源压缩是优化性能的一个重要方面。在 Hapi 框架中,我们可以使用多种方式来实现资源压缩,本篇文章将详细介绍其中的方法,并为读者提供深入学习和指导意...

    8 天前
  • 响应式设计中如何优化页面的 SEO 排名?

    在当今的互联网时代,SEO(搜索引擎优化)在网络营销中扮演着至关重要的角色。响应式设计(RWD)是一种越来越流行的设计理念,它可以根据用户的设备大小和分辨率,在不同屏幕上正确地呈现网页内容。

    8 天前

相关推荐

    暂无文章