1.生成express项目,开启本地服务创建login,route,corsimport需要npmicors--save,设置origin为Allowacertainaccess;app.js和login.js是app.jsvarcreateError=require('http-errors');varexpress=require('express');varpath=require('path');varcookieParser=require('cookie-parser');varlogger=require('morgan');varcors=require('cors');varindexRouter=require('./routes/index');varusersRouter=require('./routes/users');varloginRouter=require('./routes/login');const{METHODS}=require('http');varapp=express();app.use(cors({origin:'http://localhost:8080',//表示请求的源地址//'Access-Control-Request-Method':'post',allowedHeaders:['Conten-Type','Authorization']}))//视图引擎设置app.set('views',path.join(__dirname,'views'));app.set('viewengine','jade');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('/',indexRouter);app.use('/users',usersRouter);app.use('/login',loginRouter)//捕获404并转发到错误处理程序app.use(function(req,res,next){next(createError(404));});//errorhandlerapp.use(function(err,req,res,next){//设置局部变量,只提供开发中的错误res.locals.message=err.message;res.locals.error=req.app.get('env')==='development'?err:{};//渲染错误页面res.status(err.状态||500);res.render('error');});module.exports=app;login.jsvarexpress=require('express');varrouter=express.Router();/*GETloginpage.*/router.get('/',function(req,res,next){res.json({name:'admin',pwd:'123456'});});module.exports=router;npm运行start打开express项目,输入地址http://127.0.0.1:3000/login查看登录用户,密码数据2.vue-cli3搭建项目访问登录数据,axios插件在需要引入npmiaxios--savevue.config.jsmodule.exports={publicPath:process.env.NODE_ENV==='production'?'/':'/',assetsDir:"资产s",filenameHashing:false,lintOnSave:'warning',devServer:{host:"localhost",port:'1000',https:false,open:false,proxy:{"/login":{目标:"http://127.0.0.1:3000",//要访问的接口域名//ws:true,//是否开启websocketschangeOrigin:true,//开启代理:会在本地创建一个虚拟服务器,然后请求的数据会同时发送,//和接收请求的数据,这样服务器与服务器之间的数据交互就不会有跨域问题//pathRewrite:{//'^/api':''//这里理解为使用'/api'而不是target中的地址,比如我要调用//'http://40.00.100.100:3002/user/add',就写'/api/user/add'directly//}}},overlay:{warnings:true,errors:true},},pages:{index:{//页面条目entry:'src/main.js',//templatesourcetemplate:'public/index.html',//在dist/index.html中输出filename:'index.html',//使用ti时tleoption,//模板中的title标签需要为
