koa框架是基于node的web服务器开发框架,通过koa可以更便捷的开发web服务器,不必刀耕火种的从零开始写。
引入koa 创建应用
const Koa = require("koa"); // 引入koa 构造函数
const app = new Koa(); // 创建应用
app.use(async(ctx,)=>{
ctx.body = "hello" // 响应的内容
})
app.listen(3000,()=>{
console.log("200")
}); // 设置监听端口
koa的方法:
use()用来引入一个中间件:即一个在请求和响应中间的函数,内用async函数,可以设置两个形参,第一个是响应的内容
路由
浏览器可以向服务器发送请求,服务器给予响应之后就可以看见网页内容。浏览器可以使用不同的方法发送请求,常用方法如下:
- get请求:用来获取页面或者数据
- post请求:用来提交数据,一般登录的时候,向后台发送用户名和密码可以使用
cnpm install --save koa-router
const Koa = require("koa"); // 引入koa 构造函数
const router = require("koa-router")();// 引入并执行
const app = new Koa(); // 创建应用
// app.use(async(ctx,)=>{
// ctx.body = "hello" // 响应的内容
// })
router.get("/", async(ctx,)=>{
ctx.body =`<h1>home</h1>
<p>lyj</p>
`})
router.get("/video",async(ctx,)=>{
ctx.body ="<h1>video</h1>"})
app.use(router.routes()); // 在koa项目中引用router
app.listen(3000,()=>{
console.log("200")
}); // 设置监听端口
使用方法: 下载koa-router;设置变量名router来引入koa-router并在结尾加括号设置为立即执行函数;使用变量名.get(1,2)参数1为路径,参数2为async函数,async第一个参数为上下文,使用上下文.body可以显示页面内容,可以设置反应号来实现换号功能;在koa项目中使用koa.use(router.toutes())来引入kou-router;使用app.listen(端口,提示函数)来设置监听端口。
静态文件
在网页中插入图片,需要在img中填写图片地址,web应用的服务器,只有静态文件目录才可以被html直接访问。也就是说,我们需要先创建一个静态文件目录,然后这里面防止图片(或js、css等),才能被html访问。
下载命令:
cnpm install --save koa-static
const Koa = require("koa"); // 引入koa 构造函数
const router = require("koa-router")();// 引入并执行 koa-router
const static =require("koa-static"); // 引入koa-static
const app = new Koa(); // 创建应用
app.use(static(__dirname + "/public"))
// console.log(__dirname,"当前的项目的绝对路径")
router.get("/", async(ctx,)=>{
ctx.body =`
<h1>home</h1>
<p>刘狗</p>
// <img src="/images/a2.png">
`})
router.get("/video",async(ctx,)=>{
ctx.body ="<h1>video</h1>"})
app.use(router.routes()); // 在koa项目中引用router
app.listen(3000,()=>{
console.log("200")
}); // 设置监听端口
作业
使用80端口监听;
使用/进入首页展示欢迎光临;
使用/doc进入内容页 展示标题 段落 图片 ;
使用/doc进入内容页 引入外部css样式修改字体颜色 图片等;
const Koa = require("koa"); // 引入koa 构造函数
const router = require("koa-router")();// 引入并执行 koa-router
const static =require("koa-static"); // 引入koa-static
const app = new Koa(); // 创建应用
app.use(static(__dirname + "/public"))
// console.log(__dirname,"当前的项目的绝对路径")
router.get("/", async(ctx,)=>{
ctx.body =`
<h2>欢迎来到首页</h2>
`})
router.get("/doc",async(ctx,)=>{
ctx.body = `
<link rel="stylesheet" href="/css/one.css">
<h1 class="box">home</h1>
<p class= "resp">sadasdasdasd</p>
<img src="/images/a2.png">
`
}) // css样式直接写link标签外部引入 img亦是如此
router.get("/video",async(ctx,)=>{
ctx.body ="<h1>video</h1>"})
app.use(router.routes()); // 在koa项目中引用router
app.listen(80,()=>{
console.log("200")
}); // 设置监听端口