如何在 NuxtJs SSR 应用程序中将文档/页面缓存到 Vercel Web 服务器答案

【问题标题】：How to cache document/page to Vercel Web Server at NuxtJs SSR app如何在 NuxtJs SSR 应用程序中将文档/页面缓存到 Vercel Web 服务器
【发布时间】：2021-08-11 07:47:45
【问题描述】：

我已经使用 Vercel 设置了一个 SSR NuxtJS 项目，我想将 html 页面文件缓存到 Vercel Web 服务器以获得更好的性能，而不仅仅是为客户端/浏览器缓存添加响应标头。所以我想用content-type: text/html; charset=utf-8缓存每个页面的GET请求（就像here提到的那样，x-vercel-cache: HIT）。

在Vercel Config 中搜索我找不到任何相关内容... 我尝试在 Nuxt 项目中为 ssr 缓存添加一个包 (nuxt-ssr-cache)，但它没有按预期工作。

知道我怎么能做到这一点吗？！？

【问题讨论】：

标签： vue.js caching nuxt.js server-side-rendering vercel

【解决方案1】：

您需要设置响应的标头，以便 CDN 可以了解您要缓存响应。使用 Node.js（原版）：

res.setHeader('Cache-control', 's-maxage=120, stale-while-revalidate);

与vercel.json:

{
  "headers": [
    {
      "source": "/example/:path*",
      "headers" : [
        {
          "key" : "Cache-Control",
          "value" : "s-maxage=120, stale-while-revalidate"
        }
      ]
    }
  ]
}

您可以在Vercel documentation 中阅读有关“vercel.json”的更多信息。

【讨论】：