1.创建json文件
在与package.json同级目录建立data.json文件
data.json文件内容:
{
"seller": {
"name": "粥品香坊(回龙观)",
"description": "蜂鸟专送",
"deliveryTime": 38,
"score": 4.2,
"serviceScore": 4.1,
"foodScore": 4.3,
"rankRate": 69.2,
"minPrice": 20,
"deliveryPrice": 4,
"ratingCount": 24,
"sellCount": 90,
"bulletin": "粥品香坊其烹饪粥料的秘方源于中国千年古法,在融和现代制作工艺,由世界烹饪大师屈浩先生领衔研发。坚守纯天然、0添加的良心品质深得消费者青睐,发展至今成为粥类的引领品牌。是2008年奥运会和2013年园博会指定餐饮服务商。"
}
}
2.修改webpack.dev.con文件
在 webpack.dev.conf.js文件里面添加,有两种方式添加
第一种,利用express请求数据,可以用于post,get请求,这个已经可以测试通过,请求的地址为http://localhost:3000/api/seller
const express = require('express')
const apiServer = express();
const apiRouter = express.Router()
const appData = require('../data.json')
var seller = appData.seller;
apiRouter.get('/seller', function (req, res) {
res.json({
errno: 0,
data: seller
});
});
apiServer.use('/api', apiRouter);
apiServer.listen(3000, function (err) {
if (err) {
console.log(err)
return
}
console.log('Listening at http://localhost:' + 3000 + '\n')
})
第二种,利用json-server请求json数据,用于get请求,这个方式请求没有测试通过,返回的数据为空 http://localhost:3000/api
//这里是json-server配置信息
// json-server.js
const jsonServer = require('json-server')
const apiServer = jsonServer.create()
const apiRouter = jsonServer.router('data.json') //数据关联server,db.json与index.html同级
const middlewares = jsonServer.defaults()
apiServer.use(middlewares)
apiServer.use('/api',apiRouter)
apiServer.listen(3000, () => { //监听端口
console.log('JSON Server is running')
})
2.请求的地址的变更
如果觉得上面的请求http://localhost:3000/api/seller 修改成http://localhost:8080/api/seller,
步骤如下
config/index.js找到proxyTable
添加: '/api/':'http://localhost:3000/'
3.参考地址
https://blog.csdn.net/benben513624/article/details/78562529