Next.js和Mongoose返回的记录仅有20条,尽管未设置筛选条件。

huangapple go评论61阅读模式
英文:

Next.js mongoose returns only 20 records although no filter is set

问题

I have the problem that when I work with Next.js and the revalidate method /getServerSideProps, my result only ever contains 20 data although there are 112. If I change the whole thing to 'no-store', all 112 data are returned. I use the App Router method.

The strange thing is that in the GET method where the call to mongoose takes place, I can see all the records. However, only 20 in the action.js

app/Products/route.js:

export async function GET(request) {
try {
await mongoConection();
} catch (error) {
console.log(error);
}

const products = await Product.find({}).sort({
createdAt: -1,
});

//Products length = 112
console.log("Products length" + products.length);

return NextResponse.json({ products });
}

app/FetchProducts/action.js:

"use server";

export async function FetchProducts() {
const result = await fetch(${process.env.NEXT_PUBLIC_URL}/Products, {
next: { revalidate: 3 },
});

const expected = await result.json();

//expected length = 20
console.log("expected length: " + expected.products.length);

return expected;
}

app/FetchProducts/page.js:

const fetchProducts = async () => {
setLoadMore(true);

const fetching = await FetchProducts();

// ONLY 20 Result
setResult(fetching.products);

setLoadMore(false);
};

英文:

I have the problem that when I work with Next.js and the revalidate method /getServerSideProps, my result only ever contains 20 data although there are 112. If I change the whole thing to 'no-store', all 112 data are returned. I use the App Router method.

The strange thing is that in the GET method where the call to mongoose takes place, I can see all the records. However, only 20 in the action.js

app/Products/route.js:

export async function GET(request) {
try {
 await mongoConection();
} catch (error) {
 console.log(error);
}

const products = await Product.find({}).sort({
 createdAt: -1,
});

//Products length = 112
console.log("Products length" + products.length);

return NextResponse.json({ products });

}

app/FetchProducts/action.js:

"use server";

export async function FetchProducts() {
const result = await fetch(`${process.env.NEXT_PUBLIC_URL}/Products`, {
 next: { revalidate: 3 },
});

const expected = await result.json();

//expectedlength = 20
console.log("expected length: " + expected.products.length);

return expected;

}

app/FetchProducts/page.js:

 const fetchProducts = async () => {
 setLoadMore(true);

 const fetching = await FetchProducts();

 //ONLY 20 Result
 setResult(fetching.products);

 setLoadMore(false);
};

答案1

得分: 0

这里

> 任何不直接使用fetch的数据获取库都不会影响路由的缓存,而将根据路由段是静态还是动态。

GET路由中,您没有使用fetch,这就是为什么您获取到所有的结果。但在操作中,您使用了fetch,很可能您的第一个fetch请求只返回了20个结果,这些结果被缓存了。

英文:

from here

> Any data fetching libraries that do not use fetch directly will not
> affect caching of a route, and will be static or dynamic depending on
> the route segment

in GET route you are not using fetch. that is why you are getting all the results. but in actions you use fetch and probably your first fetch request returned only 20 and those were cached.

huangapple
  • 本文由 发表于 2023年6月8日 16:49:30
  • 转载请务必保留本文链接:https://go.coder-hub.com/76430130.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定