Koa是一个基于Node的web服务器开发框架,通过Koa我们可以更便捷第开发web服务器。不必像上一节那样刀耕火种地从零开始写。
本节我们来讲解如何使用Koa创建一个web服务器。在学习之前,我们先来了解一些基础知识。
在安装Koa之前,先初始化一个项目。
新建一个空目录,在该目录中打开命令行工具,执行
npm init
初始化完成之后,执行下列命令安装Koa。
cnpm install --save koa
通过require可以引入koa,然后使用koa创建服务器,实例代码如下所示:
1 const Koa = require("koa");
2 const app = new Koa();
3 app.listen(3000,() => {
4 console.log("server is running")
5 });
引入的Koa是一个构造函数,通过new关键字可以创建一个koa应用app。然后通过app的listen方法设置监听端口,运行这个程序就可以移动一个koa服务器了。
访问本机的3000端口可以看到not found
,这说明服务器已经正常启动了,但是还没有指定服务器响应的内容。
接下来,我们用app的use方法设置响应的内容,实例代码如下所示。
1 const Koa = require("koa");
2 const app = new Koa();
3
4 //use方法内的函数会在请求与响应之间执行。
5 app.use(async ctx => {
6 ctx.body = "hello world"
7 })
8
9 app.listen(3000,() => {
10 console.log("server is running")
11 });
app的use方法可以调用一个函数(中间件),这个函数会在请求和相应之间被调用。函数可以接受两个参数。
1 // 多个use方法
2 const Koa = require("koa");
3 const app = new Koa();
4
5 app.use(async (ctx,next) => {
6 ctx.body = "hello world"
7 await next();
8 })
9
10 app.use(async (ctx,next) => {
11 console.log("我是一个中间件")
12 })
13
14 app.listen(3000,() => {
15 console.log("server is running")
16 });
之前我们说过,浏览器可以像服务器发送请求,服务器给予响应之后,我们就能看到网页了。理解了这个过程之后,我们再来输入研究一下请求的知识点。
浏览器可以使用不同的方法发送请求,常用的方法如下所示:
本节我们主要使用get请求来获取页面,实例代码如下所示:
1 cnpm install --save koa-router
2
3 const Koa = require("koa");
4 const router = require("koa-router")();
5 const app = new Koa();
6
7 //get是http协议请求的方法
8 router.get("/", async ctx => {
9 ctx.body = "<h1>home page</h1>"
10 })
11 router.get("/video", async ctx => {
12 ctx.body = "<h1>video page</h1>"
13 })
14 app.use(router.routes())
15 app.listen(3000,() => {
16 console.log("server is running")
17 });
这样我们就可以实现一个有多个页面的应用程序了
在网页中插入图片,需要在img标签中填写图片的地址。web应用的服务器,只有静态文件目录的文件才可以被html页面直接访问。
也就是说,我们需要先创建一个静态文件目录,然后在里面放置图片(或js,或css),才能被html页面访问。
通过下面的命令下载koa-static
,可以设置静态文件目录。
cnpm install --save koa-static
实例代码如下所示:
1 const Koa = require("koa");
2 const static = require("koa-static");
3 const app = new Koa();
4 //__dirname是当前项目的绝对路径
5 app.use(static(__dirname + "/public"));
6
7 app.use(async (ctx) => {
8 ctx.body = `
9 <h1>这是一个有图片的网页</h1>
10 <img src='/img/logo.jpg'>
11 `
12 })
13 app.listen(3000,() => {
14 console.log("server is running")
15 })
引入koa-static
,可以得到一个static函数,通过调用这个static函数,便可以将参数的目录设置为一个静态目录了。
这样就可以在网页中看到图片了。
创建一个基于koa的服务器,运行在80端口之上,满足一下要求:
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。