apipost软件制造简单的mock数据使用

802 阅读2分钟

很多时候我们前端同学已经写好页面了,但是后端同学端口还没固定好,那么我们就只有等后端同学接口出来之后再进行后续开发,这样就难免降低了开发效率,今天是给同学们推荐一个可以制造mock数据的软件apipost,并写出他mock数据如何生成,部分同学还不会制造mock数据所以有这个文章,此篇文章主要是apipost软件基础用法,制造简单的mock数据,如果有任何使用问题,或者文章有错误之处,欢迎大佬进行指出 下面是apipost制造mock数据步骤

这是我们进入apipost这个软件的界面 image.png

下面是第一步 image.png 第二步,点击新建接口之后,去改写method和url

image.png 这是自己想要请求的参数和条件,如果有需要就带上,我这里是默认没有参数和条件的

image.png 然后再下面的响应期望里可以自己书写响应期望和导入自己的响应期望

image.png 注意选择导入一般是使用严格的json格式的数据包

image.png 下面这个按钮是可以自己设置出来多少个数据包

image.png

image.png 填写完我们保存然后把这个mock数据包的url复制一下

image.png 下面用uniapp发起请求为例子

image.png 当然大家也可以用promise去发起ajax请求去处理,

//mock数据,vue
function queryData(url) {
    var p = new Promise(function (resolve, reject) {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if (xhr.readyState != 4) return;
            if (xhr.readyState == 4 && xhr.status == 200) {
                resolve(xhr.responseText);
            } else {
                reject('服务器错误');
            }
        }
        xhr.open('get', url);
        xhr.send(null);
    });
    return p;
}
queryData('自己的mock数据url地址')
    .then(function (res) {
        console.log(JSON.parse(res));
    }, function (info) {
        console.log(info);
    });

这样我们就可以用我们的mock数据进行测试使用,也可以自己添加参数条件等,自己设置生成个多少字段等,还是非常实用的,新手上路,有任何问题欢迎指出,也欢迎在评论区进行评价,大佬勿喷,看到这里如果对各位大佬有帮助,动动你们的小手点点赞评论,给小白一点动力!!!谢谢各位大佬