我们这一期做一个简易的http服务器。

先建一个文件夹，就算是一个空的项目了。然后新建app.js和package.json文件。

这样一个简易项目的基本文件就建好了。

通过命令行工具，在项目路径下输入：

E:\project\heron-lesson>npm install express --save

通过npm命令安装最新版的express。我现在的版本是

express@4.12.3

通过npm install express --save 命令安装的库。会在你的项目里的node_modules文件夹内。同时--save参数会保存项目依赖到package.json文件里。不要忽视package.json文件，他对文件管理起到重要的作用。

回到app.js文件，只需要三行代码，就能完成一个http服务器。

 var express = require('express');

 var app = express();

 app.listen(3000); // 监听端口3000

推荐使用ide webstorm。授权问题自行百度，你懂的。

直接run app.js

现在这个http服务器占用3000端口，并没有任何的路由，这是我们打开 http://127.0.0.1:3000/ 页面。会看到

Cannot GET /

的提示。

然后我们来编写一个路由

 var express = require('express');

 var app = express();

 app.listen(3000); // 监听端口3000

 app.get('/', function (req, res) {

     return res.send('hello world');

 });

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

 var path = require('path');

 var express = require('express');

 var app = express();

 app.listen(3000); // 监听端口3000

 // get: /

 app.get('/', function (req, res) {

     return res.send('hello world');

 });

 // get: /index

 app.get('/index', function (req, res) {

     return res.sendFile(path.join(__dirname, 'index.html'));

 });

通过导入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代码

 var path = require('path');

 var express = require('express')

 var bodyParser = require('body-parser');

 var app = express();

 app.listen(3000); // 监听端口3000

 app.use(bodyParser.json());

 app.use(bodyParser.urlencoded({ extended: true }));

 // get: /

 app.get('/', function (req, res) {

     return res.send('hello world');

 });

 // get: /index

 app.get('/index', function (req, res) {

     return res.sendFile(path.join(__dirname, 'index.html'));

 });

 // get: /login

 app.get('/login', function (req, res) {

     return res.sendFile(path.join(__dirname, 'login.html'));

 });

 // post: /login

 app.post('/login', function (req, res) {

     if (req.body.userName === 'admin' && req.body.password === 'password')

         return res.send('ok');

     else

         return res.send('no');

 });

至此，简易http服务。正常的get、post请求已经可以处理了。

访问 http://127.0.0.1:3000/login 并输入 admin和password。就能看到ok的提示。

项目地址：demo2

下载后可通过npm install -d 来安装依赖

下一期会讲到如何分离文件，和一些进阶用法。

Node填坑教程——简易http服务器的更多相关文章

  1. Node填坑教程——前言

    Node是什么? Node 是一个服务器端 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用程序,编写能够处理数万条同时连接到一个(只有一个)物 ...

  2. Node填坑教程——HelloWorld

    环境安装(极简): Node需要的环境可以说及其简单,也可以说及其复杂.为什么这么说呢? 如果里只需要运行环境那么到Node官网下载一个包就行了.里面自带npm管理工具,这是包管理工具,以后会频繁的使 ...

  3. Node填坑教程——整理文件

    如果你能把所有代码写进一个文件,并且能很好的管理.协调.多人开发.那么可以跳过这期(请务必带我飞). 我们接着完善上期的代码,给代码分家. node并没有启动入口,更没有固定的项目结构,文件配置.这些 ...

  4. Node填坑教程——过滤器

    所谓“过滤器”,只是一个概念,可以理解是一个路由,也可以理解为一个中间件.原理非常简单,就是利用匹配规则,让其有限匹配在正常的路由前面处理就行了. 比如有如下路由 app.get('/', funct ...

  5. Node填坑教程——常用库

    作为函数式编程来说,流程控制和函数库是必不可少的(应该吧). 下面我们介绍两个常用的库. lodash:完整的api请参阅,https://lodash.com/docs.这里我们只演示几个简单的例子 ...

  6. ReactNative 从环境和第一个demo说起，填坑教程

    一.React-Native MacOS必备环境配置: 1.安装homebrew(这东西可以理解为命令行的app商店) /usr/bin/ruby -e "$(curl -fsSL http ...

  7. backbone新手填坑教程资源

    backbone 入门第二版 http://www.kancloud.cn/kancloud/backbonejs-learning-note/49379 backbone 入门讲解 http://w ...

  8. Vue3+Typescript+Node.js实现微信端公众号H5支付(JSAPI v3)教程--各种填坑

    ----微信支付文档,不得不说,挺乱!(吐槽截止) 功能背景 微信公众号中,点击菜单或者扫码,打开公众号中的H5页面,进行支付. 一.技术栈 前端:Vue:3.0.0,typescript:3.9.3 ...

  9. 即将上线的flume服务器面临的一系列填坑笔记

      即将上线的flume服务器面临的一系列填坑笔记 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任.   一.flume缺少依赖包导致启动失败! 报错信息如下: 2018-10-17 ...

随机推荐

  1. POJ - 2828 Buy Tickets (段树单点更新)

    Description Railway tickets were difficult to buy around the Lunar New Year in China, so we must get ...

  2. java线程API学习 线程池ThreadPoolExecutor(转)

    线程池ThreadPoolExecutor继承自ExecutorService.是jdk1.5加入的新特性,将提交执行的任务在内部线程池中的可用线程中执行. 构造函数 ThreadPoolExecut ...

  3. 笔试题&amp;面试题：设计一个复杂度为n的算法找到单向链表倒数第m个元素

    设计一个复杂度为n的算法找到单向链表倒数第m个元素.最后一个元素假定是倒数第0个. 提示:双指针查找 相对于双向链表来说,单向链表仅仅能从头到尾依次訪问链表的各个节点,所以假设要找链表的倒数第m个元素 ...

  4. keyboard splitting bug on ipad with ios 5 and 6 (Cocos2d-x)

    Had the same issue - the solution is to stop the opengl layer from rendering while this is happening ...

  5. TortoiseGit push失败原因小结（转）

    花了我一个晚上,终于弄明白为什么总是 push 失败的原因了!竟然是因为我用的是注册的用户名而不是邮箱名……囧死. 另外搞清楚了一个问题,就是 Git 和远程仓库交互有两种方式,即 https 方式和 ...

  6. hdu 2141 Can you find it?（二分查找变例）

    Problem Description Give you three sequences of numbers A, B, C, then we give you a number X. Now yo ...

  7. .NET 中易混淆的概念（Delegate vs Event）

    事件(event)是一个非常重要的概念,我们的程序时刻都在触发和接收着各种事件:鼠标点击事件,键盘事件,以及处理操作系统的各种事件.所谓事件就是 由某个对象发出的消息.比如用户按下了某个按钮,某个文件 ...

  8. mac github工具将命令当下来的代码拖入macgithub中就可以

    mac github工具将命令当下来的代码拖入macgithub中就可以,刚開始傻傻的就知道点击那个加入button,总是在当下来的文件夹下创建个文件夹.并且代码不能同步

  9. css布局之选择切换按钮

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. 私人定制javascript中对象小知识点(Only For Me)

    废话不多讲,先上笑话,然后再,.看懂这个的说明你的节操已经不再了. 晚饭后去理发店理发...割了吧...老板问我怎么剪,我悠悠的来一句往帅了剪...高潮往往令人想不到....旁边一在焗油烫头发的大妈说 ...