使用json-server同时服务多个JSON文件的技术方案

背景介绍

json-server是一个基于Node.js的REST API模拟工具，它能够快速搭建一个完整的假REST API服务器，非常适合前端开发者在没有后端服务的情况下进行开发和测试。在实际项目中，我们经常需要模拟多个数据源，这就需要json-server能够同时服务多个JSON文件。

常见问题

许多开发者在尝试使用json-server服务多个JSON文件时，会遇到模块导出格式错误的问题。典型的错误提示是"Unexpected token m in JSON at position 1"，这表明json-server在解析配置文件时遇到了非预期的格式。

解决方案

正确的模块导出方式

要服务多个JSON文件，需要创建一个JavaScript模块作为json-server的配置文件。这个模块应该导出一个函数，该函数返回一个包含所有数据源的对象。以下是正确的实现方式：

// index.js
module.exports = () => {
  return {
    Agent: require('./Agent.json'),
    Record: require('./Record.json')
  }
}

配置package.json

在package.json中配置启动命令时，需要注意文件路径的正确性：

{
  "scripts": {
    "start": "json-server --watch ./index.js --port 3001",
    "mock": "nodemon --watch mock --exec 'json-server --port 3001 ./index.js'"
  }
}

关键注意事项

1. 模块导出语法：必须使用CommonJS的module.exports语法，而不是ES6的export语法
2. 函数返回：导出的必须是一个函数，该函数返回数据对象
3. 文件路径：确保JSON文件的路径相对于index.js是正确的
4. JSON格式：引用的JSON文件必须是有效的JSON格式

工作原理

当json-server启动时，它会加载指定的JavaScript配置文件。配置文件导出的函数被执行后，返回的对象会被用作API的数据源。每个属性名(如Agent、Record)会成为API的端点路径。

例如，上述配置会产生以下API端点：

• /Agent
• /Record

扩展应用

这种配置方式不仅限于静态JSON文件，你还可以：

1. 动态生成数据
2. 合并多个数据源
3. 添加自定义路由
4. 实现数据关联关系

最佳实践

1. 为每个数据模型创建单独的JSON文件
2. 在配置文件中统一管理所有数据源
3. 使用版本控制管理这些模拟数据
4. 考虑添加中间件来处理特殊请求

通过这种方式，你可以轻松地为前端项目搭建一个完整的模拟后端环境，大大提高开发效率。