junit mock服务器文件,mock数据的几种姿势
前后端分离,往往后端负责提供数据接口,前端负责数据展示,但是往往后端接口有延迟或者其他原因,前端并不能等待接口进行下一步开发,所以mock数据就变得很重要(由于我司后端给力,接口给的非常迅速,所以实际开发中并没有使用过mock数据,mock数据往往是在个人项目中使用)。废话不讲,来看一下mock数据的不同方式
easy-mock
官网
注册配置好后会有个工作台
此时在vue.config.js里进行配置
module.exports = {
configureWebpack: {
// 扩展webpack
devServer: {
proxy: {
// easymock开头的请求,webpack帮你转发到target之上
'/easymock': {
target: ' https://www.easy-mock.com/mock/5c77db5ffb8a585dcd816fa4',
changeOrigin: true,
ws: true,
pathRewrite: {
'^/easymock': ''
}
}
}
}
}
}
复制代码
请求数据即可let mock = await this.$axios.get('/api/test')
webpack-dev-server中内置的express
在vue.config.js里进行配置
module.exports = {
configureWebpack: {
// 扩展webpack
devServer: {
before (app) {
// app就是一个express
app.get('/api/test', function (req, res) {
res.json({
list: [
{ text: 'node', },
{ text: 'vue',},
{ text: 'react', }
]
})
})
}
}
}
}
复制代码
请求接口即可let ret = await this.$axios.get('/api/test')
Mock
官网
具体根据官网配置即可,可以选择install mock,也可以选择将mock压缩文件放在static文件夹下,在main.js文件里注册一下
if (process.env.NODE_ENV !== 'production') {
require('@/mock')
}
复制代码
其他按照官网配置即可
express服务器
新建server.js文件
// 安装express
const express = require('express')
const app = express()
// 设置允许跨域访问该服务.
app.all('*', function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*')
res.header('Access-Control-Allow-Headers', 'Content-Type')
res.header('Access-Control-Allow-Methods', '*')
res.header('Content-Type', 'application/json;charset=utf-8')
next()
})
app.get('/api/test', function (req, res) {
res.json({
title: '测试数据',
list: [
{ text: 'node', },
{ text: 'vue',},
{ text: 'react', }
]
})
})
const server = app.listen(9082, function () {
console.log('Express app server listening on port %d', server.address().port)
})
复制代码
此时node server.js会显示Express app server listening on port 9082说明我们的9082端口启动成功,在浏览器输入http://localhost:9082/api/test就会出现我们填写的死数据,在页面请求let res = await this.$axios.get('http://localhost:9082/api/test')即可
yapi
具体参考esay-mock,但是yapi不支持https,官网
junit mock服务器文件,mock数据的几种姿势相关推荐
- 用CSV文件读写数据的两种方式(转)
导读:有时候我们需要对收集的数据做统计,并在页面提供显示以及下载.除了对传统的excel存取之外,对CSV文件的存取也很重要.本文列出了这两种操作的详细代码. 代码: <?php $file = ...
- java向文件写数据的3种方式
下边列举出了三种向文件中写入数据的方式,当然还有其他方式,帮助自己理解文件写入类的继承关系,分享出来供初学者使用.类的关系: file->fileoutputstream->outputs ...
- SAP UI5 应用开发教程之二十六 - OData 服务配合 Mock 服务器的使用步骤详解
从本教程 24 步骤开始,我们接触了 OData 模型.本地学习 SAP UI5 应用开发时,如果直接消费远端的 OData 服务,就会遇到跨域错误. 步骤 24 SAP UI5 初学者教程之二十四 ...
- vue 接口数据排序_Vue 使用 axios 请求 mock 模拟接口的数据
安装使用 axios # axios 安装 使用npm install axios --save# main.js 引入 axiosimport axios from 'axios'Vue.proto ...
- 在vue-cli中搭建mock服务器
在尝试做一个前后端分离的个人博客的时候,由于前后端都需要自己完成,所以首先需要把前端页面写好,但同时需要调用接口,后端代码却还没有开动,怎么办呢,所以这时候就需要自己搭建来模拟假数据了. 在以前的实习 ...
- SAP UI5 初学者教程之二十六 - OData 服务配合 Mock 服务器的使用步骤详解试读版
一套适合 SAP UI5 初学者循序渐进的学习教程 教程目录 SAP UI5 本地开发环境的搭建 SAP UI5 初学者教程之一:Hello World SAP UI5 初学者教程之二:SAP UI5 ...
- mock模拟接口测试 vue_Easy Mock以及Vue+Mock.js模拟数据
Easy Mock以及Vue+Mock.js模拟数据 一.Mock.js简介 Mock.js是一个可以模拟后端数据,也可以模拟增删改查操作的js库 基础语法规范 数据模板中的每个属性由 3 部分构成: ...
- Java mock客户端数据_CatMock: Java 下使用 mock.js 生成虚拟数据
CatMock CatMock 是一个mock.js的 Java 封装库.使用 JDK 自带的 js 脚本引擎直接调用 mock.js 脚本,实现对 mock.js 的统一. 为什么采用这样的方案? ...
- java接收并存储文件_客户端读取本地文件的数据,发送到服务器,服务器接收并存储到文件中...
只实现了传送文件的功能. 编写Socket客户端和服务器程序,客户端读取本地文件的数据,发送到服务器,服务器接收并存储到文件中. 消息格式: 字段 长度(单位字节) 内容 -------------- ...
最新文章
- Java字符串就该这样设计
- 观看马云网商大会视频的一些感想.
- 1.1 Java异常(Exception)处理及常见异常
- 骑士周游算法 c语言_C语言经典算法04--骑士走棋盘(骑士旅游:Knight tour)
- java(6)——+号和++号--号
- Linux常用的25条命令
- spring cloud(九):各组件常用配置参数
- 脚本程序gdb 脚本
- Zygo读取保存dat文件(光学领域知道Zygo的一定要看)
- QLV格式的视频怎么在线转化成MP4
- Android 中文 API (30) —— CompoundButton.OnCheckedChangeListener
- 面试官到底想看什么样的简历?
- 这 10 本书,提升你的财富思维,今天免费送!
- 功率 db 和dbm 的区别
- 6个让你10T硬盘立马爆掉的资源网站,再也不需要去百度上找资源了
- Java基础-对象反序列化
- yaml配置Mybatis
- 图片与mat文件的转换
- uniapp 解决phoneX原生tabbar 安全区域问题
- 使用VMware通过vmdk文件创建XP虚拟机