博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
NodeJs的Http服务器的搭建
阅读量:3960 次
发布时间:2019-05-24

本文共 3692 字,大约阅读时间需要 12 分钟。

NodeJs启动Http服务

发送Http请求

使用Http服务,先进行使用require('http'); 进行使用:

在这里插入图片描述

在后面进行搭建server服务器,使用的是一个方法在api文档进行查看,以及使用这个方法之后会返回一个Server类。在同级api文档目录下,进行查看Server类所包含的方法。
在这里插入图片描述
其中Server类当中进行查看所对应的方法,方法还是比较多的。在里面listen方法用于启动HTTP服务器以侦听连接。此方法与server.listen()from相同net.Server。
在这里插入图片描述
在这个listen方法当中简介如下:简单来说,在方法当中给定一个端口号进行监听,第二个传递给一个回调函数。
在这里插入图片描述
而使用代码实现服务端启动:

var http = require('http');var server = http.createServer();server.listen(8080, function() {
console.log("localhost:8080")});

运行这个文件,会发现该端口正在运行,不会再一次弹出文件目录,或者在浏览器当中直接访问8080端口,会发现浏览器上方一直在转圈,到这里,请求就已经成功发送了。

在这里插入图片描述

在这里,我们还可以进行查看response的我们可以发现,在end方法进行调用的时候,end方法当中所带的字符串等也同样可以和write一样进行写入到浏览器当中。因此我们对于部分简单的文本写入可以省略write方法。
在这里插入图片描述

接收Http请求

接收对server类使用一个on进行绑定上一个事件,绑定的参数包括一个request和一个回调函数。回调函数当中也包含两个参数一个request和response,接收和响应数据。在回调函数之间可以把request打印出来进行查看,并且response的write方法进行写入数据到浏览器当中,使用end方法进行结束,代码如下:

var http = require('http');var server = http.createServer();server.on('request',function(res,resp){
console.log(res.method); resp.write("hello changsha"); resp.end();});server.listen(8080, function() {
console.log("localhost:8080")});

之后运行这个js文件,在浏览器当中查看8080端口,可以看到write方法的参数已经被写入到网页当中了。

在这里插入图片描述

编码格式(中文乱码)

在这里,同样的,我们再使用response.write进行写入内容,这一次写入中文,会发现在浏览器当中出现了乱码。这是因为在response进行响应的时候没有设置编码格式。

在这里插入图片描述
因此我们在代码当中加上一条设置编码格式的代码即可。

resp.setHeader('Content-type', 'text/plain;charset=utf-8')

反之使用不同的编码格式会对不同文本进行不同的解析,如使用以下代码会把html代码块进行解析。

resp.setHeader('Content-type', 'text/html;charset=utf-8')

返回网页信息

在这里http搭建好了之后,我们进行响应返回不能是怎么简单一个文本,而应该返回一个html大的页面,在这里我们实现的思路是,先使用filesystem模块进行读取html文件内容再进行返回给response进行响应即可。代码实现如下:

var http = require('http');var fs = require('fs')var server = http.createServer();server.on('request', function(res, resp) {
console.log(res.method); resp.setHeader('Content-type', 'text/html;charset=utf-8') fs.readFile('./http2.html', 'utf8', (err,data) => {
resp.end(data); })});server.listen(8080, function() {
console.log("localhost:8080")});

运行项目,在浏览器当中查看8080这个端口,看http2.html这个网页文件是否被响应出来。

在这里插入图片描述

图片的响应

对于图片的响应,在这里由于路径不一致,进行显示是无法响应的,在这里的request的url属性可以看到请求的路径,在浏览器当中查看。路径不一样所以是无法做出响应的。

在这里插入图片描述
所以我们需要对不同路径下的不一样的请求做出不一样的响应。在读取图片文件的时候要注意urls这个的值和你本地图片的地址是否一致。不一致的话使用字符串进行拼接。而且图片本身就是二进制文件,所以不需要进行指定编码格式。代码如下所示

var http = require('http');var fs = require('fs')var server = http.createServer();server.on('request', function(res, resp) {
console.log(res.url); var urls = res.url; if (urls == '/') {
resp.setHeader('Content-type','text/html;charset=utf-8') fs.readFile('./http2.html', 'utf8', (err, data) => {
resp.end(data); }) } else {
fs.readFile('..' + urls, (err, data) => {
//读取这个图片的路径 resp.end(data); }) }});server.listen(8080, function() {
console.log("localhost:8080")});

在node下运行这个js文件,查看端口可以看到这个html页面的图片就显示出来了

在这里插入图片描述

其他静态资源的响应

在这里以js文件进行测试,如在前面的html文件当中进行引入一个js文件,在这个js文件当中进行绑定一个单击事件,给一个id为btn的按钮绑定一个事件。

document.getElementById('btn').onclick = function(){
alert("this is button")}

再使用script标签把这个js文件进行引入到html页面当中。在这里注意一下项目的结构,

在这里插入图片描述
都是同一级的目录下,所以在前面进行判断是需要确定是不是/或者./这两个路径即可。修改前面的Http3.js文件。

var http = require('http');var fs = require('fs')var server = http.createServer();server.on('request', function(res, resp) {
console.log(res.url); var urls = res.url; if (urls == '/') {
resp.setHeader('Content-type', 'text/html;charset=utf-8') fs.readFile('./http2.html', 'utf8', (err, data) => {
resp.end(data); }) } else {
//在这里是对其他所有静态资源进行响应 fs.readFile('.' + urls, (err, data) => {
resp.end(data); }) }});server.listen(8080, function() {
console.log("localhost:8080")});

在node下运行这个js文件,在浏览器当中进行查看,看这个导入的js文件是否起到了作用。可以看到会有一个alert弹出。其余的css等页面也是同理进行响应。

在这里插入图片描述

获取当前的目录下所有文件名

在这里使用的是文件系统当中的一个readdir方法,

在这里插入图片描述
使用代码实现:

var fs = require('fs')fs.readdir('./', 'utf8', (err, data) => {
console.log(data)})

运行这个js查看输出,返回的是一个数组类型的值。

在这里插入图片描述

转载地址:http://izqzi.baihongyu.com/

你可能感兴趣的文章