讲了使用webpack打包Vue、Vue-router的环境搭建，以及vuex的使用，以及Vue组件化和组件间的传值。接下来说说使用nodejs+koa提供接口，axios访问接口，前端数据通信。.11、使用nodejs+koa2提供后台接口npminstallkoakoa-router--save-dev在根目录下新建server/index.js文件index.js：constkoa=require('koa');constrouter=require('koa-router')();constapp=newKoa();router.get('/',(ctx,next)=>{ctx.response.body='111'});app.use(router.routes()).use(router.allowedMethods());app.listen(3000,()=>{console.log('serverisstartatport3000')});在package.json中设置命令："server":"nodeserverindex.js"启动服务：npmrunserver在浏览器中访问localhost/3000看返回值12.设置koa允许前端跨域访问使用koa2-cors设置跨域安装npminstallkoa2-cors--save-dev...app.use(cors({origin:function(ctx){if(ctx.url==='/test'){returnfalse;}return'http://localhost:9001';},exposeHeaders:['WWW-Authenticate','Server-Authorization'],maxAge:5,credentials:true,allowMethods:['GET','POST','DELETE'],allowHeaders:['Content-Type','Authorization','Accept'],}));...13使用axios访问后台界面安装axios：npminstallaxios--save在根目录下新建server/request.js，封装一个request函数。所有的请求都通过request函数，方便统一处理请求。exportdefault{post(url,data){returnaxios({method:'post',baseURL:BASE_URL,url,data:JSON.stringify(data),timeout:10000,headers:{'X-Requested-With':'XMLHttpRequest',//'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8''Content-Type':"application/json",//'Accept':'application/json',//"charset":"utf-8"}}).then((response)=>{returncheckStatus(response)}).then((res)=>{returnncheckCode(res)}).catch((e)=>{console.log(e)returnnewPromise((resolve,reject)=>{reject(e);})})},get(url,params){returnaxios({method:'get',baseURL:BASE_URL,url,params,//获取请求参数timeout:10000,headers:{'X-Requested-With':'XMLHttpRequest'}}).then((response)=>{returncheckStatus(response)}).then((res)=>{returncheckCode(res)})}}functioncheckStatus(response){//loading//如果http状态码是normal,然后直接返回数据if(response&&(response.status===200||response.status===304||response.status===400)){returnresponse//如果没有数据以外的数据需要的，可以直接返回response.data}//异常状态，返回错误信息return{status:-404,msg:'Networkexception'}}functioncheckCode(res){//如果代码异常（包括网络错误、服务器错误、后端抛出的错误），会弹出错误提示告诉用户if(res.status===-404){letvue=newVue;vue.$message({type:'error',message:res.msg});}//if(res.data&&(!res.data.success)){//alert(res.data.error_msg)//}returnres}调用：从'.././request.js'导入请求；让{data}=awaitrequest.post(options.url,data1);让{data}=awaitrequest.get(options.url,data1);请注意，这里有两个坑：1.setaxios.defaults.withCredentials=true//像这样请求时带上cookie只有在请求时才会带上cookie。2.设置'Content-Type':"application/json",JSON.stringify(data)，以便后台正确接收数据。3、设置request带cookie时，后台允许"*"不能跨域，说明协议+域名+端口【相关问题】（https://segmentfault.com/q/1010000011878964?_ea=2792154）请求数据渲染：element-ui的使用代码稍后托管在github上欢迎star
