Vue+koa2开发一款全栈小程序(4.Koa入门)
1.Koa是什么?
基于nodejs平台的下一代web开发框架
1.Express原班人马打造,更精简
2.Async+await处理异步
3.洋葱圈型的中间件机制
新建一个koa项目
1.打开cmd,cd到指定目录下
mkdir koa-demo
cd koa-demo
npm init //然后一直默认回车
cnpm install koa --save
2.在vscode中打开koa-demo项目,新建server.js
const Koa=require('koa')
const app=new Koa() app.use(async(ctx,next)=>{
ctx.body='hello koa'
}) app.listen(3000)
在cmd中,执行node server.js
3.在浏览器,访问http://localhost:3000/
代码疑问
1.ctx是什么 封装了request和response的对下个
2.Next是什么 下一个中间件
3.App是什么 启动应用
2.异步处理方案 async+await
新建asyncawait.js文件
function delay(word){
return new Promise((reslove,reject)=>{
setTimeout(()=>{
reslove('hello'+word)
},2000)
})
} //async+await 一起使用
async function start(){
const word1=await delay('孙悟空')
console.log(word1)
const word2=await delay('猪八戒')
console.log(word2)
const word3=await delay('沙悟净')
console.log(word3)
} start()
执行node asyncawait.js 命令,依次输出
hello 孙悟空
hello 猪八戒
hello 沙悟净
//每隔两秒,顺序执行,没有发生异步的抢执行
async+await在koa中的使用
将server.js改写为
const Koa=require('koa')
const app=new Koa() function delay(){
return new Promise((reslove,reject)=>{
setTimeout(()=>{
reslove()
},1000)
})
} app.use(async(ctx,next)=>{
ctx.body='1'
await next()
ctx.body+='2'
}) app.use(async(ctx,next)=>{
ctx.body+='3'
await delay()
await next()
ctx.body+='4'
}) app.use(async(ctx,next)=>{
ctx.body+='5'
await next()
ctx.body+='6'
}) //
app.listen(3000)
在cmd中,ctrl+c退出服务状态,再执行node server.js
async+await在koa中的实践应用例子,定义一个打印日志的中间件
在项目目录下,新建koa-logger.js文件
module.exports=async(ctx,next)=>{
const start=new Date().getTime()
await next()
const end=new Date().getTime() console.log(ctx.request.url,end-start,ctx.body.length)
}
然后在server.js中引用
在cmd重启命令:node server.js
访问 http://localhost:3000/
在cmd界面,打印出日志
/ 1003 6 //代表访问了根目录,用了1003毫秒,返回体有多长
3.koa路由koa-router入门
1.打开cmd,在项目目录下下,安装koa-router
cnpm install koa-router --save
2.server.js中
const Koa=require('koa')
const Router = require('koa-router');
const app=new Koa();
const router = new Router(); router.get('/', (ctx, next) => {
ctx.body='孙悟空'
});
router.get('/1', (ctx, next) => {
ctx.body='猪八戒'
}); app.use(router.routes()); /*启动路由*/
app.use(router.allowedMethods()); app.listen(3000)
在cmd重启命令:node server.js
访问 http://localhost:3000/ 返回孙悟空
访问http://localhost:3000/1 返回猪八戒
Vue+koa2开发一款全栈小程序(4.Koa入门)的更多相关文章
- Vue+koa2开发一款全栈小程序(1.课程介绍+2.ES6入门)
1.课程介绍 1.课程概述 1.做什么? Vue+koa2开发一款全栈小程序 2.哪些功能? 个人中心.图书列表.图书详情.图书评论.个人评论列表 3.技术栈 小程序.Vue.js.koa2.koa- ...
- Vue+koa2开发一款全栈小程序(5.服务端环境搭建和项目初始化)
1.微信公众平台小程序关联腾讯云 腾讯云的开发环境是给免费的一个后台,但是只能够用于开发,如果用于生产是需要花钱的,我们先用开发环境吧 1.用小程序开发邮箱账号登录微信公众平台 2.[设置]→[开发者 ...
- Vue+koa2开发一款全栈小程序(3.vue入门、Mpvue入门)
1.Vue-cli 1.新建一个vue项目 打开cmd 官方命令行工具 npm install -g vue-cli //安装脚手架 cd到你想要存放demo的目录下,然后 vue init webp ...
- Vue+koa2开发一款全栈小程序(6.个人中心)
1.用户信息的获取和展示 1.初始化数据库 cd到server目录下,执行 node tools/initdb.js 登录mysql控制界面,查看初始化以后生成的表 show databases; u ...
- Vue+koa2开发一款全栈小程序(9.图书详情页)
1.获取图书详情 1.修改server/controllers/bookdetail.js为 const {mysql}=require('../qcloud') module.exports=asy ...
- Vue+koa2开发一款全栈小程序(8.图书列表页)
1.图书列表页获取数据 1.在server/routes/index.js中新增路由 router.get('/booklist',controllers.booklist) 2.在server/co ...
- Vue+koa2开发一款全栈小程序(7.图书录入功能)
1.图书录入功能 1.获取图书信息 1.在mydemo/src/until.js中封装工具函数post和get // 工具函数 import config from './config' // htt ...
- 微信小程序云开发-从0打造云音乐全栈小程序
第1章 首门小程序“云开发”课程,你值得学习本章主要介绍什么是小程序云开发以及学习云开发的重要性,并介绍项目的整体架构,真机演示项目功能,详细介绍整体课程安排.课程适用人群以及需要掌握的前置知识.通过 ...
- 从零开发一款自己的小程序UI组件库(一)
写在前面:有开发过小程序的朋友肯定知道组件化开发的特性,高内聚与低耦合.使用已有的UI组件库,诸如:vantUI-weapp.minUI-weapp等UI组件库的诞生使我们的开发速度大大的加快,丰富的 ...
随机推荐
- python之路-字符串
一.类型转换 a = 10 print(type(a)) # <class 'int'> d = str(a) # 把数字转换成str print(type(d)) # <class ...
- js正則表達式
正則表達式實例化的兩種方式: 字符型 var a=// 對象型var a=new RegExp(,) 修飾符: i:忽略大小寫 g:全局搜索 m:多行搜索 元字符: \轉義字符 \w:字符,數字,下劃 ...
- Windows7 (Win7) 配置Windows Update 时失败 正在还原更改
用WinPE启动后,进入Windows\WinSxS目录,想办法删掉pending.xml和reboot.xml
- Js返回上一页,刷新页面,定时刷新,改变地址栏 等常用实用技巧
1. Javascript 返回上一页history.go(-1), 返回两个页面: history.go(-2); 2. history.back(). 3. window.history.forw ...
- ASP.NET MVC和Web API中的Angular2 - 第2部分
下载源码 内容 第1部分:Visual Studio 2017中的Angular2设置,基本CRUD应用程序,第三方模态弹出控件 第2部分:使用Angular2管道进行过滤/搜索,全局错误处理,调试客 ...
- 实验吧 WEB 猫抓老鼠
人生的第一道CTF题目哇,鸡冻 其实只是学了一下HTTP抓包得到的都是什么,就开始上手胡搞了 题目名字叫猫抓老鼠,还疯狂暗示catch!catch!catch!catch!,就想到要用抓包其实我是因为 ...
- ubuntun与qt下载地址
http://mirrors.melbourne.co.uk/ubuntu-releases/ http://download.qt.io/archive/qt/5.4/5.4.0/ 使用u盘安装ub ...
- git 命令使用集锦
使用git mv重命名文件,而不是delete然后再add文件. git format常用命令: git format-patch -4 //从当前分支最新提交点往下共生成4个补丁 git forma ...
- UNIX口令破解机
在编写我们的UNIX口令破解机时,我们需要使用UNIX 计算口令hash 的crypt()算法.Python 标准库中已自带有crypt 库.要计算一个加密的UNIX 口令hash,只需调用函数cry ...
- 白兔的刁难 IDFT
题目描述 给你\(n,k\),求 \[ \forall 0\leq t< k,s_t=\sum_{i=-t}^{n-t}[k|i]\binom{n}{i+t} \] 对\(998244353\) ...