Node填坑教程——简易http服务器
我们这一期做一个简易的http服务器。
先建一个文件夹，就算是一个空的项目了。然后新建app.js和package.json文件。
这样一个简易项目的基本文件就建好了。
通过命令行工具，在项目路径下输入：
E:\project\heron-lesson>npm install express --save
通过npm命令安装最新版的express。我现在的版本是
通过npm install express --save 命令安装的库。会在你的项目里的node_modules文件夹内。同时--save参数会保存项目依赖到package.json文件里。不要忽视package.json文件，他对文件管理起到重要的作用。
回到app.js文件，只需要三行代码，就能完成一个http服务器。
1 var express = require('express'); 2 var app = express(); 3 app.listen(3000); // 监听端口3000
推荐使用ide webstorm。授权问题自行百度，你懂的。
直接run app.js
现在这个http服务器占用3000端口，并没有任何的路由，这是我们打开 http://127.0.0.1:3000/ 页面。会看到
Cannot GET /
的提示。
然后我们来编写一个路由
1 var express = require('express'); 2 3 var app = express(); 4 app.listen(3000); // 监听端口3000 5 6 app.get('/', function (req, res) { 7 return res.send('hello world'); 8 });
rerun app.js
重新访问 http://127.0.0.1:3000/ 页面，就能看到hello world了。
到这里，get请求似乎没有什么问题了。但是如何访问一个页面呢？我们再写一个路由
新建index.html文件在项目根目录。
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>Index</title> </head> <body> <h2>Index</h2> </body> </html>
再接着编写app.js
1 var path = require('path'); 2 var express = require('express'); 3 4 var app = express(); 5 app.listen(3000); // 监听端口3000 6 7 // get: / 8 app.get('/', function (req, res) { 9 return res.send('hello world'); 10 }); 11 // get: /index 12 app.get('/index', function (req, res) { 13 return res.sendFile(path.join(__dirname, 'index.html')); 14 });
通过导入path，使用path.join函数 配合__dirname来获取文件路径，我们得到index.html的完整地址。并用res.sendFile函数来发送文件到客户端。访问 http://127.0.0.1:3000/index 页面查看效果。
如果你不理解这些函数的意义，请查阅node的api https://nodejs.org/api/path.html#path_path_join_path1_path2 和expressjs的api http://expressjs.com/4x/api.html
再写一个结合post的路由。由于express4+的版本中不封装post的数据，也没集成相关的库。所以这个东西得另外下载。如法炮制使用npm安装
E:\project\heron-lesson>npm install body-parser --save
新建login.html文件到根目录
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <form action="" method="post"> UserName <input type="text" name="userName"/> Password <input type="password" name="password"/> <input type="submit"/> </form> </body> </html>
更新app.js代码
1 var path = require('path'); 2 var express = require('express') 3 var bodyParser = require('body-parser'); 4 5 var app = express(); 6 app.listen(3000); // 监听端口3000 7 8 app.use(bodyParser.json()); 9 app.use(bodyParser.urlencoded({ extended: true })); 10 11 // get: / 12 app.get('/', function (req, res) { 13 return res.send('hello world'); 14 }); 15 // get: /index 16 app.get('/index', function (req, res) { 17 return res.sendFile(path.join(__dirname, 'index.html')); 18 }); 19 // get: /login 20 app.get('/login', function (req, res) { 21 return res.sendFile(path.join(__dirname, 'login.html')); 22 }); 23 // post: /login 24 app.post('/login', function (req, res) { 25 if (req.body.userName === 'admin' && req.body.password === 'password') 26 return res.send('ok'); 27 else 28 return res.send('no'); 29 });
至此，简易http服务。正常的get、post请求已经可以处理了。
访问 http://127.0.0.1:3000/login 并输入 admin和password。就能看到ok的提示。
项目地址：demo2
下载后可通过npm install -d 来安装依赖
下一期会讲到如何分离文件，和一些进阶用法。