在TypeScript循环中多次调用API出现500内部服务器错误

核心原因大概率是以下两点之一： #

• API频率限制触发
  很多免费第三方API会限制单位时间内的请求次数，单次调用时请求频率低，不会触发限制；但循环遍历数组时，短时间内连续发起请求，直接超过了服务器允许的请求阈值，服务器就会返回500错误（部分服务会返回标准的429限流码，但也有服务用500兜底）。哪怕你的循环是串行（每次等前一个请求完成再发下一个），如果数组长度大，总请求频率还是会触碰到限制。

• 请求体格式错误
  你当前用模板字符串拼接请求体：

  body: `{
    "url": "${url}"
  }`,
  

  如果某个this.articles[i].url里包含特殊字符（比如双引号、反斜杠、换行符），会直接破坏JSON格式，导致服务器解析请求体失败，返回500错误。单次调用时刚好第一个url没有特殊字符，所以能正常工作；循环到有问题的url时就会出错。

对应的修复方案： #

1. 修复请求体序列化方式
   用JSON.stringify代替手动拼接，自动处理特殊字符，保证JSON格式正确：

   async getBiasedRating(url) {
       const response = await fetch(
         'https://news-bias-detection-api.herokuapp.com/',
         {
           method: 'POST',
           headers: {
             Accept: 'application/json',
             'Content-Type': 'application/json',
           },
           body: JSON.stringify({ url }), // 改用JSON序列化
         }
       );
       const data = await response.json();
       return data;
   }
   

2. 添加请求间隔避免限流
   在循环的每次请求后添加短暂延迟，降低请求频率：

   async setBias() {
       for (let i = 0; i < this.articles.length; ++i) {
         try {
           this.articles[i].result = await this.getBiasedRating(
             this.articles[i].url
           );
           await new Promise(resolve => setTimeout(resolve, 1000)); // 每次请求后等待1秒
         } catch (e) {
           console.error(`处理第${i}条数据出错:`, e); // 记录错误，不中断整个循环
         }
       }
     }
   

3. 优化错误处理
   不要一遇到错误就抛出异常中断整个循环，而是记录错误后继续处理剩余条目，这样能快速定位到具体是哪条数据出了问题。

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