GitHub API数据更新后，Next.js项目接口未同步问题求助

你的问题根源在于：GitHub API 的 /users/:username/repos 接口默认不会返回topics字段，必须通过请求头指定特定媒体类型才能获取该字段。

你的代码中只添加了授权头，没有设置Accept头，所以返回的仓库数据里根本没有topics属性，导致过滤条件repo.topics && repo.topics.length > 0 && repo.topics.includes("tailwindcss")不成立，pomodoro仓库被过滤掉了。而Postman能拿到数据，是因为Postman默认或你手动设置了正确的Accept头。

修复步骤 #

修改你的getRepos函数，在请求头中添加Accept: application/vnd.github.v3+json（这是GitHub API v3的标准媒体类型，会返回topics字段）：

const GITHUB_TOKEN = process.env.NEXT_PUBLIC_GITHUB_ACCESS_TOKEN;

export default async function getRepos() {
try {
    const response = await fetch("https://api.github.com/users/aritra69/repos",
        {
            headers: {
                Authorization: `token ${GITHUB_TOKEN}`,
                Accept: "application/vnd.github.v3+json" // 新增这一行
            },
        }
    );
const repos = await response.json();

    const filteredRepos = Array.isArray(repos)
      ? repos.filter(
          (repo) =>
            repo.topics &&
            repo.topics.length > 0 &&
            repo.topics.includes("tailwindcss")
        )
      : [];
    return filteredRepos;

} catch (error) {
      throw new Error("Failed to fetch repositories");
  }
}

额外优化建议 #

你的ProjectCard组件中，topics的类型定义是[string]，这表示固定长度为1的字符串数组，但仓库的topics可能有多个，建议改成string[]：

type Props = {
  key: number;
  name: string;
  href: string;
  description: string;
  language: string;
  topics: string[]; // 修改这里
};

这样能避免类型错误，适配多主题的场景。

内容的提问来源于stack exchange，提问作者ARITRA69