express基础

express基础

1.1 express介绍

Express基于 Node.js 平台，快速、开放、极简的 Web 开发框架

Express 是一个保持最小规模的灵活的 Node.js Web 应用程序开发框架，为 Web 和移动应用程序提供一组强大的功能

1.1.1 使用express创建服务器

a)、安装express

npm install express --save
npm install express -S
npm i express -S

可以使用淘宝镜像cnpm代替npm

在控制台中输入如下指令，以后即可使用cnpm代替npm

npm install -g cnpm --registry=https://registry.npm.taobao.org

b)、 创建一个express服务器

• 创建一个文件夹expressserver,进入文件夹并且安装express

mkdir expressserver
cd expressserver
cnpm i express -S

• 创建index.js

const express = require('express'); // 第三方模块

// 实例化一个express对象
const app = express();

app.get('/', (req, res) => {
  res.send('hello word');
})

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=admin&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.1.2 express生成器直接生成项目 — 脚手架

通过应用生成器工具 express-generator 可以快速创建一个应用的骨架
express-generator 包含了 express 命令行工具

a)、安装express项目生成器

cnpm i express-generator -g

b)、使用命令创建项目

–view=ejs 并不是必须得加的，如果不加，最终默认的模板是jade语法，相比ejs语法，jade语法的学习成本更高

npm/cnpm 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.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.1.4 路由

路由是指确定应用程序如何响应对特定端点的客户端请求，该请求是URI（或路径）和特定HTTP请求方法（GET，POST等）。每个路由都可以有一个或多个处理函数，这些函数在路由匹配时执行。

app.METHOD(PATH, HANDLER)

• app是一个实例express。
• METHOD是一个HTTP请求方法，小写。
• PATH 是服务器上的路径。
• HANDLER 是路由匹配时执行的功能。

1.1.5 中间件

中间件函数是可以访问请求对象 （req），响应对象（res）以及next应用程序请求 - 响应周期中的函数的函数。该next功能是Express路由器中的一个功能，当被调用时，它将执行当前中间件之后的中间件。
可以使用 app.use() 调用中间件

app.js中使用的app.use()都属于

2、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>
<% } %>