我正在使用strapi和next.js，我首先能够获取数据，但当我在strapi中更改数据时，数据不会更新

yqlxgs2m 于 12个月前发布在其他

关注(0)|答案(1)|浏览(93)

我使用的是strapi和next.js，一开始我可以获取数据，但是当我在strapi中更改数据时，数据不会更新。当我第一次构建它时，它会获取数据，我将strapi animport React中的数据从'react'更改;
更新答案

import React from 'react';
import Blogs from './components/Blogs';
import Categories from './components/Categories';
import Image from 'next/image';

async function fetchBlogs() {
    const options = {
        headers: {
            Authorization: `Bearer ${process.env.STRAPI_API_TOKEN}`,
        },
        next: { revalidate: 1 } // Time-based revalidation every hour
    };

    try {
        const res = await fetch("http://127.0.0.1:1337/api/blogs?populate=*", options);
        const response = await res.json();
        return response;
    } catch (err) {
        console.error(err);
    }
}

async function fetchCategories() {
    const options = {
        headers: {
            Authorization: `Bearer ${process.env.STRAPI_API_TOKEN}`,
        },
        next: { revalidate: 1 } // Time-based revalidation every hour
    };

    try {
        const res = await fetch("http://127.0.0.1:1337/api/categories", options);
        const response = await res.json();
        return response;
    } catch (err) {
        console.error(err);
    }
}

export default async function Home() {
    const categories = await fetchCategories();
    const blogs = await fetchBlogs();

    return (
        <div> 
            <Categories categories={categories} />
            <Blogs blogs={blogs} />
        </div>
    );
}

字符串

next.js

来源：https://stackoverflow.com/questions/77755522/im-using-strapi-and-next-js-im-able-fetch-data-at-first-but-when-i-change-data

1条答案

按热度按时间

5w9g7ksd1#

默认情况下，在Next.js中使用fetch也会填充该高速缓存，该缓存将被后续请求重用以优化网络使用。即使数据在后端发生变化，Next.js也会默认首先使用该高速缓存，这意味着它会显示之前获取的数据。
有一些方法可以手动刷新你的数据，无论是基于事件（例如刷新按钮）还是基于时间。我邀请你阅读这里的文档。
基于时间的示例：

fetch('https://...', { next: { revalidate: 3600 } })

字符串
手动触发示例：

export default async function Page() {
  const res = await fetch('https://...', { next: { tags: ['collection'] } })
  const data = await res.json()
  // ...
}

// In another file
'use server'
 
import { revalidateTag } from 'next/cache'
 
export default async function action() {
  revalidateTag('collection')
}

型
或者，您可以在必要时完全退出缓存。
附注：你把Bearer拼错了，写成了Berer。

赞(0）回复(0）举报 12个月前

我来回答

我正在使用strapi和next.js，我首先能够获取数据，但当我在strapi中更改数据时，数据不会更新

1条答案

相关问题

热门标签

最新问答