Express

Express 是整个 Node.js 之中最为常见的一个框架（开发包），可以帮助我们快速构建一个WEB项目。（http://expressjs.com）

1.在 F 盘新建 nodejsdemo，cd nodejsdemo ，执行

npm install express

F:\nodejsdemo，可想象为 Eclipse 的工作区，一个工作区可定义多个项目。

2.创建express项目，在 F:\nodejsdemo 中有了 myprojuect 文件夹，目录详细如下

F:\nodejsdemo>express -e myproject

   create : myproject

   create : myproject/package.json

   create : myproject/app.js

   create : myproject/public

   create : myproject/public/javascripts

   create : myproject/public/images

   create : myproject/public/stylesheets

   create : myproject/public/stylesheets/style.css

   create : myproject/routes

   create : myproject/routes/index.js

   create : myproject/routes/user.js

   create : myproject/views

   create : myproject/views/index.ejs

   install dependencies:

     $ cd myproject && npm install

   run the app:

     $ node app

app.js 作为了整个程序运行的主文件，即：只需要执行它，就可以运行 HTTP Server

app.set('port', process.env.PORT || );

http.createServer(app).listen(app.get('port'), function(){

  console.log('Express server listening on port ' + app.get('port'));

});

此时，Http服务将在 3000 端口监听用户请求。启动服务器方式如下

F:\nodejsdemo\myproject>node app.js

Express server listening on port

打开浏览器输入：http://localhost:3000/，会发现 Http 服务报错缺少 ejs，ejs 在 app.js 有定义，下载 ejs

F:\nodejsdemo>npm install ejs

再次打开http://localhost:3000/，显示正常， 默认的页面保存在 myproject/views 中。

node_modules   存放所有项目的依赖库

package.json     项目依赖配置和开发者信息

app.js               程序启动文件

public                静态文件（css、js、img）

routes               路由文件（MVC 中的C，controller）

views                页面文件（ejs 模板）

2.安装 supervisor

为了方便开发，不用每次修改 app.js 之后都重新启动，安装 supervisor 执行 supervisor app.js ，会自动加载新的 app.js 。

F:\nodejsdemo>npm install -g supervisor

3.ejs

ejs 是 web 的模板引擎之一，EJS 是一个Javascript模板库，用来从 Json 数据中生成 HTML 字符串。可方便的给用户明确、维护性良好的HTML结构。

保存所有页面都保存在 views 中，此时的 index.ejs 是一个HTML页面，若要修改为 html 格式则需要配置模板

1）在 app.js 定义加载的模块，并增加相关配置

var ejs = require('ejs');

app.engine('html',ejs.__express);

app.set('view engine', 'html');    //修改 app.set('view engine', 'html');

2）index.ejs 名改为 index.html

建立登录功能 ：login.html、welcome.html，注意：所有的文件格式必须为 UTF-8

index.html

<!DOCTYPE html>

<html>

  <head>

    <title><%= title %></title>

    <link rel='stylesheet' href='/stylesheets/style.css' />

  </head>

  <body>

    <p><a href="login">用户登录</a></p>

  </body>

</html>

login.html

<!DOCTYPE html>

<html>

  <head>

    <title><%= title %></title>

    <link rel='stylesheet' href='/stylesheets/style.css' />

  </head>

  <body>

   <h1><%= title %></h1>

<form method="post">

    用 户：<input type="text" name="userid" id="userid"><br>

    密 码：<input type="password" name="password" id="password"><br>

    <input type="submit" value="登录">

    <input type="reset" value="重置">

</form>

</body>

</html>

welcome.html

<!DOCTYPE html>

<html>

  <head>

    <title><%= title %></title>

    <link rel='stylesheet' href='/stylesheets/style.css' />

  </head>

  <body>

    <h1>欢迎<%=user.userid%>光临！</h1>

    <h1><a href="logout">注销</a></h1>

  </body>

</html>

在每一个页面之中并没有定义直接的链接，因为 Node.js  依然属于 MVC 设计模式范畴，所以针对 MVC 的实现，此处所编写的全部都属于映射名称，所有的映射路径都需要通过 app.js 进行相应的路由配置。

配置 app.js

app.get('/', routes.index);            //进入首页

app.get('/login', routes.login);    //此处还需配置 routes/index.js

app.post('/login', routes.doLogin);    //post请求，表单提交。

app.get('/logout', routes.logout);    //注销  (通过logout找到routes/index.js中exports.logout，完成页面跳转。)

app.get('/welcome', routes.welcome);//欢迎

routes/index.js 配置相关的回调函数

exports.index = function(req, res){

  res.render('index', { title: '首页' });

};

exports.login = function(req, res){

  res.render('login', { title: '登录' });    //res.render--跳转至login页面

};

exports.doLogin = function(req, res){

    var user = {userid:'admin',password:''};    // 定义用户密码

    if(req.body.userid==user.userid && req.body.password==user.password){

        res.redirect('welcome?uid='+user.userid);    // 重定向    res.redirect--app.js必须配置/welcome(app.get('/welcome', routes.welcome))

    }else{

        res.render('login', { title: '重新输入' });

    }

};

exports.logout = function(req, res){

  res.render('index', { title: '注销' });

};

exports.welcome = function(req, res){

  //如果是地址栏参数可 req.query.参数名称 接收

  var user = {userid:req.query.uid};

  res.render('welcome', { title: '欢迎', user: user });

};

在整个基础过程中，最为重要的步骤就配置 app.js 中的路由，路由的最终控制是通过 routes/index.js 配置，类似于 Servlet ，负责跳转。

Node.js 搭建Web的更多相关文章

  1. 使用 Node.js 搭建 Web 服务器

    使用Node.js搭建Web服务器是学习Node.js比较全面的入门教程,因为实现Web服务器需要用到几个比较重要的模块:http模块.文件系统.url解析模块.路径解析模块.以及301重定向技术等, ...

  2. 学习 node.js 搭建web服务器

    开始 学习使用 node.js 首先完成搭建一个 web服务器.myweb.js var http = require('http'); var url = require('url'); var h ...

  3. node.js搭建Web服务器

    Node.js 博客搭建 一. 学习需求 Node 的安装运行 会安装node,搭建node环境 会运行node. 基础模块的使用 Buffer:二进制数据处理模块 Event:事件模块 fs:文件系 ...

  4. Node.js学习笔记(五) --- 使用Node.js搭建Web服务器

    1. Node.js 创建的第一个应用 1.引入http模块 var http = require("http"); 2. 创建服务器接下来我们使用 http.createServ ...

  5. 快速使用node.js进行web开发

    首先关于node.js的学习,这里推荐一本比较好的教程,nodejs web开发指南,该书通俗易懂地将node.js语言特性讲解完之后,又从一个项目角度带领读者使用node.js学习web开发.相信这 ...

  6. 使用 Node.js 搭建微服务网关

    目录 Node.js 是什么 安装 node.js Node.js 入门 Node.js 应用场景 npm 镜像 使用 Node.js 搭建微服务网关 什么是微服务架构 使用 Node.js 实现反向 ...

  7. 使用Node.js搭建静态资源服务器

    对于Node.js新手,搭建一个静态资源服务器是个不错的锻炼,从最简单的返回文件或错误开始,渐进增强,还可以逐步加深对http的理解.那就开始吧,让我们的双手沾满网络请求! Note: 当然在项目中如 ...

  8. koa : Express出品的下一代基于Node.js的web框架

    https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/001434501579966a ...

  9. 7个Node.js的Web框架

    NodeJS也就是Node,是众所周知的使用javascript构建Web应用框架,它启动一个服务器非常简单,如下: var http = require('http'); http.createSe ...

随机推荐

  1. Junit运行在Spring环境下

    @RunWith(SpringJUnit4ClassRunner.class)让测试运行于Spring测试环境 @ContextConfiguration 用来指定加载的Spring配置文件的位置,会 ...

  2. docker 下 alpine 镜像设置时区的有效办法

    在使用Docker的时候,由于很多基础linux镜像都比较大,alpine这个仅仅几兆的linux基础镜像受到了很多人喜欢,笔者也不例外,可是由于alpine中的一些配置及命令与常见的centos等系 ...

  3. mysql多实例安装详解

    首先说明一个场景:我的电脑是ubuntu系统,之前apt-get自动安装过mysql.这也是出现错误最多的原因之一. 安装过程,其中充斥着各种错误: 6.mkdir mysql 7.groupadd  ...

  4. atitit.软件开发概念--过滤和投影 数据操作

    atitit.软件开发概念--过滤和投影 数据操作 投影的本质及扩展 物体在太阳光的照射下形成的影子(简称日影)就是平行投影.日影的方向可以反映时间 投影还比喻此物通过彼物表现出来的迹象. 作者::老 ...

  5. 实现编程时Vim自动导入相应模板

    Vim文本编辑器以简洁高效著称,那么我们在编程时能有自动加载相应的模板,从而省去一些固定的输入提升工作效率呢!当然可以,可以有多种方法实现,我这里介绍一种非常简单的方法. 首先在你的主用户文件下面建立 ...

  6. CSS3多背景应用

    /*多背景应用*/ .wrapper { width: 640px; height: 1000px; margin: auto; background: url(./images/head.jpg) ...

  7. C++常函数

    常函数即在类的成员函数参数列表后放置const的函数,常函数的作用是限制函数体对成员变量的修改,此外,常函数也不能调用非 常函数. #include <iostream> using na ...

  8. BAT-把当前用户以管理员权限运行

    相关资料: http://jingyan.baidu.com/article/72ee561a5dc24fe16138df95.html 网友求助:联想Y400,Win8系统 怎样获得管理员身份 要求 ...

  9. Qt之QThreadPool和QRunnable

    简述 QRunnable 是所有 runnable 对象的基类,而 QThreadPool 类用于管理 QThreads 集合. QRunnable 类是一个接口,用于表示一个任务或要执行的代码,需要 ...

  10. 十大Intellij IDEA快捷键<转>

    Intellij IDEA中有很多快捷键让人爱不释手,stackoverflow上也有一些有趣的讨论.每个人都有自己的最爱,想排出个理想的榜单还真是困难.以前也整理过Intellij的快捷键,这次就按 ...