json-server 路径改写成路由形式

json-server 数据模拟——路径改写成路由形式

方式一：

• 目录结构
  

• db.json 文件

  module.exports = {
      'posts': require('./data/posts.json'),
      'user_login': require('./data/user/login.json'),
      'user_logout': require('./data/user/logout.json')
  }
  

• server.js 文件

  const jsonServer = require('json-server')
  const server = jsonServer.create()
  const middlewares = jsonServer.defaults()
  
  // Set default middlewares (logger, static, cors and no-cache)
  server.use(middlewares)
  
  // 获取db数据
  const db = require('./db.js')
  
  // 重写路由路径
  server.use(jsonServer.rewriter({
    '/user/login': '/user_login',
    '/user/login/:id': '/user_login/:id', // 支持动态传参，不写默认是不可以传的
    '/user/logout': '/user_logout',
    '/posts/:category': '/posts?category=:category' // 参数写法
  }))
  
  // Use router
  server.use(jsonServer.router(db))
  
  server.listen(4000, () => {
    console.log('JSON Server is running on 3000')
  })
  

• 启动 server.js 服务

  $ node server.js
  
  # 如果报错可能需要安装一下 json-server
  $ npm install json-server
  

路径重写的缺点：

1. 默认不再支持路径传参，所以只能查询接口所有数据或者添加新数据
2. 如果需要满足更多的需求，必须在重写路径时配置好相应的规则
3. 不会改变原文件数据

方法二（个人推荐）

• 创建 db.json 文件

  {
      "login": [
          {
              "id": 1,
              "username": "zs",
              "password": "ls"
          }
      ],
      "posts": [
          {
              "id": 1,
              "title": "文章一"
          },
          {
              "id": 2,
              "title": "文章二"
          }
      ]
  }
  

• ​ 创建自定义路由 route.json 文件

  {
      "/api/*": "/$1",     // /api/posts => /post
      "/user/*": "/$1"     // /user/login => /login
  }
  
  // GitHub 中有提供更多配置
  

• 启动服务即可

  $ json-server --watch --routes route.json db.json
  # OR 改变端口号
  $ json-server --watch --routes route.json db.json --port 5000
  

  该方法简单好用，生成的接口是 restful 风格，支持增删改查、分页、排序等操作，且会改变原文件数据

具体接口操作请查看官网