开源 静态 文件 服务器,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 命令启动服务器后，终端会打印如下信息：

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

打开浏览器访问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服务器吧！

首先，效果图如下：

访问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)文件读取成功后，向浏览器返回文件内容并呈现到用户页面

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

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

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

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

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

补充：__dirname与__filename的区别

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

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

可以结合以下图片理解

__dirname与__filename的区别

【本文不定时更新】