2

我正在使用新的 next/image 组件从 digitaloceanspaces 加载头像图像,如下所示:

import Image from "next/image";

...

<Image
   layout="fill"
   quality={1}
   loader={avatarLoader}
   src="839e7be6-1d2d-4164-bd33-befc3a7613c6_1610115441"
/>

加载程序如下所示:

export const avatarLoader = ({ src, width, quality }: ImageLoaderProps) => {
  return `https://donout.ams3.digitaloceanspaces.com/${src}?w=${width}&q=${quality || 75}`;
};

但它没有缓存它。我尝试将它添加到我的 next.config

module.exports = {
  async headers() {
    return [
      {
        source: "https://donout.ams3.digitaloceanspaces.com/*",
        headers: [
          {
            key: "Cache-Control",
            value:
              "public, max-age=31536000, s-maxage=31536000, stale-while-revalidate",
          },
        ],
      },
    ];
  },
};

但没有任何工作。谁能告诉我如何从远程网址缓存图像?

4

0 回答 0