mcp-faker-json

mcp-faker-json

背景

在前端开发过程中,我们常常需要在接口尚未完成的阶段进行 mock 数据处理。通常的做法是根据后端提供的接口文档进行开发,同时使用第三方库(如 json-schema-faker)生成模拟数据。然而,实际使用中常会遇到诸如枚举值缺失、字段语义不清等问题,导致 mock 数据效果不理想。

为了解决这些痛点,我们结合 AIMCP 服务,自动解析接口文档,生成更贴合业务的高质量 mock 数据,大幅提升开发效率与数据真实感。

功能特性

  • 支持通过 YApi 接口文档地址一键生成 mock 数据,智能识别类型注释,生成合理的数据
  • 支持stdio/sse/http transport
  • 支持命令式创建token 配置文件

快速开始

要求

  • nodejs >= 18.16.1
  • vscode,cursor或其他MCP客户端

安装

在VSCode安装

将此内容添加到你的VSCode MCP配置文件.vscode/mcp.json中。更多信息请参见VSCode MCP文档

json 复制代码
{
  "servers": {
    "mcpfakerjson": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "mcp-faker-json@latest"],
    }
  }
}
在cursor安装

将此内容添加到cursor配置文件.cursor/mcp.json中。更多信息请参见cursor MCP

json 复制代码
{
  "mcpServers": {
    "faker-json": {
      "command": "npx",
      "args": ["-y", "mcp-faker-json@latest"]
    }
  }
}

配置token

在开始使用前,需要先配置token。访问yapi文档需要token。

  • 可以在url上携带。例如https://xxx/xxx?token=xxx

  • 环境变量配置

    json 复制代码
    {
      "servers": {
        "mcpfakerjson": {
          "type": "stdio",
          "command": "npx",
          "args": ["-y", "mcp-faker-json@latest"],
          "env": {
            "YAPI_TOKEN": "xxxx"
          }
        }
      }
    }
  • 配置文件(推荐,不同的项目会有不同的token,根据projectId映射token)。环境变量读取配置文件的路径可以通过环境变量配置YAPI_TOKEN_CONFIG,默认从path.join(os.homedir(), ".yapi-token.json")读取。

    json 复制代码
    {
      "servers": {
        "mcpfakerjson": {
          "type": "stdio",
          "command": "npx",
          "args": ["-y", "mcp-faker-json@latest"],
          "env": {
            "YAPI_TOKEN_CONFIG": "xxxx"
          }
        }
      }
    }
    
    // yapi-token.json内容
    {
      "项目ID": "your token"
    }

快速创建token配置文件

为了方便用户快速创建配置文件。可以使用提供的命令npx mcp-faker-json@latest -c。目前只支持默认在path.join(os.homedir(), ".yapi-token.json")创建。

1.1.1版本 支持通过读取YAPI_TOKEN_CONFIG环境变量读取路径创建

vscode使用示例

具体参考传送门

  1. vscode设置启用mcp服务。打开设置页面搜索 chat mcp

2. 打开.vscode/mcp.json的文件,点击start

3. vscode右上角打开ai聊天页面,并配置agent

4. 在输入框输入链接发送,并选择continue 最终ai会输出mock数据~大功告成!

Cursor使用示例

传送门。可以参考官方文档这里就不再说明了。

最后

源码

相关推荐
我有一个object6 小时前
uniapp上传文件报错:targetSdkVersion设置>=29后在Android10+系统设备不支持当前路径。请更改为应用运行路径!
前端·javascript·vue.js·uniapp
北极糊的狐6 小时前
关于jQuery 事件绑定,记录常用事件类型及核心注意事项
前端·javascript·jquery
_Kayo_7 小时前
vue3 computed 练习笔记
前端·vue.js·笔记
CodeSheep7 小时前
VS 2026 正式发布,王炸!
前端·后端·程序员
无奈何杨7 小时前
CoolGuard事件查询增加策略和规则筛选,条件结果展示
前端·后端
梦里不知身是客117 小时前
正则表达式常见的介绍
前端·javascript·正则表达式
初学小白...7 小时前
HTML知识点
前端·javascript·html
鹏多多7 小时前
flutter睡眠与冥想数据可视化神器:sleep_stage_chart插件全解析
android·前端·flutter
艾小码7 小时前
Vue3 脚本革命:<script setup> 让你的代码简洁到飞起!
前端·javascript·vue.js
IT_陈寒7 小时前
Python 3.12新特性解析:10个让你代码效率提升30%的实用技巧
前端·人工智能·后端