自己虚拟服务器都用json可以吗,nodejs虚拟测试服务器`json-server`本身就是依赖express开发而来，可以进行深度定制...

app.js 部分

const jsonServer = require('json-server');//在node里面使用json-server包

const db = require('./db.js');//引入mockjs配置模块

// const multer = reuqire('multer');

const path = require('path');

const Mock = require('mockjs');

let mock='/api';//定义路由根别名

let port = 3333;//端口

//创建服务器

const server = jsonServer.create();//创建jsonserver 服务对象

//配置jsonserver服务器 中间件

server.use(jsonServer.defaults({

// __dirname：    获得当前执行文件所在目录的完整目录名

// path.join()    方法是将多个参数字符串合并成一个路径字符串

static:path.join(__dirname, '/public'),//静态资源托管所在位置

}));

server.use(jsonServer.bodyParser);//抓取body数据使用json-server中间件

// let upload = multer({dest:path.join(__dirname,'public','uploads')});

// server.use(upload.any());

//响应

//可选 统一修改请求方式

server.use((req, res, next) => {

// console.log(1)

// request.method = 'GET';

if (req.url.includes('/login') || req.url.includes('/reg')){

next()

} else {

if (req.headers.token && req.headers.token.length===16){

next()

} else {

setTimeout(()=>res.jsonp({

err:2,

msg:'token无效或过期'

}),1000)

}

}

});

//登录注册校验

let mr = Mock.Random;//提取mock的随机对象

server.post(mock+'/login', (req, res) => {

// console.log(req.query, req.body);//抓取提交过来的query和body

let username=req.body.username;

let password=req.body.password;

(username === 'alex' && password === 'alex123')?

res.jsonp({

"err": 0,

"msg": "登录成功",

"data": {

"follow": mr.integer(1,5),

"fans": mr.integer(1,5),

"nikename": mr.cname(),

"icon": mr.image('20x20',mr.color(),mr.cword(1)),

"time": mr.integer(13,13)

},

"token":mr.integer(16)

}) :

res.jsonp({

"err": 1,

"msg": "登录失败",

})

});

server.post(mock+'/reg', (req, res) => {

let username=req.body.username;

(username !== 'alex') ?

res.jsonp({

"err": 0,

"msg": "注册成功",

"data": {

"follow": mr.integer(0,0),

"fans": mr.integer(0,0),

"nikename": mr.cname(),

"icon": mr.image('20x20',mr.color(),mr.cword(1)),

"time": mr.integer(13,13)

}

}) :

res.jsonp({

"err": 1,

"msg": "注册失败",

})

});

//响应mock接口 自定义返回结构 定义mock接口别名

const router = jsonServer.router(db);//创建路由对象 db为mock接口路由配置  db==object

router.render = (req, res) => {//自定义返回结构

let data = res.locals.data;//object array

// console.log('app.js',res);

let bl = false;

if (typeof data === 'object' && Object.keys(data).length !== 0){

bl = true;

} else {

bl = false; // delete 操作时，返回空对象

}

setTimeout(()=>{//模拟服务器延时

res.jsonp({

err: bl  ? 0 : 1,

msg: bl ? '成功' : '失败',

data: res.locals.data

})

},1000)

// res.jsonp(res.locals.data)

};

server.use(jsonServer.rewriter({//路由自定义别名

[mock+"/*"]: "/$1",

// "/product\\?dataName=:dataName": "/:dataName",

// "/banner\\?dataName=:dataName": "/:dataName",

// "/detail\\?dataName=:dataName&id=:id": "/detail/:dataName/:id",

// "/product/del\\?dataName=:dataName&id=:id": "/:dataName/:id",

// "/product/add\\?dataName=:dataName": "/:dataName",

// "/product/check\\?dataName=:dataName&id=:id": "/:dataName/:id"

"/:resource/:id/show": "/:resource/:id",

"/posts/:category": "/posts?category=:category",

"/articles\\?id=:id": "/posts/:id"

}));

server.use(router);//路由响应

//开启jsonserver服务

server.listen(port, () => {

console.log('mock server is running')

});

package.json 部分

{

"name": "cli4",

"version": "0.1.0",

"private": true,

"scripts": {

"serve": "vue-cli-service serve",

"build": "vue-cli-service build",

"mock": "nodemon ./mock/app.js"  //引入nodejs

},

"dependencies": {

"axios": "^0.20.0",

"core-js": "^3.6.5",

"vue": "^2.6.11",

"vue-router": "^3.4.3"

},

"devDependencies": {

"@vue/cli-plugin-babel": "^4.5.0",

"@vue/cli-service": "^4.5.0",

"json-server": "^0.16.1",

"mockjs": "^1.1.0",

"vue-template-compiler": "^2.6.11"

}

}

json-server本身就是依赖express开发而来，可以进行深度定制

db.js部分

// 用mockjs模拟生成数据

var Mock = require('mockjs');

// node app.js 要求db.js 暴露一个object

let mapData = (n) => {

let data=[];

for (let i=1; i<=n; i++){

data.push({

_id: i+'',

id: i+'',

title:'@ctitle(8,12)',

des:'@ctitle(10,20)',

time:'@integer(1594004307038,1598004307038)',

detail:{

auth_icon:Mock.Random.image('50x50',Mock.Random.color(),Mock.Random.cword(1)),

auth:'@cname()',

content: [1,2,3].map(()=>(

"

"+"@cparagraph(10,15)"+"

"

)).join('')

}

})

}

return data;

};

let mapData2 = (n) => {

let data=[];

for (let i=1; i<=n; i++){

data.push({

_id: i+'',

id: i+'',

title:'@ctitle(4,8)',

sub_title:'@ctitle(6,12)',

banner: Mock.Random.image('1680x745',Mock.Random.color(),Mock.Random.cword(4,8)),

time:'@integer(1594004307038,1598004307038)',

detail:{

auth_icon:Mock.Random.image('50x50',Mock.Random.color(),Mock.Random.cword(1)),

auth:'@cname()',

content:'@cparagraph(3)'

}

})

}

return data;

};

module.exports = Mock.mock({

'user': {

"follow":Mock.Random.integer(0,100),

"fans":Mock.Random.integer(0,100),

"nikename":Mock.Random.cname(),

"icon":Mock.Random.image('20x20',Mock.Random.color(),Mock.Random.cword(1)),

"time":Mock.Random.integer(13)

},

'banner':mapData2(10),

'home': mapData(100),

'follow': mapData(80),

'column': mapData(60),

});

/* module.exports = () => {

// 使用 Mock

var data = Mock.mock({

'course|30': [

{

// 属性 id 是一个自增数，起始值为 1，每次增 1

'id|+1': 1000,

course_name: '@ctitle(5,10)',

autor: '@cname',

college: '@ctitle(6)',

'category_Id|1-6': 1

}

],

'course_category|6': [

{

"id|+1": 1,

"pid": -1,

cName: '@ctitle(4)'

}

]

});

// 返回的data会作为json-server的数据

return data;

}; */