express
是基于 Node.js 平台,快速、开放、极简的 Web 开发框架,也是一个保持最小规模的灵活的 Node.js Web 应用程序开发框架,为 Web 和移动应用程序提供一组强大的功能。
1.1使用express创建服务器
a) 安装express:
npm install express --save
npm install express -S
npm i express -S
安装淘宝镜像的可以将npm改为cnpm
b) 创建一个express服务器
- 创建一个文件夹expressserver,进入文件夹打开终端安装express
mkdir expressserver
cd expressserver
npm i express -S
- 创建index.js
const express = require('express'); // 第三方模块
const app = express(); // 实例化一个express对象
app.get('/', (req, res) => {
res.send('hello world');
})
app.get('/login', (req, res) => {
res.send('登录')
})
app.get('/test', (req, res) => {
res.send('测试')
})
app.listen(3000, () => {
console.log('your server is running at http://localhost:3000');
})
假设浏览器地址栏中地址为
http://localhost:3000/login?username=juntao&password=123
匹配的是/login这个路由
nodejs原生: url.parse(req.url, true).query
express: req.query
app.get('/login', (req, res) => {
console.log(req.query)
res.send('登录')
})
1.2 express生成器— 脚手架直接生成项目
通过应用脚手架 express-generator 可以快速创建一个应用的骨架
a)、安装express项目生成器(只需要在第一次时执行)
npm i express-generator -g
b)、使用命令创建项目
npm start可以启动服务器,因为package.json文件中scripts选项做了配置
express proname --view=ejs
cd proname
cnpm i
cnpm start (node ./bin/www)
c)、了解项目目录结构
- bin
www // 服务器 运行的入口文件 npm start – node ./bin/www - node_modules // 在项目中需要使用到的第三方模块
- public // 静态的资源文件夹
images
javascripts
stylesheets - routes // 路由或者是接口的定义
index.js
users.js - views // 路由所对应的页面
error.ejs
index.ejs - app.js // 应用各种中间件,设置静态资源文件夹,注册各个路由或者接口
- package.json // 描述文件,列举了项目需要使用到的依赖以及运行命令、版本号等
1.3 静态文件资源托管的介绍(static)
为了提供诸如图像、CSS 文件和 JavaScript 文件之类的静态文件,请使用 Express 中的 express.static 内置中间件函数。
在本项目中app.js处有这样一句话
app.use(express.static(path.join(__dirname, 'public')));
就可以在views/index.ejs中使用了
<link rel='stylesheet' href='/stylesheets/style.css' />
1.4 路由是什么
路由是指确定应用程序如何响应对特定端点的客户端请求,该请求是URI(或路径)和特定HTTP请求方法(GET,POST等)。每个路由都可以有一个或多个处理函数,这些函数在路由匹配时执行。
app.METHOD(PATH, HANDLER)
- app是一个实例express。
- METHOD是一个HTTP请求方法,小写。
- PATH 是服务器上的路径。
- HANDLER 是路由匹配时执行的功能。
1.5 中间件是什么
中间件函数是可以访问请求对象 (req),响应对象(res)以及next应用程序请求 - 响应周期中的函数的函数。该next功能是Express路由器中的一个功能,当被调用时,它将执行当前中间件之后的中间件。
可以使用 app.use() 调用中间件
app.js中使用的app.use()都属于
1.6、ejs模板的用法
EJS 是一套简单的模板语言,帮你利用普通的 JavaScript 代码生成 HTML 页面。EJS 没有如何组织内容的教条;也没有再造一套迭代和控制流语法;有的只是普通的 JavaScript 代码而已。
routes/index.js
router.get('/', function(req, res, next) {
res.render('index', {
title: '<mark>Express</mark>',
list: [ 'a', 'b', 'c', 'd'],
flag: true
});
});
- 前端ejs模板中使用变量
<%- title %> // 解析
<%= title %> // 转义 --- 原样输出
- 给一个页面导入一个代码片段(首页中导入共同头部)— 包含语法
<%- include('./header.ejs') %>
- 条件判断
<% if (!flag) { %>
<ul>
<li>week1</li>
</ul>
<% } %>
- 循环语句
<% for (var i = 0; i < list.length; i++) { %>
<p><%- list[i] %></p>
<% } %>