处理URL

在hello-koa工程中,我们处理http请求一律返回相同的HTML,这样虽然非常简单,但是用浏览器一测,随便输入任何URL都会返回相同的网页。
正常情况下需要对不同的URL调用不同的处理函数。
可以通过if…else…的判断进行编写,但是应该存在一个能集中处理URL的middleware,它根据不同的URL调用不同的处理函数,这样,我们才能专心为每个URL编写处理函数。

koa-router——处理get请求

作用:负责URL映射

拷贝hello-koa,安装koa-router。
对app.js进行修改

图1

在浏览器输入http://localhost:4000

图2

同时

图3

当选择输入http://localhost:4000/hello/koa

图4

图5

koa-bodyparser——处理post请求

在合适的位置加上:

app.use(bodyParser());
由于middleware的顺序很重要,这个koa-bodyparser必须在router之前被注册到app对象上。

写一个简单的登录表单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
router.get('/', async (ctx, next) => {
ctx.response.body = `<h1>Index</h1>
<form action="/signin" method="post">
<p>Name: <input name="name" value="koa"></p>
<p>Password: <input name="password" type="password"></p>
<p><input type="submit" value="Submit"></p>
</form>`;
});
router.post('/signin', async (ctx, next) => {
var
name = ctx.request.body.name || '',
password = ctx.request.body.password || '';
console.log(`signin with name: ${name}, password: ${password}`);
if (name === 'koa' && password === '12345') {
ctx.response.body = `<h1>Welcome, ${name}!</h1>`;
} else {
ctx.response.body = `<h1>Login failed!</h1>
<p><a href="/">Try again</a></p>`;
}
});

运行如图

图6

同时在浏览器中输入相应地址:

图7

正确输入密码则显示:

图8

说明对post的请求也可以正常处理

重构

app.js已经可以处理各类的URL,但是看着不好看。

复制一分url-koa命名为url2-koa,在新目录下创建一个index.js,利用这个index.js通过module.exports把两个URL处理函数暴露出来。

还未搞清楚,待解决
处理URL——廖雪峰的官方网站