首页 > 其他 > 详细

node搭建mock服务(express)

时间:2021-01-30 21:16:53      阅读:26      评论:0      收藏:0      [点我收藏+]

新建文件夹mockServe, 新建server.js,  

2.将mock的数据(data.json)放入mockServer文件中,

3. npm init -y, 安装express包  npm  i express

4.在server.js中搭建服务, npm start 启动服务

//引入express
const express = require(express)
// 创建服务器应用实例
const app = express()
// 引入json数据
const appData  = require(./data.json)
const seller = appData.seller
const goods = appData.goods
const ratings = appData.ratings

// 注册路由
app.get(/seller, function(req, res){
  // res.json(数据)->把数据转换成json字符串,根据数据内容,修改了Content-Type内部的编码格式,并返回
  res.json({
    error:0,
    data:seller
  })
})

app.get(/goods, function(req, res){
  res.json({
    error:0,
    data:goods
  })
})

app.get(/ratings, function(req, res){
  res.json({
    error:0,
    data:ratings
  })
})

// 3.运行服务器应用,并监听端口
// 端口号可以任意选择,但是不要小于1000
app.listen("5000",function(err){
  if(err){
      console.log(服务器连接失败,err)
  }else{
      console.log(服务器启动成功,启动于http://localhost:5000上)
  }
})

 

此时在vue项目中的main.js测试下有没有数据出现, 

import axios from "axios";

axios.get(/seller).then(v=> console.log(v))

此时并没有数据返回,因为运行vue项目默认在本机搭建了8080端口的服务,去请求5000端口的服务,已经跨域了,我们需要在vue.config.js中设置代理

module.exports = {
  lintOnSave: false,

  devServer: {
    // 端口配置
    // port: 1888,
    // 友情提示:改完请重启项目才能生效!!!
    // 反向代理配置
    //需要转发路由的路径
    proxy: {
      "/api": {
        target: "http://localhost:5000",
        pathRewrite: { "^/api": "" },
        changeOrigin: true
      }
    }
  }
};

然后在去main.js去请求数据即可

import axios from "axios";

axios.get(/api/seller).then(v=> console.log(v))

技术分享图片

 

node搭建mock服务(express)

原文:https://www.cnblogs.com/fsg6/p/14349722.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!