JS使用JSON.parse读取JSON文件报Unexpected token B错误如何解决

JSON.parse()的入参要求是符合JSON语法规范的字符串，当前代码完全没有执行「读取文件内容」的操作，只是把文件名本身"3BP-OOP-PFR.json"这个普通字符串传给了JSON.parse去解析。
这个字符串开头为3B，不符合JSON语法规则：合法JSON的起始字符只能是{（对象）、[（数组）、"（字符串值）、数字、t/f/n（对应true/false/null），解析器读到索引位置1（即第二个字符）的B时无法识别语法，直接抛出Unexpected token B in JSON at position 1的异常。

根据代码运行的环境选择对应的读取方式，针对大型JSON文件优先选择流式解析方案，避免一次性加载全量文件占用过高内存。

浏览器环境 #

浏览器受安全策略限制，不能直接通过路径读取本地磁盘文件，分两种常见场景处理：

• 加载部署在服务端的JSON文件：

fetch('3BP-OOP-PFR.json')
  .then(res => {
    if (!res.ok) throw new Error('文件加载失败，检查路径是否正确');
    return res.json(); // 内置方法自动完成JSON解析，无需手动调用JSON.parse
  })
  .then(jsonFile => {
    console.log(jsonFile); // 此处拿到解析完成的JSON对象
  })
  .catch(err => console.error(err));

• 读取用户手动选择的本地JSON文件：

// 页面中放置文件选择控件：<input type="file" id="jsonFileInput" accept=".json">
const fileInput = document.getElementById('jsonFileInput');
fileInput.addEventListener('change', (e) => {
  const selectedFile = e.target.files[0];
  selectedFile.text().then(fileText => {
    const jsonFile = JSON.parse(fileText);
    console.log(jsonFile);
  })
})

Node.js环境 #

Node.js可以直接访问本地文件系统，小文件和大文件对应不同处理方式：

• 小型JSON文件简单读取：

const fs = require('fs/promises');
async function loadJson() {
  // 先读取文件文本内容，再做JSON解析
  const fileContent = await fs.readFile('3BP-OOP-PFR.json', 'utf8');
  const jsonFile = JSON.parse(fileContent);
  console.log(jsonFile);
}
loadJson();

// 固定不变的JSON文件也可以直接用require导入，注意该方式会缓存文件内容
// const jsonFile = require('./3BP-OOP-PFR.json');
// console.log(jsonFile);

• 大型JSON文件流式解析（避免内存溢出）：
  借助流式解析能力逐段处理文件内容，不需要把整个文件全部加载到内存：

// 先安装依赖：npm i stream-json
const fs = require('fs');
const { parser } = require('stream-json');
const { streamArray } = require('stream-json/streamers/StreamArray');

const readStream = fs.createReadStream('3BP-OOP-PFR.json', 'utf8')
  .pipe(parser())
  .pipe(streamArray());

// 逐块处理JSON数据
readStream.on('data', ({key, value}) => {
  console.log('当前处理条目索引：', key);
  // 业务逻辑处理单条value数据
});
readStream.on('end', () => {
  console.log('JSON文件解析完成');
});
readStream.on('error', err => console.error('解析出错：', err));

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