开源 静态 文件 服务器,Node.js搭建静态服务器

写在开头,本文是node.js最最初级的搭建静态服务器,比较适合新手入门,大神请绕道哦~

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。Node.js 的包管理器 npm,是全球最大的开源库生态系统。

首先,在搭建一个简单的静态服务器之前,我们先来了解下node.js应用应该由哪几个部分组成:

1、引入 required 模块:我们可以使用 require 指令来载入 Node.js 模块。

2、 创建服务器:服务器可以监听客户端的请求,类似于 Apache 、Nginx 等 HTTP 服务器。

3、接收请求与响应请求:客户端可以使用浏览器或终端发送 HTTP 请求,服务器接收请求后返回响应数据。

现在,我们正式开始搭建一个静态服务器

步骤一:引入require模板

我们使用 require 指令来载入 http 模块,并将实例化的 HTTP 赋值给变量 http,实例如下:

var http = require('http')

步骤二:创建服务器并监听端口

接下来我们使用http.createServer()方法创建服务器,并使用listen()方法监听8090端口。

步骤三:请求到达服务器后,进入 createServer() 函数内部,函数内部处理请求后发送响应呈现到用户页面

函数通过request,response参数来接收和响应数据。

实例如下,在你项目的根目录下创建一个叫 index.js 的文件,并写入以下代码:

//nodejs里面通过require去加载一个模快

var http = require('http')

//通过http模块创建一个服务器

var server = http.createServer(function(req,res){

//设置响应头

res.setHeader('Content-Type','text/plain;charset=gbk')

//检测服务器状态

res.writeHead(200,'Okay')

//将写入的数据返回给浏览器(发送响应数据)

res.write('hello world')

//结束传输

res.end()

})

//监听端口

server.listen(8090)

// 终端打印如下信息

console.log('Server running at http://127.0.0.1:8090')

写完以上代码,我们就把一个简单的web服务器搭建完成了。为了验证效果,我们从终端切换到index.js文件的根目录下,使用 node 命令启动服务器后,终端会打印如下信息:

ab0a84040821

接下来,打开浏览器访问localhost:8090,你会看到一个写着hello world的网页。

ab0a84040821

打开浏览器访问localhost:8090或者http://127.0.0.1:8090

分析Node.js 的 HTTP 服务器:

1、第一行请求(require)Node.js 自带的 http模块,并且把它赋值给 http 变量。

2、接下来我们调用 http 模块提供的函数: createServer 。这个函数会返回 一个对象,这个对象有一个叫做 listen() 的方法,这个方法有一个数值参数, 指定这个 HTTP 服务器监听的端口号。

3、用户请求所带的信息都在req里面,res则是需要返回给用户的信息。

到此为止,一个最基本的web服务器就建立成功了!是不是很简单呢O(∩_∩)O哈哈哈~~~~~下面我们就写一个简单的html页面来请求一下我们的web服务器吧!

首先,效果图如下:

ab0a84040821

访问localhost:9000

那么,上述效果是什么实现的呢?其实很简单,只需在上文搭建的简单服务器中多增加几个步骤。

1、在node.js里面通过require加载一些需要用到的模块,比如:

var http = require('http') //http模块创建服务器

var path = require('path') //path模块根据系统内部自动识别url类型

var fs = require('fs') //fs模块用于读写文件

var url = require('url') //url模块自动解析用户的url得到一些有用的信息

2、理清楚请求到达浏览器后,进入 createServer() 函数内部,函数内部是如何处理请求的,也就是清楚函数内部的逻辑关系。

首先,我们列出上图中简历的构成部分

(1)HTML

(2)CSS

(3)img

接下来,我们来思考要将这个完整的简历页面展示在浏览器上 createServer() 函数的内部逻辑是怎样的?

(1)函数内部解析用户请求的url,如果url中没有扩展名,则添加默认的访问页面

(2)根据url中的信息获取资源文件的相对路径和绝对路径

(3)根据资源文件的绝对路径同步或异步读取资源文件内容,如果是异步还需考虑文件名存在和不存在的情况

(4)文件读取成功后,向浏览器返回文件内容并呈现到用户页面

最后,上面这几条逻辑都弄清楚后,我们在终端启动服务器就会看到如下界面:

ab0a84040821

浏览器得到响应后终端的情况(图片不完整)

完整的代码,放在github上了,有兴趣的朋友可以浏览

https://github.com/5Iris5/nodeServer

注意:一定要将.js文件建在整个文件夹的根目录下!

补充:__dirname与__filename的区别

使用__dirname变量可以 获取当前文件所在目录的完整目录名

使用__filename可以获取当前文件的完整文件名

可以结合以下图片理解

ab0a84040821

__dirname与__filename的区别

【本文不定时更新】

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值