使用Mock进行接口数据模拟 - yiyixiaozhi/readingNotes GitHub Wiki

title: 使用Mock来模拟响应式API date: 2019-01-22 description: 友谊的最高境界是守护彼此的孤独。 categories:

  • 工具 tags:

我们使用的是EasyMock来模拟数据，网站：https://easy-mock.com

编辑接口如下：

输入图片说明

输入内容：

{
  code: function({
    _req
  }) {
    let username = _req.query.username.trim()
    let password = _req.query.password.trim()
    let token = _req.query.token.trim()
    if (username.length > 0 && password.length > 0 && token.length > 0) {
      if (username === 'admin' && password === 'admin' && token === 'admin') {
        return 20000
      }
    }
    return 50000
  },
  data: function({
    _req,
    Mock
  }) {
    let username = _req.query.username.trim()
    let password = _req.query.password.trim()
    let token = _req.query.token.trim()
    if (username.length > 0 && password.length > 0 && token.length > 0) {
      if (username === 'admin' && password === 'admin' && token === 'admin') {
        return Mock.mock({
          "roles": [
            "admin"
          ],
          "name": "admin",
          "avatar": "https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif"
        })
      }
    }
    return '登录失败'
  }
}

如上的接口模拟数据中，一部分是模拟响应式数据。如上的接口可以对如下的接口请求参数进行判断和响应。

  • 模拟错误的请求（将username、password、token其中任意一个不匹配）：
https://easy-mock.com/mock/5c45504832a47545ea4c37cf/base/user/info?password=admin&username=admin&token=admintest

响应：

{
    "code": 50000,
    "data": "登录失败"
}
  • 模拟正确的请求（username、password、token的值都是admin）：
https://easy-mock.com/mock/5c45504832a47545ea4c37cf/base/user/info?password=admin&username=admin&token=admin

响应：

{
    "code": 20000,
    "data": {
        "roles": [
            "admin"
        ],
        "name": "admin",
        "avatar": "https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif"
    }
}

Mock语法参考：

Mock.js 1.0 Wiki：https://github.com/nuysoft/Mock/wiki

题外

JavaScript代码debug

在.vscode文件夹中新建launch.json，设置内容如下：

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/test.js",
            "stopOnEntry": false,
            "args": [],
            "cwd": "${workspaceRoot}",
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "externalConsole": false,
            "preLaunchTask": "",
            "sourceMaps": false,
            "outDir": null
        },
        {
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858
        }
    ]
}

VS Code debug（PHP, Ruby, Go, C#, Python, C++, Powershell and many others）更详细的配置参考网址：https://code.visualstudio.com/docs/editor/debugging

test.js内容如下：

var msg = '  test    '
kongge1(msg)
/* 使用String.trim()函数，来判断字符串是否全为空*/
function kongge1(test) {
    let str = test.trim().length;
    if (str.length == 0) {
        console.log('字符串全是空格');
    } else {
        console.log('输入的字符串为:' + test);
    }
}

输出log如下：

输入图片说明

⚠️ **GitHub.com Fallback** ⚠️