3.4 响应报文
1.HTTP状态码
- 200 请求成功
- 404 请求的资源没有被找到
- 500 服务器端错误
- 400 客户端请求有语法错误
可以使用 res.writeHead()方法来设置返回的状态码
2.内容类型
- text/html
- text/css
- application/javascript
- image/jpeg
- application/json
设置方法如下
res.writeHead(200,{
'content-type':'text/plain'//代表返回纯文本 (默认状态)
})
在之前创建web服务器的例子中,< h2 >标签以纯文本的方式显示了出来,那是由于服务器响应的默认类型是 text/plain 也就是纯文本,所以我们之需要利用上面的方法,将text/plain更改为text/html即可,如图。
关于writeHead()方法还有一个问题,假如我们上面的例子中< h2 >标签当中是汉字会发生什么情况呢,如图
那么这是由于编码类型没有被指定所导致的,那么如何解决这个问题呢?只需要在’content-type’属性中添加一些代码即可,如图
保存后访问http://localhost:3000/
可以看到,乱码的问题已经被解决了
四、HTTP请求与响应处理
4.1 请求参数
客户端向服务器端发送请求时,有时需要携带一些客户信息,客户信息需要通过请求参数的形式传递到服务器端,比如登录操作。
4.2 GET请求参数
- 参数被放置在浏览器地址栏中,例如:http://localhost:3000/?name=zhangsan&age=20 (问号之后即为请求的参数,参数是以用等号分隔的键值对的形式传递的,传递多个信息则以&进行分隔。
那么我们在服务器端要如何获取到GET请求参数呢?
请看如下的例子:
首先,我在地址栏中手动输入一些请求参数,然后刷新页面,将参数发送出去
接着,切换到代码编辑器当中,进入代码编辑器后我们要做的第一步就是引用一个叫做url的模块,这个模块是用于处理url地址的。
第二步则是利用url模块下的parse方法来获取参数,代码如图
最后刷新页面,在命令行中查看结果
可以看到,请求的参数已经被成功的输出来了
那么现在会出现一个问题,那就是当我们在地址栏中增加了请求参数时,之前根据请求地址做出响应的判断就会失效,如图
这是因为req.url当中,既包含了请求地址,又包含了请求参数。所以我们就不能单纯的用req.url来做判断了
那么要如何解决这个问题呢?
我们只需要利用url.parse(req.url)中的pathname属性即可,pathname当中存储的正是客户端的请求地址,并且没有包含请求参数
修改后的代码如图
此时再次访问页面
可以看到,问题已经被解决了
4.3 POST请求参数
本小节共包含两点
- 如何从客户端发送请求参数到服务器端
- 如何在服务器端接收客户端发送的请求参数
首先我们要为之前示例当中的form.html中的form表单添加两个表单控件。用于向服务器端提交数据。
与GET请求参数不同的是,POST请求参数不是放在地址栏当中的,而是放在请求报文当中
我们在两个input框中分别写入一些数据并点击提交
打开开发者工具,那么POST请求参数就被存储在了如图所示的Form Data下。
下面我们来看服务器端如何接收POST参数,代码如图
此时我们在命令行中启动服务器,并且在表单中随意提交一些数据,再回到命令行中查看
可以看到,POST请求参数已经被我们成功拿到了,但还有一个问题,就是拿到的参数依然是字符串格式的,那么要如何才能转变成对象形式的呢
这就需要借助node的另外一个内置模块querystring,这个模块中的parse方法可以帮我们快速的将此类格式的字符串转换为对象形式,代码如图
图中的6行和20行即为新增(或修改)的代码。
此时我们再去浏览器中重新提交表单,并且回到命令行中查看
可以看到,这个时候的请求参数就以对象的形式输出了出来。
小结
- 参数被放置在请求体中进行传输
- 获取POST参数需要使用data事件和end事件
- 使用querystring系统模块将参数转化为对象形式
//导入系统模块querystring用于将HTTP参数转换为对象格式
const querystring = require('querystring');
app.on('request',(req,res) => {
let postData = '';
//监听参数传输事件
req.on('data',(chunk) => postData += chunk;);
//监听参数传输完毕事件
req.on('end',() =>{
console.log(querystring.parse(postData));
});
});