是否有任何方法可以在NextJS中每秒使用SSR(getServerSideProps)获取API数据?这样客户端每隔一秒就会向服务器发出一个请求,以获取最新的API数据。
有什么想法吗
export const getServerSideProps = async () => {
const res = await fetch(
"https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd&order=market_cap_desc&per_page=100&page=1&sparkline=false"
);
const filteredCoins = await res.json();
return {
props: {
filteredCoins,
},
};
};
字符串
编辑:这是在我的index.js文件中。我仍然需要从组件返回filteredCoins
。
编辑2:
所以我试了这个:
setInterval(() => {
async function fetchCoins() {
const res = await fetch("http://localhost:3000/api/v1/coindata");
const filteredCoins = await res.json();
return {
filteredCoins,
};
}
}, 1000);
型
使用此API路由:
export default async function coindata(req, res) {
const apiData = await fetchData();
res.status(200).json({ data: apiData });
}
async function fetchData() {
const resp = await fetch(
"https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd&order=market_cap_desc&per_page=100&page=1&sparkline=false"
);
const data = resp.json();
return data;
}
型
1条答案
按热度按时间qfe3c7zg1#
按照目前的设置方式,您需要每秒重新加载用户浏览器。相反,您应该创建一个API路由,并通过
setInterval
从前端查询该API路由,该API路由可以具有与您的getServesideProps
几乎相同的代码,但它不会返回对象,而是将数据与响应一起发回。了解the docs中的next.js API路由