标签 JSON 下的文章

https://easy-mock.com/
Mock.js && 文档 && 示例
json-server

easy-mock例子

分页

请求方式为get：url?page=1

{
  code: function({
    _req
  }) {
    if (_req.query.page < 3) {
      return 0
    } else {
      return 41004
    }

  },
  msg: function({
    _req
  }) {
    if (_req.query.page < 3) {
      return "成功"
    } else {
      return "请求失败"
    }

  },
  data: function({
    _req
  }) {
    if (_req.query.page == 1) {
      return {
        total: 12, //总条数
        page: _req.query.page, //当前页码
        pagesize: 10,
        items: [{
            "id": "1",
            "pid": "31",
            "tit": "血压",
            "datetime": '2017-09-01 08:14'
          },
          {
            "id": "2",
            "pid": "32",
            "tit": "空腹血糖",
            "datetime": '2017-09-03 08:14'
          },
          {
            "id": "3",
            "pid": "33",
            "tit": "氧气治疗",
            "datetime": '2017-09-04 08:14'
          },
          {
            "id": "4",
            "pid": "34",
            "tit": "体重",
            "datetime": '2017-09-05 08:14'
          },
          {
            "id": "5",
            "pid": "31",
            "tit": "血压",
            "datetime": '2017-09-01 08:14'
          },
          {
            "id": "6",
            "pid": "32",
            "tit": "空腹血糖",
            "datetime": '2017-09-03 08:14'
          },
          {
            "id": "7",
            "pid": "33",
            "tit": "氧气治疗",
            "datetime": '2017-09-04 08:14'
          },
          {
            "id": "8",
            "pid": "34",
            "tit": "体重",
            "datetime": '2017-09-05 08:14'
          },
          {
            "id": "9",
            "pid": "31",
            "tit": "血压",
            "datetime": '2017-09-01 08:14'
          },
          {
            "id": "10",
            "pid": "32",
            "tit": "空腹血糖",
            "datetime": '2017-09-03 08:14'
          }
        ]
      }
    }

    if (_req.query.page == 2) {
      return {
        total: 12, //总条数
        page: _req.query.page, //当前页码
        pagesize: 10,
        items: [{
          "id": "11",
          "pid": "33",
          "tit": "空腹血糖",
          "datetime": '2017-09-03 08:14'
        }, {
          "id": "12",
          "pid": "34",
          "tit": "空腹血糖",
          "datetime": '2017-09-03 08:14'
        }]
      }
    }

    if (_req.query.page == 3) {
      return {}
    }

  }
}

登陆请求
请求方式为post: url?name=admin&password=123456 或{name:value,password:123456}

{
  code: function({
    _req
  }) {
    if (_req.query.name === 'admin' && _req.query.password === '123456') {
      return 20000
    } else {
      return 41004
    }

  },
  msg: function({
    _req
  }) {
    if (_req.query.name === 'admin' && _req.query.password === '123456') {
      return "登陆成功"
    } else {
      return "登陆失败"
    }

  },
  data: function({
    _req
  }) {
    if (_req.query.name === 'admin' && _req.query.password === '123456') {
      return {
        "roles": [
          "admin"
        ],
        "token": "admin",
        "avatar": "https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif",
        "name": "Super Admin"
      }
    }

    if (_req.query.name == 'editor') {
      return {
        "roles": [
          "editor"
        ],
        "token": "editor",
        "avatar": "https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif",
        "name": "editor"
      }
    }

    if (_req.query.page == 3) {
      return {}
    }

  }
}

使用 json-server 搭建 api mock 服务 (一)

http://www.sosoapi.com/
https://github.com/swagger-api
http://editor.swagger.io/

http://rapapi.org/org/index.do

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获取 JSON 数据</title>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.getJSON("demo_ajax_json.js",function(result){
            $.each(result,function(i,field){
                $("div").append(field+"<br>");
            })
        })
    })
})

</script>
</head>
<body>

<button>获取 JSON 数据</button>
<div></div>

</body>
</html>

demo_ajax_json.js

{ 
  "firstName": "Bill",
  "lastName": "Gates",
  "age": 60
}