You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Node.js服务中Fetch请求返回HTML而非JSON内容问题咨询

问题根源

你的服务端逻辑对所有入站请求做了统一处理:无论请求路径是什么,都会返回index.html文件,且响应头固定写死为text/html。当前端发起sites.json的请求时,服务端没有识别这个路径的资源请求,依旧返回HTML内容,自然会出现JSON解析失败、响应内容为HTML的情况。
另外你用setTimeout固定等待3秒再启动服务的逻辑并不稳妥:如果文件写入耗时超过3秒,服务启动时JSON文件还没准备好,前端依然会拉取到异常内容;如果文件写入速度远快于3秒,多余的等待时间毫无必要。

修复代码

直接把服务启动逻辑放到JSON文件写入完成的回调中,同时增加请求路径判断逻辑,根据请求的资源返回对应文件、设置正确的Content-Type:

const http = require('http');
const fs = require('fs');
const path = require('path');

// 替换为你实际要写入的JSON数据
const mockSiteData = ["site1", "site2", "site3"];
fs.writeFile('sites.json', JSON.stringify(mockSiteData), (writeErr) => {
  if (writeErr) {
    console.error('sites.json写入失败:', writeErr);
    process.exit(1);
  }

  const server = http.createServer((req, res) => {
    // 映射请求路径到实际文件
    let targetPath = req.url;
    if (targetPath === '/') targetPath = '/index.html';
    const fullPath = path.join(__dirname, targetPath);
    const fileExt = path.extname(fullPath);

    // 匹配对应资源的响应头
    const contentTypeMap = {
      '.html': 'text/html',
      '.json': 'application/json',
      '.css': 'text/css',
      '.js': 'text/javascript'
    };
    const resContentType = contentTypeMap[fileExt] || 'application/octet-stream';

    // 读取目标文件返回
    fs.readFile(fullPath, (readErr, fileData) => {
      if (readErr) {
        res.writeHead(404, { 'content-type': 'text/plain' });
        res.end('404 Not Found');
        return;
      }
      res.writeHead(200, { 'content-type': resContentType });
      res.end(fileData);
    });
  });

  server.listen(3000, () => {
    console.log('Server is running on http://localhost:3000/');
  });
});
优化建议
  • 如果后续需要托管的静态文件类型、数量较多,不需要手写静态资源匹配逻辑,可以直接使用成熟的静态服务依赖减少重复代码。
  • 所有涉及文件IO、网络IO的异步操作,都不要用固定延时的方式等待执行完成,要在操作对应的回调/Promise状态变更后再执行后续依赖逻辑,避免出现时序问题。

内容的提问来源于stack exchange,提问作者user15730940

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.26 18:51:23