bounty还有2天到期。此问题的答案有资格获得+50声望奖励。Gokhan Celikkaya希望引起更多的注意这个问题。
我正在使用NextJS 13进行一个React项目,我在使用request memoization
for fetch
时遇到了问题。它总是发送请求到后端,即使在同一个请求。
我在http://localhost:8088/test
上有一个简单的端点,它只记录一些东西来检查是否收到请求。下面是我的page.tsx
代码。当我重新加载页面时,我在后端服务器中看到4个日志; 2来自元数据2来自页面。即使是完全相同的请求,也不会按照NextJS文档中的说明进行重复数据消除
我在这里遗漏了什么,为什么fetch('http://localhost:8088/test')
实际上被执行了四次。如何使用请求记忆,以便在Page
和generateMetadata
中使用相同的数据,并且此代码只执行一次请求?
import { Metadata } from 'next';
export const dynamic = 'force-static';
export const fetchCache = 'force-no-store';
async function getItem() {
const res = await fetch('http://localhost:8088/test');
return res.json();
}
export async function generateMetadata(): Promise<Metadata> {
getItem();
getItem();
return {
metadataBase: new URL('localhost:3000'),
title: 'test'
};
}
export default async function Page() {
getItem();
getItem();
return (
<>
<p>test</p>
</>
);
}
1条答案
按热度按时间6jjcrrmo1#
应该在
fetch
方法中禁用该高速缓存。请记住,在NextJs中,一切都基于转换,而不是转换:通过使用这种转换,NextJ将理解不缓存该组件中的任何内容。