js便签笔记(14)——用nodejs搭建最简单、轻量化的http server

1. 引言

前端程序猿主要关注的是页面,你可能根本就用不到.net,java,php等后台语言。

但是你制作出来的网页总要运行、总要测试吧?——那就免不了用到http server。我先前都是用visual studio的,虽然很好用,功能很强大,但是我就开发一个html、javascript、css,干嘛用这种傻大本粗的东西。打开一次特别慢,占内存特别厉害,安装时C盘占去好几个G的空间。

后来闲来无事就换成了nodejs。不用安装任何插件,只需要手动创建三个小文件(总共才2KB),运行即可,速度很快。感觉真的是非常简单、轻量化。特此分享,知道的请略过,不喜勿喷!

2. 四步搭建

第一步,安装nodejs:

不多废话,到www.nodejs.org下载安装即可。

第二步,创建两个js文件

创建两个js文件,分别保存为 server.js  和  mime.js ,代码如下:

 1 var PORT = 8080;       //端口
 2 var DIR = ‘test1‘;     //用于存放html的目录
 3
 4 var http = require(‘http‘);
 5 var url=require(‘url‘);
 6 var fs=require(‘fs‘);
 7 var mine=require(‘./mine‘).types;
 8 var path=require(‘path‘);
 9
10 var server = http.createServer(function (request, response) {
11     var pathname = url.parse(request.url).pathname;
12     var realPath = path.join(DIR, pathname);
13     //console.log(realPath);
14     var ext = path.extname(realPath);
15     ext = ext ? ext.slice(1) : ‘unknown‘;
16     fs.exists(realPath, function (exists) {
17         if (!exists) {
18             response.writeHead(404, {
19                 ‘Content-Type‘: ‘text/plain‘
20             });
21
22             response.write("This request URL " + pathname + " was not found on this server.");
23             response.end();
24         } else {
25             fs.readFile(realPath, "binary", function (err, file) {
26                 if (err) {
27                     response.writeHead(500, {
28                         ‘Content-Type‘: ‘text/plain‘
29                     });
30                     response.end(err);
31                 } else {
32                     var contentType = mine[ext] || "text/plain";
33                     response.writeHead(200, {
34                         ‘Content-Type‘: contentType
35                     });
36                     response.write(file, "binary");
37                     response.end();
38                 }
39             });
40         }
41     });
42 });
43 server.listen(PORT);
44 console.log("Server runing at port: " + PORT + ".");

server.js

 1 exports.types = {
 2   "css": "text/css",
 3   "gif": "image/gif",
 4   "html": "text/html",
 5   "ico": "image/x-icon",
 6   "jpeg": "image/jpeg",
 7   "jpg": "image/jpeg",
 8   "js": "text/javascript",
 9   "json": "application/json",
10   "pdf": "application/pdf",
11   "png": "image/png",
12   "svg": "image/svg+xml",
13   "swf": "application/x-shockwave-flash",
14   "tiff": "image/tiff",
15   "txt": "text/plain",
16   "wav": "audio/x-wav",
17   "wma": "audio/x-ms-wma",
18   "wmv": "video/x-ms-wmv",
19   "xml": "text/xml"
20 };

mine.js

我在桌面上新建一个“demo1”的文件夹,把这两个创建好的js文件拷进去。

第三步,创建一个.bat命令文件

还是那个“demo1”文件夹,再在这个文件夹中创建一个“startServer.bat”文件,文件内容其实就一句话:

node server.js

startServer.bat

此时 demo1 文件夹中就有了三个文件:

第四步,加入你的html文件

还是那个“demo1”文件夹,我们需要在这个文件中创建一个“test1”文件夹,然后我们加入一个index.html,等会儿做测试用。

重点需要注意:为什么这里会有一个“test1”文件夹呢?因为我们的“server.js”中配置的目录就是“test1”。如果你看着不顺眼,可以改掉,但是要保证两者名称一致。

如果我们在demo1中有好几个测试项目,需要运行哪一个,可以打开“server.js”修改配置即可,非常方便。

3. 一键启动

经过了上面“漫长复杂”的配置过程,到这一步就简单了。

如何“一键”启动? 大家应该都能猜到了——startServer.bat——对,双击运行startServer.bat,控制台即提示你有http server服务了。

端口号默认是“8080”,可以在“server.js”中修改,就在代码第一行。

4. 创建多个http server

咱们上面说了半天,就讲了如何创建第一个http server,其实创建第二个、第三个、第四个……都一样简单。

把 demo1 文件夹中的三个文件,考到你想要创建站点的位置。打开 server.js 修改一下端口号和目录名称,运行startServer.bat就可以了。

想在那里创建http server,就拷贝到哪里,然后运行。不想再用http server了,直接删掉那三个文件就行。

简单易用!

-------------------------------------------------------------------------------------------------------------

欢迎关注我的微博

也欢迎关注我的教程:

从设计到模式深入理解javascript原型和闭包系列》《微软petshop4.0源码解读视频》《json2.js源码解读视频

支持插入代码的富文本编辑器——wangEditor

-------------------------------------------------------------------------------------------------------------

时间: 2024-12-22 11:59:14

js便签笔记(14)——用nodejs搭建最简单、轻量化的http server的相关文章

js便签笔记(8)——js加载XML字符串或文件

1. 加载XML文件 方法1:ajax方式.代码如下: var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); xhr.open("GET", "data.xml", false); xhr.send(null); var xmlDoc = xhr.responseXML; console.log(xmlDoc

js便签笔记(12)——浏览TOM大叔博客的学习笔记 part2

1. 前言 昨天写了<js便签笔记(11)——浏览TOM大叔博客的学习笔记 part1>,简单记录了几个问题.part1的重点还是在于最后那个循环创建函数的问题,也就是多个子函数公用一个闭包数据的问题.如果觉得有兴趣,可以再重新翻出来看看. 今天继续把剩下的问题写完. 2. 作用域链 学js的人,即使初级入门的也都知道“原型链”,但是“作用域链”,可能好多人没有听说过.大部分人都知道或者听说过“闭包”,但是可能有好多人不知道闭包其实和作用域链有莫大的联系.如果理解闭包不从作用域链开始理解,那么

js便签笔记(9)——解读jquery源码时记录的一些知识点

近来一直利用业余时间在看jquery2.1.1源码,大约看了两千行了.平时看的时候,做了一些笔记,贴出来分享. 1. Array.prototype.slice.call 可以将伪数组转化为真正的数组 其实,这里所谓的"伪数组"就是有length属性,并且有"0"."1"."2"等这些属性的对象,如下代码: var obj = { 0: "A", 1: "B", 2: "C&q

js便签笔记(10) - 分享:json2.js源码解读笔记

1. 如何理解“json” 首先应该意识到,json是一种数据转换格式,既然是个“格式”,就是个抽象的东西.它不是js对象,也不是字符串,它只是一种格式,一种规定而已. 这个格式规定了如何将js对象转换成字符串.以及转换成怎样的字符串——序列化 —— JSON.stringify 接口: 以及如何将一个有效字符串转换成js对象——反序列化—— JSON.parse 接口: 2. 关于作者 json作者是 道格拉斯.克劳福德 ,是一位js大牛,写过一本<javascript语言精粹>,相信不少朋

js便签笔记(11)——浏览TOM大叔博客的学习笔记 part1

1. 前言 这两天看了一下TOM大叔的<深入理解js系列>中的基础部分,根据自己的实际情况,做了读书笔记,记录了部分容易绊脚的问题.写篇文章,供大家分享. 2. 关于HTMLCollection的“实时查询” var divs = document.getElementsByTagName("div"), i; for (i = 0; i < divs.length; i++) { //…… } 以上代码中,会出现性能问题.问题就在于divs是一个HTMLCollec

js便签笔记(13)——jsonp事实上非常easy【ajax跨域请求】

前两天被问到ajax跨域怎样解决,还真被问住了,光知道有个什么jsonp,迷迷糊糊的没有说上来.抱着有问题必须解决的态度,我看了很多资料,原来如此.. . 为何一直知道jsonp,但一直迷迷糊糊的不明确呢?--网上那些介绍资料都写的太复杂了! 我是能多简单就多简单,争取让你十分钟看完! 1. 同源策略 ajax之所以须要"跨域".罪魁祸首就是浏览器的同源策略.即,一个页面的ajax仅仅能获取这个页面同样源或者同样域的数据. 怎样叫"同源"或者"同域&quo

js便签笔记(13)——jsonp其实很简单【ajax跨域请求】

前两天被问到ajax跨域如何解决,还真被问住了,光知道有个什么jsonp,迷迷糊糊的没有说上来.抱着有问题必须解决的态度,我看了许多资料,原来如此... 为何一直知道jsonp,但一直迷迷糊糊的不明白呢?——网上那些介绍资料都写的太复杂了! 我是能多简单就多简单,争取让你十分钟看完! 1. 同源策略 ajax之所以需要“跨域”,罪魁祸首就是浏览器的同源策略.即,一个页面的ajax只能获取这个页面相同源或者相同域的数据. 如何叫“同源”或者“同域”呢?——协议.域名.端口号都必须相同.例如: ht

用nodejs搭建一个简单的服务器

使用nodejs搭建一个简单的服务器 nodejs优点:性能高(读写文件) 数据操作能力强 官网:www.nodejs.org 验证是否安装成功:cmd命令行中输入node -v 如果显示版本号表示安装成功 [常用命令] 切换盘符 d:进入文件夹 cd nodejs返回上一级目录 cd..清屏 cls展示目录 dir复制文件名 选中右键--复制历史操作 上箭头 执行文件 node 文件名(在文件文件夹目录中)停止命令行 ctrl+c nodejs可以使用的ECMAScript.读写文件.数据库操

使用 Nodejs 搭建一个简单的Web服务器

使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块.路径解析模块.以及301重定向问题,下面我们就简单讲一下如何来搭建一个简单的Web服务器. 作为一个Web服务器应具备以下几个功能: 1.能显示以.html/.htm结尾的Web页面 2.能直接打开以.js/.css/.json/.text结尾的文件内容 3.显示图片资源 4.自动下载以.apk/.