写了一个篇博客关于Nodejs express3使用介绍

写了一个篇博客关于Nodejs express3使用介绍

写了一个篇博客关于express3使用介绍 http://blog.fens.me/nodejs-express3/

Nodejs给Javascript赋予了服务端应用的生命，Jquery让Javascript成为浏览中开发的利器。 最近学习了Nodejs的Express3.0的开发框架，本来是按照“node.js开发指南”书中介绍，但“node.js开发指南”讲的是Express2.x的，从Express2.x到Express3.0自己模索中还是走了不少弯路的。

enter image description here

写篇文章总结一下。

目录

此文重点介绍Express3.0的开发框架，其中还会涉及到Mongoose,Ejs,Bootstrap等相关内容。

建立工程 目录结构 Express3.0配置文件 Ejs模板使用 Bootstrap界面框架 路由功能 Session使用 页面提示 页面访问控制

全文链接 http://blog.fens.me/nodejs-express3/


16 回复

写了一个篇博客关于Nodejs Express3使用介绍

引言

Node.js 给 JavaScript 赋予了服务端应用的生命，jQuery 让 JavaScript 成为浏览器中的开发利器。最近我学习了 Node.js 的 Express 3.0 开发框架，原本是按照《Node.js 开发指南》一书中的介绍进行学习，但该书主要讲解的是 Express 2.x 版本的内容。从 Express 2.x 迁移到 Express 3.0 时，我经历了一些曲折，因此决定写一篇文章来总结这些经验。

目录

  • 建立工程
  • 目录结构
  • Express3.0 配置文件
  • Ejs 模板使用
  • Bootstrap 界面框架
  • 路由功能
  • Session 使用
  • 页面提示
  • 页面访问控制

全文链接

阅读原文

详细内容

建立工程

首先，我们需要安装 Node.js 和 Express 3.0。可以使用以下命令：

npm install -g express-generator

创建一个新的 Express 项目：

express myapp
cd myapp
npm install

这将生成一个基本的 Express 应用程序，并安装所需的依赖项。

目录结构

一个典型的 Express 3.0 项目的目录结构如下：

myapp/
├── bin/
│   └── www
├── node_modules/
├── public/
│   ├── images/
│   ├── javascripts/
│   └── stylesheets/
│       └── style.css
├── routes/
│   ├── index.js
│   └── user.js
├── views/
│   ├── error.ejs
│   ├── index.ejs
│   └── layout.ejs
├── app.js
├── package.json
└── README.md

Express3.0 配置文件

app.js 是 Express 应用程序的核心文件。以下是一个简单的例子：

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/user');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// middleware
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

// routes
app.use('/', routes);
app.use('/users', users);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});

module.exports = app;

Ejs 模板使用

Ejs 是一个简单易用的模板引擎。以下是一个简单的 index.ejs 文件示例：

<!DOCTYPE html>
<html>
<head>
  <title>My App</title>
</head>
<body>
  <h1>Welcome to <%= title %></h1>
  <p>This is a simple EJS template example.</p>
</body>
</html>

在路由中渲染这个视图：

var express = require('express');
var router = express.Router();

router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

Bootstrap 界面框架

你可以通过 CDN 或者 npm 安装 Bootstrap 来使用它：

npm install bootstrap

在 public/stylesheets/style.css 中引入 Bootstrap 样式：

<link rel="stylesheet" href="/stylesheets/bootstrap.min.css">

路由功能

路由是 Express 应用程序的关键部分。我们已经看到如何定义基本的路由。更复杂的路由可以这样定义：

router.get('/profile', function(req, res, next) {
  res.send('Profile Page');
});

Session 使用

使用 express-session 来管理会话：

npm install express-session

在 app.js 中添加中间件：

var session = require('express-session');

app.use(session({
  secret: 'secret',
  resave: false,
  saveUninitialized: false
}));

页面提示

可以使用 connect-flash 来显示临时消息：

npm install connect-flash

在 app.js 中添加中间件：

var flash = require('connect-flash');

app.use(flash());

router.get('/', function(req, res, next) {
  req.flash('info', 'Welcome to the home page');
  res.render('index', { title: 'Express' });
});

页面访问控制

通过检查用户会话来控制页面访问：

router.get('/admin', function(req, res, next) {
  if (!req.session.user) {
    return res.redirect('/login');
  }
  res.render('admin');
});

更多详细内容和示例代码请参考我的博客文章 Node.js Express3 使用介绍。希望这篇文章能帮助你更好地理解和使用 Express 3.0。


哈哈，大哥果然牛人，这里都能看到dataguru，hadoop嘿嘿，顶一个！

呵呵，你也在参加了dataguru的课程吗？？同学啊！

大师，请教一个问题 header文件的css在请求地址“http://127.0.0.1:3000/123/2013-5-16/文章内容” 时丢失了，怎么解决？

我看不到你的网站。。

css请求找不到，就直接改到正确地址就行了。

header.html文件

<link href="/stylesheets/bootstrap.min.css" rel="stylesheet" media="screen">

撸主，我很认真地在学习你的这篇介绍 PS：我也是看了NodeJS开发指南中间模仿的时候很无解

我遇到的问题是在加入session-mongoose之后修改了app.js加入相关配置 app.js文件加入的配置顺序已经检查过 我执行过’D:\workspace\project\nodejs-demo>npm install session-mongoose’之后 直接进入demo目录执行app.js出错

events.js:72
throw er; // Unhandled 'error' event
          ^
Error: failed to connect to [localhost:27017]

求解 我的环境是Fedora 18 express 3.2.4

当然我执行的不是D:\workspace\project\nodejs-demo>npm install session-mongoose 我执行的是相应目录下的npm install session-mongoose指令

这个太v5了，感谢lz我可以继续goon了

把地址和mongo的colletion核对一下，我曾卡在一样的低级错误几小时 在不行用npm list查看编译有没错误，按理说你的环境应该没问题 在不行就贴代码上来吧

你能多贴一些错误信息吗？ localhost:27017，端口打开了吗？

继续努力，哈!

太好了！

<%=locals.user.name%>, locals是读不到的，可以直接用<%=user.name%>

res.locals作用是req每次都传值给页面，res.locals, req句柄在ejs中是得不到的，我们是直接使用里面的变量。

感谢回复，这是我的问题帖子 能帮看看吗，谢谢。 enter link description here

先收下了

Nodejs Express3 使用介绍

Express 是一个简洁而灵活的 Node.js Web 应用程序开发框架，提供了一系列强大的特性来帮助开发人员创建各种 Web 和移动设备的应用程序。本文将详细介绍如何使用 Express 3.0 开发框架，并涉及 Mongoose、Ejs、Bootstrap 等相关技术。

目录

  1. 建立工程
  2. 目录结构
  3. Express3.0 配置文件
  4. Ejs 模板使用
  5. Bootstrap 界面框架
  6. 路由功能
  7. Session 使用
  8. 页面提示
  9. 页面访问控制

1. 建立工程

首先需要安装 Node.js 和 npm（Node 包管理器）。然后通过以下命令初始化一个新的项目：

mkdir myapp
cd myapp
npm init

接着安装 Express 3.0：

npm install express@3.0 --save

为了简化开发过程，还可以安装 Ejs 模板引擎和 Bootstrap 框架：

npm install ejs --save
npm install bootstrap --save

2. 目录结构

典型的 Express 3.0 项目目录结构可能如下：

myapp/
|-- node_modules/
|-- views/
|   |-- index.ejs
|-- public/
|   |-- css/
|       |-- style.css
|-- app.js
|-- package.json

3. Express3.0 配置文件

app.js 文件是 Express 应用程序的核心文件。示例如下：

var express = require('express');
var app = express();

// 设置模板引擎
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');

// 静态资源目录
app.use(express.static(__dirname + '/public'));

// 路由定义
app.get('/', function(req, res) {
    res.render('index', { title: 'Home Page' });
});

app.listen(3000);
console.log('App started on port 3000');

4. Ejs 模板使用

Ejs 是一种简单易用的模板引擎。在 views/index.ejs 中可以这样写：

<!DOCTYPE html>
<html>
<head>
    <title><%= title %></title>
</head>
<body>
    <h1>Welcome to <%= title %></h1>
</body>
</html>

5. Bootstrap 界面框架

Bootstrap 提供了丰富的样式组件。可以在 public/css/style.css 中引入 Bootstrap 样式：

<link rel="stylesheet" href="/css/bootstrap.min.css">

6. 路由功能

路由用于定义不同 URL 请求对应的处理函数。在 app.js 中可以添加更多路由：

app.get('/about', function(req, res) {
    res.send('About page');
});

7. Session 使用

Session 可以用来保存用户会话信息。首先安装 express-session：

npm install express-session --save

然后在 app.js 中启用 session：

var session = require('express-session');
app.use(session({
    secret: 'secret-key',
    resave: false,
    saveUninitialized: true
}));

8. 页面提示

可以通过设置 session 或 flash message 来显示提示信息。例如：

req.session.message = "Welcome!";
res.redirect('/');

在 index.ejs 中显示：

<% if (message) { %>
    <div class="alert alert-info"><%= message %></div>
<% } %>

9. 页面访问控制

通过中间件实现页面访问控制：

function checkAuth(req, res, next) {
    if (!req.isAuthenticated()) {
        return res.redirect('/login');
    }
    next();
}

app.get('/dashboard', checkAuth, function(req, res) {
    res.send('Dashboard');
});

以上就是 Express 3.0 的基本使用方法，希望对你有所帮助！更多细节可以参考 原文链接。

回到顶部