使用express框架创建服务器，实现表单数据的提交和文件上传

最新推荐文章于 2023-05-31 16:18:03 发布

陈善强

最新推荐文章于 2023-05-31 16:18:03 发布

阅读量591

点赞数

分类专栏： NodeJs 文章标签： express服务器 express 数据表单提交 express 文件上传

本文链接：https://blog.csdn.net/chenshanqiang/article/details/103053546

版权

NodeJs 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

在使用express框架创建服务器前期准备工作：

使用npm install express --save命令安装express模块

以上命令会将 Express 框架安装在当前目录的 node_modules 目录中， node_modules 目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的：

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

创建server.js，代码如下：

// 模块引入开始
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var fs = require("fs");
var multer = require('multer');

/* 

 *cookie-parse是一个解析cookie的工具，通过req.cookie可以取到传过来的cookie

 *cookie-parse,只是个req对象添加了cookies属性，设置cookie和express中相同

 */

var cookieParser = require('cookie-parser');
var util = require('util');

// 模块引入结束
//创建application/x-www-form-urlencoded编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false });

// 设置静态文件路径
app.use('/public', express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/' }).array('image'));
app.use(cookieParser());

// 主页输出
app.get('/index.html', (req, res) => {
    res.cookie('username', 'Jack'); //express设置cookie
    res.sendFile(__dirname + "/" + "index.html");
});

//表单数据提交
app.post('/process_get', urlencodedParser, (req, res) => {
    // 输出 JSON 格式
    var response = {
        "first_name": req.body.first_name,
        "last_name": req.body.last_name
    };
    console.log(response);
    // 文件上传开始
    var des_file = __dirname + "/public/file/" + req.files[0].originalname;
    fs.readFile(req.files[0].path, (err, data) => { //读取上传文件
            fs.writeFile(des_file, data, (err) => { //写入文件，即上传文件
                if (err) {
                    console.log(err);
                } else {
                    response = {
                        message: 'File uploaded successfully',
                        filename: req.files[0].originalname
                    }
                }
                console.log(response)
                res.end(JSON.stringify(response));
            })
        })
        // 文件上传结束
    res.end(JSON.stringify(response));

})

var server = app.listen(8888, () => {
    var host = server.address().address
    var port = server.address().port
    console.log("应用实例，访问地址为 http://%s:%s", host, port)

});

同时创建index.html网页，源码如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>nodejs服务器创建</title>
</head>
<body>
    <form action="/process_get" method="POST" enctype="multipart/form-data">
        <label>Name:</label> <input type="text" name="first_name"> <br>
        <label>Last Name:</label> <input type="text" name="last_name"><br>
        <input type="file" name="image" size="50" /><br>
        <input type="submit" value="Submit">
    </form>
</body>
</html>
<html>

index.html、server.js、node_modules在同一目录下

使用npm server.js执行，运行结果是

陈善强

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
使用express框架创建服务器，实现表单数据的提交和文件上传

在使用express框架创建服务器前期准备工作：使用npm install express --save命令安装express模块以上命令会将 Express 框架安装在当前目录的node_modules目录中，node_modules目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的： body-parser- node...
复制链接

扫一扫