搜尋

首頁  >  問答  >  主體

如何在產生的靜態檔案中新增快取控制(Nuxt 3)

我正在使用 Nuxt 3 建立 SSR 專案。 我正在考慮將 Cache-Control 標頭新增至 .output/_nuxt 目錄中產生的靜態檔案。

我嘗試了下面的程式碼 server/middleware/cache-control.ts

#
export default defineEventHandler((event) => {
  let res = event.res
  const year = 31536000
  const tenmin = 600
  const url = event.req.url
  const maxage = url.match(/(.+).(jpg|jpeg|gif|css|png|js|ico|svg|mjs)/) ? year : tenmin
  res.setHeader('Cache-Control', `max-age=${maxage} s-maxage=${maxage}`);
})

但是,它不起作用。

如何在產生的靜態檔案中加入Cache-Control

P粉765684602P粉765684602483 天前783

全部回覆(2)我來回復

  • P粉124070451

    P粉1240704512023-11-06 00:30:22

    對於 Nuxt3,我將其用作伺服器中間件 server/middleware/cache-control.js

    #
    export default defineEventHandler((event) => {
      if (process.env.NODE_ENV == "production") {
        const url = event.node.req.url;
        const maxage = url.match(/(.+)\.(jpg|jpeg|gif|png|ico|svg|css|js|mjs)/)
          ? 60 * 60 * 12 * 30
          : 60 * 60;
        appendHeader(
          event,
          "Cache-Control",
          `max-age=${maxage} s-maxage=${maxage}`
        );
      } else {
        appendHeader(event, "Cache-Control", `max-age= s-maxage=`);
      }
    });

    回覆
    0
  • P粉618358260

    P粉6183582602023-11-06 00:03:59

    我自己想辦法。將以下程式碼加入 nuxt.config.js 會將快取控製附加到靜態檔案中。感謝您的支持!

    export default defineNuxtConfig({
      nitro: {
        routeRules: {
          "/img/**": { headers: { 'cache-control': `public,max-age=${year},s-maxage=${year}` } },
          "/_nuxt/**": { headers: { 'cache-control': `public,max-age=${year},s-maxage=${year}` } },
        }
      }
    })
    

    回覆
    0
  • 取消回覆