部署至Vercel后调用GitHub API返回401错误的问题求助

大家好，我开发了一个作品集网站，功能是从GitHub API拉取我的仓库信息并展示在页面上。在本地用localhost运行的时候一切正常，但把代码部署到Vercel之后就一直返回401错误，卡在这里好久了，想请各位帮忙看看问题出在哪！

用于调用GitHub API获取仓库的代码（使用Bearer令牌认证） #

这部分是我写的API路由，用来从GitHub拉取仓库信息，本地测试正常，部署到Vercel就报401：

const axios = require('axios');
const fetchrepositories = async (url,headers,retries = 3)=>{
try{
const response = await axios.get(url , {headers});
return response.data;
}catch(error){
if(retries > 3 && error.response?.status === 403){
console.warn(`Rate limit reached. Retrying in 60 seconds...`);
      await new Promise(resolve => setTimeout(resolve, 60000)); // Wait 60 seconds
      return fetchRepositories(url, headers, retries - 1);
}throw error;
  }
};
module.exports = async (req, res) => {
  const username = 'coderanik'; // Replace with the GitHub username
  const apiUrl = `https://api.github.com/users/${username}/repos?sort=created&direction=desc`;

  const GITHUB_TOKEN = process.env.GITHUB_TOKEN || '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'; 

  try {
    const response = await axios.get(apiUrl, {
      headers: {
        Authorization: `token ${GITHUB_TOKEN}` // Optional for higher rate limits
      }
    });

    // Return only the top 6 repositories
    const recentRepos = response.data.slice(0, 6);
    res.status(200).json(recentRepos);
  } catch (error) {
    console.error('Error fetching repositories:', error.message);
    res.status(error.response?.status || 500).json({ error: 'Failed to fetch repositories' });
  }
};

前端调用API并渲染仓库的代码 #

这部分是前端页面用来请求上述API并渲染仓库列表的代码：

async function fetchRepositories() {
  try {
    const response = await fetch('/api/repositories'); // Calls the serverless function
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    const repos = await response.json();
    renderRepositories(repos);
  } catch (error) {
    document.getElementById('repositories').innerHTML = `<p>Error fetching repositories: ${error.message}</p>`;
    console.error("Failed to fetch repositories:", error.message);
  }
}

function renderRepositories(repos) {
  const repoContainer = document.getElementById('repositories');
  repoContainer.innerHTML = ''; // Clear the loading message

  repos.forEach(repo => {
    const repoElement = document.createElement('div');
    repoElement.className = 'repo';
    repoElement.innerHTML = `
      <h3>${repo.name}</h3>
      <p>Created At: ${new Date(repo.created_at).toLocaleString()}</p>
      <p>Language: ${repo.language || 'Not specified'}</p>
      <button onclick="window.open('${repo.html_url}', '_blank')">View on GitHub</button>
    `;
    repoContainer.appendChild(repoElement);
  });
}

fetchRepositories();

本地服务器启动代码 #

这是我本地用来启动服务的Express代码：

const express = require('express');
const path = require('path');
const app = express();

// Serve static files
app.use(express.static(path.join(__dirname, 'public')));

// API routes
app.use('/api/repositories', require('./api/repositories'));

// Start server
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});

备注：内容来源于stack exchange，提问作者Anik Das