想办法直接用webpack的proxy代理让这个项目直接访问服务器获取数据。实现步骤1.修改修改learn项目中的配置实现agent。打开config下的index.js，在proxyTable中添加如下代码'/learn'：{target:'http://localhost:8088',changeOrigin:true,pathRewrite:{'^/learn':'/'/}}2.修改api.jsletbase='/learn'这样每当请求/learn就相当于请求/localhost:8088，以登录界面为例importaxiosfrom'axios'letbase='/learn'//注册界面exportconstReginUser=params=>{returnaxios.post(`${base}/regin`,params)}//登录界面exportconstLoginUser=params=>{returnaxios.get(`${base}/login`,{params:params})}在不使用代理的情况下，我们访问登录界面。实际请求地址为：locaihost:8080/learn/login经过代理后，我们访问登录界面，真实请求地址为：localhost:8088/login3，修改main.js取消使用mock数据//importmockandinitialize//importMockfrom'./data/mock'//Mock.init()这个项目重写完成4.编写node-server1，初始化npminit2，先说包package.json{"name":"nodeserver","version":"1.0.0","description":"expressmongoosenode-server","main":"app.js","scripts":{"test":"echo\"错误:没有测试specified\"&&exit1","start":"nodemonapp.js"},"author":"lytton","license":"ISC","dependencies":{"body-parser":"^1.18.2","express":"^4.16.2","express-promise-router":"^2.0.0","formidable":"^1.1.1","mongoose":"^4.13.7","morgan":"^1.9.0","nodemon":"^1.14.1","shortid":"^2.2.8"}}因为我写的时候用的是async，请确保安装的node版本在最低7.6，用node-v检查，如果低于7.6，请升级3.写app.js/***作者：lytton*日期：2017-12-21*邮箱：lzr3278@163.com*/constexpress=require('express')constlogger=require('morgan')constmongoose=require('mongoose')constbodyParser=require('body-parser')//连接数据库mongodbmongoose.Promise=global.Promisemongoose.connect('mongodb://localhost/learn',{useMongoClient:true})constconnection=mongoose.connection;connection.on('error',err=>{if(err){console.log(err);}});connection.on('open',()=>{console.log('openedMongoDB');});//routes常量路由=require('./routes/route')//appconstapp=express()//中间件//日志记录app.use(logger('dev'))//body-parserapp.use(bodyParser.json())//routesconstbase=''app.use(base,route)//捕获404err然后到errhandlerapp.use((req,res,next)=>{consterr=newError('NotFound404')err.status=404next(err)})//errhandlerapp.use((err,req,res,next)=>{consterror=app.get('env')==='development'?err:{}conststatus=err.status||500res.status(status).json({error:{message:error.message}})console.error(err)})//listenportconstport=app.get（'端口'）||8088app.listen(port,()=>{console.log('yourserverarelisteningatlocalhost:'+port)})4、写route.jsconstexpress=require('express')constrouter=require('express-promise-router')()//constrouter=express.Router()constController=require('../controllers/control')//注册router.route('/regin').post(Controller.regin)//登录router.route('/login').get(Controller.login)module.exports=router5、写control.jsconst{User,Product}=require('../models/model')constformidable=require('formidable')constform=newformidable.IncomingForm()module.exports={//注册表regin:async(req,res,next)=>{constnewuser=newUser(req.body)constadduser=awaitnewuser.save()res.status(200).send({adduser:adduser})},//登录login:async(req,res,next)=>{constuser=awaitUser.findOne(req.query)res.status(200).json({code:200,msg:'登录成功',user:user})}/***Callback*///newuser:(req,res,next)=>{//constnewuser=req.body//constadduser=newuser(newuser)//adduser.save((err,user)=>{//if(err){//next(err)//}else{//res.status(200).json(newuser)//}//})//}/***Promise*///newuser:(req,res,next)=>{//constnewuser=req.body//constadduser=newuser(newuser)//adduser.save().then(newuser=>{//res.status(200).json(newuser)//}).catch(err=>{//next(err)//})//}/***async*///newuser:async(req,res,next)=>{//constnewuser=newUser(req.body)//constadduser=awaitnewuser.save()//res.status(200).json(adduser)//}}6、写model.jsconstmongoose=require('mongoose')constshortid=require('shortid')constSchema=mongoose.SchemaUserSchema=newSchema({_id:{type:String,'default':shortid.generate},username:String,password:String,email:String,tel:Number,avatar:{type:String,'default':'http://diy.qqjay.com/u2/2014/1027/4c67764ac08cd40a58ad039bc2283ac0.jpg'},date:Date,name:String})constUser=mongoose.model('User',UserSchema)productsSchema=newSchema({_id:{type:String,'default':shortid.generate},type:String,name:String,prods:[{type:Schema.Types.ObjectId,ref:'Prods'}]})constProduct=mongoose.model('Product',productsSchema)prodsSchema=newSchema({_id:{type:String,'默认':shortid.generate},name:String,price:Number,desc:String,selling:Boolean,info:String})constProds=mongoose.model('Prods',prodsSchema)sendsSchema=newSchema({_id:{类型:String,'default':shortid.generate},sendname:String,sendaddr:String,sendtel:Number,recepname:String,recepaddr:String,receptel:Number,sendprod:String,sendmsg:String,sendprice:Number,sendcode:Number,senstauts:String,sender:{type:Schema.Types.ObjectId,ref:'User'}})constSends=mongoose.model('Sends',sendsSchema)module.exports={用户,产品,Prods,发送}7.简单说一下理解，这样整个服务器就可以轻松上手了。作为一个新手，我就简单说说我理解的一些新知识：1.nodemon的作用。nodemonapp.js的使用主要是为了让整个服务器都可以使用热重载是指修改后的内容可以在不重启服务器的情况下加载2.使用的router是constrouter=require('express-promise-router')()而不是//constrouter=express.Router()我们都知道使用Promise或async需要catch(err),promisethen().catch(err=>{}),asynctry{}.catch(err=>{}),并且我们使用了express-promise-router,这样我们就可以在整个过程中自动catch(err),这样可以减少代码量,我如何做了，我不知道，请解释我的疑惑5.测试1.首先打开mongodbsudoservicemongodstart2。启动我们编写的服务器，确认成功。npm运行start3。启动我们的项目learnnpmrundev4。开始测试先打开robo3t，查看数据库中没有数据的用户。注册用户成功返回错误，因为这个页面还请求了其他数据，但是接口没有写，所以出错的时候再看看数据库。这个时候，这条数据已经插入成功了。查看我们的服务器，可以看到请求注册成功，报错是请求其他数据错误，因为接口还没有写好！！！再次测试登录功能，同样成功。查看服务器登录功能，也是成功的。后续计划同步完善现在编写的两边功能。github地址学习：https://github.com/lyttonlee/...服务器：https://github.com/lyttonlee/...
