美文网首页
11_Node.js Express 框架

11_Node.js Express 框架

作者: e20a12f8855d | 来源:发表于2019-01-28 17:33 被阅读2次

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

Express 除了为 http 模块提供了更高层的接口外，还实现了
许多功能，其中包括：

  • 路由控制；
  • 模板解析支持；
  • 动态视图；
  • 用户会话；
  • CSRF 保护；
  • 静态文件服务；
  • 错误控制器；
  • 访问日志；
  • 缓存；
  • 插件支持。

需要指出的是，Express 不是一个无所不包的全能框架，像 Rails 或 Django 那样实现了
模板引擎甚至 ORM （Object Relation Model，对象关系模型），它只是一个轻量级的 Web架，多数功能只是对 HTTP 协议中常用操作的封装，更多的功能需要插件或者整合其他模块来完成。

一、安装 Express

执行：

npm install express -s

此外还需要安装几个模块：

npm install body-parse -s
npm install cookie-parser -s
cnpm install multer -s
  • body-parser：node.js 中间件，用于处理 JSON, Raw, Text 和 URL 编码的数据。
  • cookie-parser：这就是一个解析Cookie的工具，通过 request.cookies 可以取到传过来的 cookie，并把它们转成对象。
  • multer：node.js 中间件，用于处理 enctype="multipart/form-data"（设置表单的MIME编码）的表单数据。

二、Express 框架实例

express02.js

const express = require('express');
let app = express();
app.get('/', (request, response) => {
    response.send('Express 模块。');
    response.end();
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express02.js，访问 127.0.0.1:3000/。

三、路由

路由决定了由谁(指定脚本)去响应客户端请求，在 HTTP 请求中，我们可以通过路由提取出请求的 URL 以及 GET/POST 参数。

express03.js

const express = require('express');
console.log(express);
let app = express();
// GET 请求
app.get('/', (request, response) => {
    console.log("主页 GET 请求。");
    response.send('主页 GET 请求。');
    response.end();
});

// POST 请求
app.post('/', (request, response) => {
    console.log("主页 POST 请求。");
    response.send('主页 POST 请求。');
    response.end();
});
// /del_user 页面 GET 请求
app.get('/del_user', (request, response) => {
    console.log("删除用户页面GET 请求。");
    response.send('删除用户页面。');
    response.end();
});
// /list_user 页面 GET 请求
app.get('/list_user', (request, response) => {
    console.log("用户列表页面 GET 请求。");
    response.send('用户列表页面。');
    response.end();
});
// 对页面 abcd,abxcd,ab123cd，等响应 GET　请求。
app.get('/ab*cd', (request, response) => {
    console.log("/ab*cd GET 请求。");
    response.send('/ab*cd GET 页面。');
    response.end();
});

const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express03.js，访问 以下地址：




四、静态文件

Express 提供了内置的中间件 express.static 来设置静态文件如：图片，CSS，JavaScript 等，你可以使用 express.static 中间件来设置静态文件路径。

例如，如果你将图片，CSS，JavaScript 等文件放在 public 目录下，你可以这么写：

app.use(express.static('public'));

express04.js

const express = require('express');
let app = express();
app.use(express.static('public'));
app.get('/', (request, response) => {
    response.send('express.static 静态文件。');
    response.end();
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express04.js，在浏览器访问 127.0.0.1:3000/images/user.jpg。

五、GET 方法

以下实例演示了在表单中通过 GET 方法提交两个参数，我们可以使用 server.js 文件内的 process_get 路由器来处理输入。

public/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>GET 方法</title>
</head>

<body>
    <form action="http://127.0.0.1:3000/process_get" method="GET">
        First Name：<input type="text" name="first_name"> <br>
        Last Name：<input type="text" name="last_name">
        <input type="submit" value="提交">
    </form>
</body>

</html>

express05get.js

const express = require('express');
let app = express();
app.use(express.static('public'));
app.get('/process_get', (request, response) => {
    // 输出 JSON 格式
    let result = {
        'first_name': request.query.first_name,
        'last_name': request.query.last_name
    };
    console.log(result);
    response.end(JSON.stringify(result));
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express05get.js，在浏览器访问 127.0.0.1:3000/index.html，向表单输入数据并提交。


六、GET 方法

以下实例演示了在表单中通过 POST 方法提交两个参数，我们可以使用 server.js 文件内的 process_post 路由器来处理输入。

public/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>GET 方法</title>
</head>

<body>
    <form action="http://127.0.0.1:3000/process_post" method="POST">
        First Name：<input type="text" name="first_name"> <br>
        Last Name：<input type="text" name="last_name">
        <input type="submit" value="提交">
    </form>
</body>

</html>

express06post.js

const express = require('express');
let app = express();
const bodyParser = require('body-parser');

// 创建 application/x-www-form-urlencoded 编码解析
let urlencodedParser = bodyParser.urlencoded({
    extended: false
});

app.use(express.static('public'));
app.get('/process_post', urlencodedParser, (request, response) => {
    // 输出 JSON 格式
    let result = {
        'first_name': request.query.first_name,
        'last_name': request.query.last_name
    };
    console.log(result);
    response.end(JSON.stringify(result));
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express06post.js，在浏览器访问 127.0.0.1:3000/index.html，向表单输入数据并提交。


七、文件上传

以下实例我们创建一个用于上传文件的表单，使用 POST 方法，表单 enctype 属性设置为 multipart/form-data。

public/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>文件上传</title>
</head>

<body>
    <form action="/file_upload" method="post" enctype="multipart/form-data">
        选择一个文件上传：<input type="file" name="image" size="50">
        <input type="submit" value="上传">
    </form>
</body>

</html>

express07file_upload.js

const express = require('express');
let app = express();
const fs = require('fs');
const bodyParser = require('body-parser');
const multer = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({
    extended: false
}));
app.use(multer({
    dest: '/tmp/'
}).array('image'));

app.post('/file_upload', (request, response) => {
    console.log(request.files[0]); // 上传文件的信息
    let des_file = __dirname + '/' + request.files[0].originalname;
    fs.readFile(request.files[0].path, (err, data) => {
        fs.writeFile(des_file, data, (err) => {
            if (err) {
                console.log(err);
                return false;
            } else {
                result = {
                    message: "File uploaded successfully!",
                    filename: request.files[0].originalname
                };
            };
            console.log(result);
            response.end(JSON.stringify(result));
        });
    });
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express07file_upload.js，在浏览器访问 127.0.0.1:3000/index.html，上传一张图片，成功上传后会出现在当前目录下。



八、Cookie 管理

我们可以使用中间件向 Node.js 服务器发送 cookie 信息，以下代码输出了客户端发送的 cookie 信息。

express08Cookie.js

const express = require('express');
const cookieParser = require('cookie-parser');
const util = require('util');

let app = express();
app.use(cookieParser());
app.get('/', (request, response) => {
    console.log("Cookies:" + util.inspect(request.cookies));
    response.end();
});
const server = app.listen(3000, '127.0.0.1', () => {
    const host = server.address().address;
    const port = server.address().port;
    console.log(`服务器运行在 http://${host}:${port}`);
});

执行 node express08Cookie.js，在浏览器访问 127.0.0.1:3000/。

期待您的关注！

相关文章

网友评论

      本文标题：11_Node.js Express 框架

      本文链接：https://www.haomeiwen.com/subject/qfxzjqtx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|11_Node.js Express 框架|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！