本地环境下PHP与JS Fetch报Unexpected token < in JSON错误求助

这个错误的核心原因很明确：你的fetch请求尝试解析返回内容为JSON，但实际收到的是HTML内容（通常是错误页面、404页面或者PHP的报错输出），而HTML的开头是<，所以JSON解析器直接报错了。结合你说调用其他API正常，问题肯定出在你的PHP接口上，咱们一步步排查：

• 补全并修正你的PHP代码
  你贴的PHP代码明显没写完，首先必须设置正确的响应头，确保返回的是JSON格式：

<?php
// 允许跨域
header('Access-Control-Allow-Origin: *');
// 关键：告诉客户端返回的是JSON
header('Content-Type: application/json');

// 这里是你要返回的数据，确保是合法的数组/对象
$responseData = [
    'status' => 'success',
    'data' => ['item1', 'item2']
];

// 编码为JSON并输出
echo json_encode($responseData);
?>

⚠️ 注意：PHP代码的最开头不能有任何多余字符（包括空格、换行），否则header()函数会报错，导致服务器返回HTML格式的错误信息，这也是触发你这个JSON解析错误的常见原因。

• 直接访问接口，查看真实返回内容
  打开浏览器，直接访问http://localhost:50/data，看看页面显示的是什么：

  • 如果显示的是HTML（比如404页面、PHP语法错误提示），那就是接口本身的问题，先修复PHP的错误或者确保接口路径正确；
  • 如果显示的是乱码或者非JSON文本，检查PHP的json_encode是否正常，或者有没有额外的echo输出了其他内容。

• 给fetch添加错误处理逻辑
  你的当前代码没有处理HTTP错误状态（比如404、500），即使接口返回错误页面，你还是会尝试解析为JSON。给代码加上状态检查和错误捕获：

getData() { 
  fetch('http://localhost:50/data', { 
    headers : { 
      'Content-Type': 'application/json', 
      'Accept': 'application/json' 
    } 
  }) 
  .then((response) => { 
    // 先检查HTTP状态是否正常
    if (!response.ok) {
      throw new Error(`请求失败，状态码：${response.status}`);
    }
    return response.json(); 
  }) 
  .then((result) => { console.log(result); })
  .catch((error) => { 
    console.error('请求出错：', error);
    // 这里可以进一步处理错误，比如提示用户
  }); 
}

按这几步排查，基本就能解决这个问题了。

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