nodejs搭建微信小程序mock服务

现在的程序架构基本都是前后端分离,前端负责调用后端提供的restful api,但是当我们还没拿到后端的api时,这个时候我们就需要自己mock数据了。但是微信小程序无法像浏览器一样直接使用mockjs,所以网上搜到的mockjs教程在微信小程序上基本都没法用。所以今天记录一下用nodejs搭建一个mock后台服务。

1. 安装nodejs环境

这里不详述,搞前端的都懂

2. 安装express

  1. npm install -g express
  2. npm install express-generator -g
  3. npm install -g pm2
  4. express mockserver
  5. npm install
    安装的时候如果报错就自己一个一个安装模块吧,引用的模块就那几个。
  6. pm2 start app.js

3. 改写项目

页面显示不需要用到,所以可以把view引擎删除。其他用不到的都删除
//app.js

var createError = require('http-errors')
var express = require('express')
var path = require('path')
var cookieParser = require('cookie-parser')
var logger = require('morgan')

var app = express()

app.use(logger('dev'))
app.use(express.json())
app.use(express.urlencoded({ extended: false }))
app.use(cookieParser())
app.use(express.static(path.join(__dirname, 'public')))

app.use('/api', require('./routes/users'))

// catch 404 and forward to error handler
app.use(function (req, res, next) {
  next(createError(404))
})

// error handler
app.use(function (err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message
  res.locals.error = req.app.get('env') === 'development' ? err : {}

  // render the error page
  res.status(err.status || 500)
  res.render('error')
})
app.listen(3000, function () {
  console.log('listen 3000')
})

module.exports = app

//user.js

var express = require('express')
var router = express.Router()
var Mock = require('mockjs')
var Random = Mock.Random

/* GET users listing. */
router.get('/user', function (req, res, next) {
  var data = Mock.mock({
    'list|20': [{
      'guid': Random.guid(),
      'name': '@cname()',
      'description': '@cparagraph',
      'img': Random.image()
    }]
  })

  res.send({
    meta: {
      message: 'success'
    },
    status: true,
    data: data.list
  })
})

module.exports = router

前端我采用的是mpvue小程序框架,自己封装了get 和 post请求,这个网上教程很多,不详述。下文中ApiPath.user.getUserInfo其实就是请求地址 ‘localhost:3000/api/user’

handleClick () {
      this.getUserInfo()
    },
async getUserInfo () {
     // 请求'/user/userinfo'接口
     let res = await this.$net.get({
       url: ApiPath.user.getUserInfo,
       data: ''
     })
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值