Express.js 创建Node.js Web应用
ccwgpt 2025-04-27 12:50 6 浏览 0 评论
Express.js
是一个基于Node.js
的Web应用框架,框架的设计目的是构建应用的架构和简化应用的开发。框架会解决一些通用的问题,在Express.js
中,Express框架
会处理如:中间件、代码控制、静态资源管理、HTML模块加载等问题。Express.js
是非常优秀的一个Web框架,本站就是基于Express
框架构建的。
1. 安装初始化
1.1 安装express
项目生成器
在Expressv4.0
之前,生成项目直接安装express
模块即可。一般会全局安装,安装命令如下:
npm install -g express
Expressv4.+
之后,Express将项目生成器分离成了单独的模块。生成项目需要安装express-generator
模块:
npm install -g express-generator
1.2 初始化应用
安装Express
后,我们就可以使用express
命令创建一个Web应用:
express my_app
以上命令输出如下:
create : my_app
create : my_app/package.json
create : my_app/app.js
create : my_app/public
create : my_app/routes
create : my_app/routes/index.js
create : my_app/routes/users.js
create : my_app/views
create : my_app/views/index.jade
create : my_app/views/layout.jade
create : my_app/views/error.jade
create : my_app/public/javascripts
create : my_app/public/images
create : my_app/public/stylesheets
create : my_app/public/stylesheets/style.css
create : my_app/bin
create : my_app/bin/www
install dependencies:
$ cd my_app && npm install
run the app:
$ DEBUG=my-application ./bin/www
Express
默认使用jade
视图,如果需要使用ejs
视图,可以在执行命令时添加-e
参数:
express -e my_app
1.3 express
命令说明
在上面我们使用express
命令创建了一个my_app
应用。express
命令详细说明如下:
语法格式: express [选项] [文件夹名]
选项:
-h, --help 输出用法说明
-V, --version 输出版本
-e, --ejs 添加 ejs 视图引擎支持(默认是jade)
-H, --hogan 添加 hogan.js 引擎支持
-c, --css <engine> 添加样式表引擎支持(less|stylus|compass)(默认为plain css)
-f, --force 强制使用非空文件夹
2. Express
应用说明
在前面我们创建my_app
,是一个基于Express
框架的Web应用程序。Express
帮我们创建应用程序的目录,并在对应文件放到了指定的目录中。这样就简化了很多操作,接下来再扩展应用程序功能时,按规则在指定的目录中添加功能文件即可。接下来,进入my_app
目录,分析下express
都创建了哪些文件。
2.1 package.json
文件
首先,有一个package.json
文件,其内容如下:
{
"name": "application-name",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"express": "~4.0.0",
"static-favicon": "~1.0.0",
"morgan": "~1.0.0",
"cookie-parser": "~1.0.1",
"body-parser": "~1.0.0",
"debug": "~0.7.4",
"ejs": "~0.8.5"
}
这个文件中是一个JSON格式的配置文件,其中包含了应用名、启动脚本、依赖包等信息:
name
:应用名version
:应用版本号private
:是否私有项目private
:是否私有项目scripts
:应用的启动脚本。在本例中,我们可以使用node ./bin/www
命令来启动应用dependencies
:应用所依赖的npm模块
2.2 public
目录
public
目录用于存放应用可能需要的静态资源,public
目录中的文件不需要在路由中映射,而可以直接访问。public
目录中包含以下三个子目录,分别放置了不同的静态资源:
images
:用于存放图片文件javascripts
:用于JS脚本文件stylesheets
:用于存放样式表文件
这三个子目录是Express
建议的标准目录。当然,我们可以按需要自行修改,如可以分别改写为更简短的目录名:img
、js
、css
。
2.3 app.js
文件
app.js
是一个服务器初始化文件,其代码结构如下:
/* 引入依赖项 */
var express = require('express');
var path = require('path');
var favicon = require('static-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var routes = require('./routes/index');
var users = require('./routes/users');
var app = express();
// 设置视图引擎目录
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// 配置一些通用的中间件
app.use(favicon());
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded());
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
// 引入路由
app.use('/', routes);
app.use('/users', users);
/// 处理404 并向下传递错误
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
/// 错误处理
// 开发模式下将输出错误堆栈信息
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
});
});
}
// 生产模式下,错误堆栈信息一般不暴露给用户
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
2.4 bin
目录及bin/www
文件
在express v4.0
版本之前,Express
通过app.js
文件启动。v4.0
版本之后,Express
启动文件独立为bin/www
文件。文件内容如下:
#!/usr/bin/env node
var debug = require('debug')('my-application');
// 引用要启动的应用
var app = require('../app');
// 设置应用监听的端口
app.set('port', process.env.PORT || 3000);
// 启动HTTP服务器
var server = app.listen(app.get('port'), function() {
debug('Express server listening on port ' + server.address().port);
});
2.5 routes
目录
routes
目录用于放置应用的路由文件。路由中设置的路径会最终暴露给用户访问,路由会按用户指定的HTTP请求方式处理服务器资源,并在处理完成后返回用户所需资源。如,routes/index
文件:
var express = require('express');
var router = express.Router();
/* GET 请求应用主页 */
router.get('/', function(req, res) {
res.render('index', { title: 'Express' });
});
module.exports = router;
在这个文件中,包含了一个GET
请求。当用户访问/
路径(即:应用主页)时,服务端会渲染index
视图文件后,返回一个HTTP页面。
2.6 views
目录
views
目录用于存入视图文件,views
目录在app.js
文件中被设置为视图文件的根目录,然后就在路由文件中根据此设置加载并渲染视图。
3. 启动应用
3.1 安装依赖包
启动应用前,需要先安装项目所依赖的npm
包,也就是package.json
文件中dependencies
节点下所引用的包。安装命令如下:
npm install
在扩展项目功能时,我们可能会引用新的npm
模块。引入新的模块时,我们可以通过npm install
命令安装并添加--save
参数,将依赖关系自动保存到package.json
文件中dependencies
节点下。如,添加一个request
模块:
npm install request --save
3.2 启动应用
安装完项目依赖包后,我们就可以通过node
命令来启动应用了:
node bin/www
项目启动后,可以在浏览中通过http://127.0.0.1:3000
或http://localhost:3000
来访问应用。
相关推荐
- NestJS入门教程系列一
-
介绍Nest(NestJS)是用于构建高效,可扩展的Node.js服务器端应用程序的框架。它使用渐进式JavaScript,内置并完全支持TypeScript(但开发人员仍然能够使用JavaScrip...
- 【推荐】一个网盘资源搜索与转存工具,支持移动端与PC端!
-
如果您对源码&技术感兴趣,请点赞+收藏+转发+关注,大家的支持是我分享最大的动力!!!项目介绍CloudSaver是一个基于Vue3和Express的网盘资源搜索与转存开源实用工具。它支持...
- Appium原理精讲
-
目前使用Appium新版本和旧版本的企业数目都很多,而两个版本的安装过程和api的使用又有较大的区别。但是无论表面上的东东如何变化,内部原理都是一样的。在这里我给大家介绍一下appium的核心,增进大...
- Kubernetes最小部署单元Pod
-
一、Kubernetes与Pod简介在当今云计算和容器化技术盛行的时代,Kubernetes已然成为容器编排领域的中流砥柱。它是一个开源的容器编排平台,由Google基于其内部使用的Bo...
- 最常用的四种跨域解决方案
-
前置知识什么是跨域?浏览器发送的请求地址(URL)与所在页面的地址不同(端口/协议/域名其一不同)。简言之,浏览器发出的请求url,与其所在页面的url不一样。此时,同源策略会让浏览器拒收服务器...
- Bolt.New —— 全栈AI Web自动编程
-
Bolt.New是由StackBlitz公司推出的,全栈AI工具,代码编辑、运行、部署,通通一站式搞定。它使用WebContainers技术,无需任何本地安装或配置,在浏览器中,就可以运行完整的No...
- Nodejs Express新手教程&高手进阶
-
NodejsExpress新手教程&高手进阶Express是一个NodeJS平台的框架,主要用于构于Web服务器项目。本文将通过示例介绍适合新手入门的Express基础使用,以及高手进阶知识,如:c...
- Express.js 创建Node.js Web应用
-
Express.js是一个基于Node.js的Web应用框架,框架的设计目的是构建应用的架构和简化应用的开发。框架会解决一些通用的问题,在Express.js中,Express框架会处理如:中间件、代...
- JavaScript 的 Express.js 功能及应用场景详解
-
Express.js是一个基于Node.js的轻量级Web应用框架,主要用于快速构建服务器端应用和API。它的核心功能包括以下关键点:1.路由管理URL路径与HTTP方法映射:通过...
- nodejs的express4文件下载
-
在nodejs的express框架中,下载变得非常简单,就一个方法,res.download()首先express命令行生成项目基本框架:不会的看这里:http://blog.csdn.net/zz...
- Express 系列:快速生成一个项目
-
系列预告本系列将以一个项目入手结合相关技术细节来带领大家一起学习Express这个基于Node.js的后端框架。本文首先将介绍:如何快速的生成一个具有一定结构的Express项目。Express项目结...
- nodejs的express自动生成项目框架
-
nodejs版本为:4.X,express版本为4.X1.全局安装2个模块express、express-generator在命令行输入:npminstall-gexpressnpminsta...
- express开发(一)简介与搭建
-
上周末去了趟上海书城,不愧是上海数得上号的书城,流行的科技书应有尽有,话不多说直接上图。最经典的C语言O(∩_∩)O最流行的java(づ ̄3 ̄)づ超酷的R语言/(ㄒoㄒ)/~~然而,身为一个坚定的前...
- Vue+Echarts可视化大屏系统后端框架搭建(附代码)
-
各位同学,大家好。上节课,前面我们讲解了Vue+Echarts前端部分的设计方法。这节课程,我们开始讲解使用Express进行后端设计的方法。01项目相关理论介绍什么是expressExpress是...
- Shopify电商API接口开发
-
Shopify电商API接口开发上线流程主要包括以下步骤。北京木奇移动技术有限公司,专业的软件外包开发公司,欢迎洽谈合作。前期准备-注册Shopify账号:在Shopify官网注册,用于后续开发测试...
你 发表评论:
欢迎- 一周热门
- 最近发表
- 标签列表
-
- MVC框架 (46)
- spring框架 (46)
- 框架图 (58)
- bootstrap框架 (43)
- flask框架 (53)
- quartz框架 (51)
- abp框架 (47)
- jpa框架 (47)
- laravel框架 (46)
- express框架 (43)
- scrapy框架 (52)
- beego框架 (42)
- java框架spring (43)
- grpc框架 (55)
- 前端框架bootstrap (42)
- orm框架有哪些 (43)
- ppt框架 (48)
- 内联框架 (52)
- winform框架 (46)
- gui框架 (44)
- cad怎么画框架 (58)
- ps怎么画框架 (47)
- ssm框架实现登录注册 (49)
- oracle字符串长度 (48)
- oracle提交事务 (47)