Node的Web应用框架Express的简介与搭建HelloWorld

场景

Express

Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。

Express 框架核心特性:

可以设置中间件来响应 HTTP 请求。

定义了路由表用于执行不同的 HTTP 请求动作。

可以通过向模板传递参数来动态渲染 HTML 页面。

注:

博客:
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

安装Express

本地新建一个文件夹hellpExpress,然后在此目录下打开cmd

npm init

初始化项目,会让你设置一些信息,根据自己的需要,这里直接回车

 

然后继续输入

npm install express --save

安装express

 

搭建HelloWorld并运行

然后在helloExpress下新建app.js文件,代码如下

const express = require('express')
const app = express()

app.get('/', function (req, res) {
  res.send('Hello World!')
})

app.listen(3000, function () {
  console.log('Example app listening on port 3000!')
})

上面代码表示引用express,并设置一个get请求的路由,响应一个Hello World,然后使其监听3000端口。

然后在命令行中继续输入

node app.js

 

然后打开浏览器输入:

http://localhost:3000/

 

 

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
实训报告:使用 Express 框架搭建 Web 项目 一、实验目的 通过本次实训,学生应该掌握以下技能: 1. 使用 Express 框架搭建 Web 项目; 2. 使用路由来处理不同的 HTTP 请求; 3. 使用模板引擎来渲染页面; 4. 使用中间件来处理请求和响应; 5. 实现基本的用户认证和授权。 二、实验环境 1. 操作系统:Windows 或 macOS; 2. 开发工具:Visual Studio Code; 3. 语言:Node.js 和 JavaScript。 三、实验步骤 1. 创建新项目 在 Visual Studio Code 中创建一个新的文件夹并打开终端。在终端中使用 `npm init` 命令初始化项目,并根据提示输入项目信息。接着,使用 `npm install express --save` 命令安装 Express 框架。 2. 创建主文件 在项目根目录下创建一个名为 `app.js` 的文件,并添加以下代码: ``` const express = require('express'); const app = express(); app.get('/', (req, res) => { res.send('Hello World!'); }); app.listen(3000, () => { console.log('App listening on port 3000!'); }); ``` 在这个例子中,我们创建了一个简单的 Express 应用程序,并在根路径上添加了一个路由,响应一个字符串。然后,我们使用 `app.listen()` 方法来监听端口 3000。 3. 添加路由 我们可以使用路由来处理不同的 HTTP 请求。在 `app.js` 文件中,添加以下代码: ``` // 处理 GET 请求 app.get('/users', (req, res) => { res.send('Get a list of users'); }); // 处理 POST 请求 app.post('/users', (req, res) => { res.send('Create a new user'); }); // 处理 PUT 请求 app.put('/users/:id', (req, res) => { res.send(`Update a user with ID ${req.params.id}`); }); // 处理 DELETE 请求 app.delete('/users/:id', (req, res) => { res.send(`Delete a user with ID ${req.params.id}`); }); ``` 在这个例子中,我们定义了四个路由来处理 GET、POST、PUT 和 DELETE 请求。其中,PUT 和 DELETE 请求通过 URL 中的参数来指定要操作的资源的 ID。 4. 使用模板引擎 Express 框架支持多种模板引擎,如 EJS、Pug、Handlebars 等。在本次实训中,我们使用 EJS 模板引擎来渲染页面。首先,使用 `npm install ejs --save` 命令安装 EJS 模板引擎。然后,在 `app.js` 文件中添加以下代码: ``` // 设置模板引擎 app.set('view engine', 'ejs'); // 渲染页面 app.get('/users', (req, res) => { const users = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' } ]; res.render('users', { users }); }); ``` 在这个例子中,我们使用 `app.set()` 方法来设置模板引擎为 EJS。然后,在 `/users` 路由中,我们定义了一个数组 `users`,并将其传递给 EJS 模板引擎进行渲染。最后,我们使用 `res.render()` 方法来渲染页面,并将渲染后的 HTML 响应给客户端。 5. 使用中间件 Express 框架允许我们使用中间件来处理请求和响应。在 `app.js` 文件中,添加以下代码: ``` // 记录请求日志 app.use((req, res, next) => { console.log(`${new Date().toISOString()}: ${req.method} ${req.url}`); next(); }); // 处理静态文件 app.use(express.static('public')); ``` 在这个例子中,我们定义了两个中间件。第一个中间件用来记录请求日志,它会在每个请求到达时输出请求的时间、请求方法和 URL。第二个中间件用来处理静态文件,它会将请求的 URL 映射到项目根目录下的 `public` 文件夹中。 6. 实现用户认证和授权 在本次实训中,我们使用 Passport.js 库来实现用户认证和授权。首先,使用 `npm install passport passport-local passport-local-mongoose express-session --save` 命令安装所需的库和插件。然后,在 `app.js` 文件中添加以下代码: ``` const passport = require('passport'); const LocalStrategy = require('passport-local').Strategy; const session = require('express-session'); const mongoose = require('mongoose'); const User = require('./models/user'); // 连接 MongoDB 数据库 mongoose.connect('mongodb://localhost/myapp', { useNewUrlParser: true, useUnifiedTopology: true }).then(() => { console.log('Connected to MongoDB'); }).catch((err) => { console.error('Failed to connect to MongoDB', err); }); // 配置 Passport.js const strategy = new LocalStrategy({ usernameField: 'email', passwordField: 'password' }, async (email, password, done) => { try { const user = await User.findOne({ email }); if (!user) { return done(null, false, { message: 'Incorrect email or password.' }); } const isMatch = await user.comparePassword(password); if (!isMatch) { return done(null, false, { message: 'Incorrect email or password.' }); } return done(null, user); } catch (err) { return done(err); } }); passport.use(strategy); passport.serializeUser((user, done) => { done(null, user.id); }); passport.deserializeUser(async (id, done) => { try { const user = await User.findById(id); done(null, user); } catch (err) { done(err); } }); // 配置 Express.js app.use(express.urlencoded({ extended: true })); app.use(session({ secret: 'myapp', resave: false, saveUninitialized: false })); app.use(passport.initialize()); app.use(passport.session()); // 处理登录请求 app.get('/login', (req, res) => { res.render('login'); }); app.post('/login', passport.authenticate('local', { successRedirect: '/', failureRedirect: '/login', failureFlash: true })); // 处理注销请求 app.get('/logout', (req, res) => { req.logout(); res.redirect('/'); }); // 处理用户信息请求 app.get('/profile', (req, res) => { if (!req.user) { return res.redirect('/login'); } res.render('profile', { user: req.user }); }); ``` 在这个例子中,我们使用 `mongoose` 库连接到 MongoDB 数据库,并定义了一个名为 `User` 的模型来表示用户。然后,我们使用 Passport.js 配置了本地认证策略,并将其添加到 Express.js 应用程序中。接着,我们使用中间件来处理登录请求、注销请求和用户信息请求。在登录请求中,我们使用 `passport.authenticate()` 方法来验证用户的邮箱和密码,并在验证成功时重定向到首页。在注销请求中,我们使用 `req.logout()` 方法来注销用户。在用户信息请求中,我们检查用户是否已登录,如果未登录,则重定向到登录页面,否则渲染用户信息页面。 四、实验总结 通过本次实训,我们学习了使用 Express 框架搭建 Web 项目的基本步骤,并实现了路由、模板引擎、中间件和用户认证和授权等功能。这些技能在 Web 开发中都非常重要,可以帮助我们更加高效地开发 Web 应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

霸道流氓气质

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值