资讯专栏INFORMATION COLUMN

搭建一个好用的API Mock服务

Lin_YT / 717人阅读

摘要:上篇文章讲述了怎么用实现一个服务现在开始讲述如何搭建一个好用的服务达到的效果在开发环境中就可以在后面添加参数来实现数据,没有该参数就访问正常数据,且不会对测试环境和生产环境造成任何影响实现步骤通过设置代理。

上篇文章讲述了怎么用Node实现一个API服务

现在开始讲述如何搭建一个好用的API Mock服务

达到的效果:

在开发环境中就可以在url后面添加?ismock=1参数来实现数据mock,(没有该参数就访问正常数据),且不会对测试环境和生产环境造成任何影响

实现步骤:

通过Webpack设置代理。

    //webpack.config.js

    proxy: {
        "/mock": {
            target: "mock",
            changeOrigin:true,
            pathRewrite: {
                "^/mock": ""
            }
        }
    }

拦截请求(比如Axios自带的拦截器)

判断url参数(如?ismock=1)

判断当前环境(如process.env.NODE_ENV == "development")

添加baseUrl = /mock

在webpack的压缩处理中删除不可达代码(见webpack配置表)

源码地址

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/110014.html

相关文章

  • 搭建简单伪热更新Mock服务

    前言 刚开始接触vue-cli,发现用它生成的框架代码是缺少Mock模拟的,于是自己摸索了许久,将自己的摸索的结果通过过程记录下来,希望对别人有所帮助,能少走弯路。 这不是关于vue-cli的,是单纯的模拟数据服务这不是关于vue-cli的,是单纯的模拟数据服务这不是关于vue-cli的,是单纯的模拟数据服务 同时希望获得更好的解决方案,有更好方案的不要吝啬分享啊。 实现目标 1.ajax数据模...

    morgan 评论0 收藏0
  • 手摸手,带你用vue撸后台 系列五(v4.0新版本)

    摘要:同时增加了单元测试,使用了,增加了可视化配置权限,增加了自定义布局等等,优化了原先的权限方案,支持不刷新页面更新路由等等功能。虽然它的初衷是为了单元测试的,但正好满足了我们的需求。它会重写浏览器的对象,从而才能拦截所有请求,代理到本地。 前言 vue-element-admin 从 2017.04.17提交第一个 commit 以来,维护至今已经有两年多的时间了了,发布了四十多个版本,...

    MonoLog 评论0 收藏0
  • 手摸手,带你用vue撸后台 系列五(v4.0新版本)

    摘要:同时增加了单元测试,使用了,增加了可视化配置权限,增加了自定义布局等等,优化了原先的权限方案,支持不刷新页面更新路由等等功能。虽然它的初衷是为了单元测试的,但正好满足了我们的需求。它会重写浏览器的对象,从而才能拦截所有请求,代理到本地。前言 vue-element-admin 从 2017.04.17提交第一个 commit 以来,维护至今已经有两年多的时间了了,发布了四十多个版本,收获了三...

    graf 评论0 收藏0
  • ❤️软件测试经典10题(含解析) 软件测试行业,去大公司还是小公司好?❤️

    年轻人都会犯的3个职场错误,你有几个? 测试人员如何才能快速成长? 软件测试行业,去大公司还是小公司好? 同学们可以用这 10 道题目,找到自己的薄弱点,对症下药哦。 我的建议是:你们可以拿出纸笔,写下这 10 道题的答案,然后再与文末的答案进行对照~ 选择题 1. (单选)当需要对某个系统进行测试的时候,应该从哪些方面来设计测试用例? A. 功能验证 B. 性能相关的验证 C. 兼容性相关的验...

    zhunjiee 评论0 收藏0
  • vue+axios+mock.js环境搭建

    摘要:如果你不熟悉也没关系,我将一步一步教你如何在前端项目中使用来构建一个模拟假数据环境。例如代表的含义。文件最后将方法暴露出去给具体请求调用即可具体页面调用引入使用处理返回 在前后端分离开发模式下,前端项目通常在项目构建初期需要使用假数据以及相应的http请求来进行辅助开发,例如在后端接口还没开发好下,我们可以模拟http请求以及数据来进行前端的axios封装,接口设计,对http状态码处...

    Chao 评论0 收藏0

发表评论

0条评论

Lin_YT

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<