node.js 解析post请求 方法二

news2025/1/12 5:57:12

前提:以前面发的node.js解析post请求方法一为模板,具体见 http://t.csdnimg.cn/ABaIn

此文我们运用第二种方法:使用第三方模块formidable对post请求进行解析。

1》代码难点 ***

在Node.js中使用formidable模块来解析POST请求主要涉及到处理文件上传和多部分表单数据(multipart/form-data)以及验证上传内容的重难点。

难点解决思路:你需要创建一个formidable的实例来处理上传的表单数据。

formidable模块会将这些文件临时存储在服务器的某个位置,你需要处理这些临时文件,可能包括移动它们到最终目标的位置。

一、具体要求:

完成注册、登录、已注册的用户表单展示、文件上传功能(也就是表单填写的用户名、密码、性别这三个信息。以及选择的图片上传功能)

二、解析post请求方法二介绍

解析post请求可以通过第三方模块进行解析,如:formidable、body-parser模块等等。此处我们使用最常用的formidable模块来进行操作

三、资源配置

(1)在终端 npm install formidable -save安装formidable模块

(2)页面配置

https://blog.csdn.net/2301_76669854/article/details/138170325里的页面配置相同。唯一不同的点在于我的注册html页面。因为  enctype="multipart/form-data"涉及到文件上传,所以在方法二:使用formidable模块解析post请求时需要添加。需要保持数据格式一致。

方法二中views文件夹下的regist.html页面如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>注册</title>
  <link rel="stylesheet" href="../public/css/main.css">
</head>
<body>
  <h1>注册</h1>
  <img src="../public/images/01.png" alt=""><br>
  <form method="post" action="/doRegist" enctype="multipart/form-data"> 
    <input type="text" name="username" placeholder="用户名"><br>
    <input type="password" name="password" placeholder="密码"><br>
    <input type="radio" name="gender" value="男" checked>男
    <input type="radio" name="gender" value="女">女<br>
    <input type="file" name="head" multiple><br>  
    <!-- multiple允许选择多个文件 -->
    <input type="submit" value="注册"><br> 
  </form>
</body>
</html>

(3)在终端 npm install underscore -save安装underscore渲染模板引擎 、npm install querystring安装querystring查询模块

四、代码实现

(1)测试代码serve2.js如下:

const http = require('http');
const fs = require('fs');
const path = require('path');
const url = require('url');
// 导入formidable模块
const formidable = require('formidable');
// 声明一个专门存放所有用户的变量
var users;
// 导入查询参数的模块
const querystring = require('querystring')
// 导入underscore渲染模板
const _ = require('underscore');
//使用underscore渲染模板
function render(data) {
    // 读取模板内容
    let temp = fs.readFileSync(path.join(__dirname, 'views/404.html'));
    // 获取渲染函数
    let compiled = _.template(temp.toString());
    // 渲染模板
    return compiled(data);
}
//创建服务器
const server = http.createServer();
//读取文件。读取user.json存放用户数据的文件
fs.readFile(path.join(__dirname, 'data/users.json'), (err, data) => {
    if (err) {
        return;
    } else {
        users = JSON.parse(data.toString()); //如果读取正确就将读到的内容转换为一个对象存到users里
    }
})
//服务器做出请求响应
server.on('request', (req, res) => {
    let objurl = url.parse(req.url); //将url转为一个对象才能获取到它的pathname
    let pathname = objurl.pathname;
    // 对pathname做处理
    // 首先解决静态资源处理  (判断方法:startWith、indexOf、search、includes)
    // startsWith方法  以什么开头
    if (pathname.startsWith('/public')) {
        // 找到当前项目文件夹,再将相对路径转为绝对路径
        let p = path.join(__dirname, pathname);
        fs.readFile(p, (err, data) => {
            if (err) {
                res.end(render({ msg: '访问的文件不存在' })); //可以使用中文,因为现在是html页面去显示的
            } else {
                res.end(data);
            }
        })
    } else if (pathname == '/' || pathname == '/home') {
        let p = path.join(__dirname, 'views/index.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.end(render({ msg: '访问的文件不存在' }));
            } else {
                res.end(data);
            }
        })
    } else if (pathname == '/regist') { //建一个文件夹data专门来储存数据 里面建一个users.json的文件
        let p = path.join(__dirname, 'views/regist.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.end(render({ msg: '访问的文件不存在' }));
            } else {
                res.end(data);
            }
        })

    } else if (pathname == '/login') {
        let p = path.join(__dirname, 'views/login.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.end(render({ msg: '访问的文件不存在' }));
            } else {
                res.end(data);
            }
        })
    } else if (pathname == '/doLogin') {
        let query = querystring.parse(objurl.query);
        let username = query.username;
        let password = query.password;
        // 声明一个变量代表我的判断结果
        let result = false;
        for (let user of users) {
            if (user.username == username && user.password == password) {
                result = true;
                break;
            }
        }
        if (result) {
            res.end(render({ msg: '登录成功' }));
        } else {
            res.end(render({ msg: '用户名或密码错误,登录失败' }));
        }
    } else if (pathname == '/doRegist' && req.method.toLowerCase() == 'post') {
        //一、创建新的IncomingForm实例
        var form = new formidable.IncomingForm({
            //uploadDir指定上传文件应储存的目录
            //keepExtensions设为true 意思是 在保存上传的文件时保留其原始拓展名。
            // multiples设为true 意思是允许上传多个文件
            uploadDir: path.join(__dirname, 'public/head/'),
            keepExtensions: true,
            multiples: true
        });
        // 二、解析请求
        form.parse(req, (err, fields, files) => { //form.parse(req,callback)方法用于解析传入的请求req中的数据,解析完成后调用回调函数
            // err 若解析错误则err是包含的错误信息
            // fields 一个包含所有文本字段的对象。这些字段是由表单中的input标签或其他文本输入元素提交的(也就是我表单填写好上传的数据)
            // files 一个包含所有上传文件的对象
            if (err) {
                console.log(err.message);
            } else {
                // 若请求解析成功则创建一个新的user对象。该对象包含从表单字段中获取的 username、password、gender、head
                let user = {
                    username: fields.username,
                    password: fields.password,
                    gender: fields.gender,
                    head: files.head[0].newFilename //files.head表示regist.html上传的文件<input type="file" name="head" multiple>中的name名为head的字段。由于files.head是一个数组,所以需要files.head[0]来表示上传的第一个head文件。newFilename是由中间件在处理文件上传保存时的新文件名。可自定义
                }
                users.push(user); //将这个 user 对象添加到 users 数组的末尾
                fs.writeFile(path.join(__dirname, 'data/users.json'), JSON.stringify(users), (err) => {
                    if (err) {
                        res.end(render({ msg: '注册失败' }));
                    } else {
                        // 注册成功
                        // 重定向(服务器端主动发起一个请求)到登录页面
                        res.writeHead(302, { 'Location': '/login' });
                        res.end();
                    }
                })
            }

        });
    }
    else if (pathname == '/list') {
        let p = path.join(__dirname, 'views/users.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.end(render({ msg: '访问的文件不存在' }));
            } else {
                //获得渲染函数 
                let compiled = _.template(data.toString());
                // 调用渲染函数来生成html内容
                let html = compiled({ users: users }); //我们在模板里取的是users的属性,所以不能简写成users,而是users:users
                res.end(html);

            }
        })
    }
});
//启动监听
server.listen(3000, '127.0.0.1', () => {
    console.log('Server is running at http://127.0.0.1:3000');
})

(2)运行结果如图所示

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1635713.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

74、堆-数组中的第K个最大元素

思路&#xff1a; 直接排序是可以的&#xff0c;但是时间复杂度不符合。可以使用优先队列&#xff0c;代码如下&#xff1a; class Solution {public int findKthLargest(int[] nums, int k) {if (numsnull||nums.length0||k<0||k>nums.length){return Integer.MAX_VAL…

网工内推 | 互联网大厂百度、虎牙项目管理岗,15薪,PMP认证优先

01 百度在线 招聘岗位&#xff1a;商业项目管理组_项目管理 职责描述&#xff1a; 1. 商业部核心项目管理工作&#xff0c;主导制定项目目标、计划&#xff0c;推进项目实施及交付&#xff0c;有效管控项目进度、成本、质量、风险等 2. 商业技术/业务创新氛围建设&#xff0c;…

SQL底层执行过程

MySQL 的查询流程 客户端请求连接器 负责与客户端的通信,是半双工模式&#xff08;半双工(Half Duplex)数据传输指数据可以在一个信号载体的两个方向上传输,但是不能同时传输。&#xff09;&#xff0c;验证请求用户的账户和密码是否正确&#xff0c;③如果用户的账户和密码验…

Linux基础——Linux开发工具(下)_make/makefile

前言&#xff1a;在经过前面两篇学习&#xff0c;大家对Linux开发工具都有一定的了解&#xff0c;而在此之前最重要的两个工具就是vim&#xff0c;gcc。 如果对这两个工具不太了解&#xff0c;可以先阅读这两篇文章&#xff1a; Linux开发工具 (vim) Linux开发工具 (gcc/g) 首先…

跟TED演讲学英文:Innovating to zero! by Bill Gates

Innovating to zero! Link: https://www.ted.com/talks/bill_gates_innovating_to_zero Speaker: Bill Gates Date: February 2010 文章目录 Innovating to zero!IntroductionVocabularyTranscriptQ&A with Chris AndersonSummary后记 Introduction At TED2010, Bill Ga…

.NET C# ORM 瀚高数据库

SqlSugar ORM SqlSugar 是一款 老牌 .NET开源ORM框架&#xff0c;由果糖大数据科技团队维护和更新 &#xff0c;开箱即用最易上手的ORM 优点 &#xff1a;【生态丰富】【高性能】【超简单】 【功能全面】 【多库兼容】【适合产品】 【SqlSugar视频教程】 支持 &#xff1a…

判断字符串由几个单词组成(C语言)

一、N-S流程图&#xff1b; 二、运行结果&#xff1b; 三、源代码&#xff1b; # define _CRT_SECURE_NO_WARNINGS # include <stdio.h>int main() {//初始化变量值&#xff1b;int world 0;int i 0;char c 0;char string[81] { 0 };int num 0;//提示用户&#xff…

一个docker配置mysql主从服务器

这也就是因为穷&#xff0c;不然谁用一个docker配置主从&#xff0c;哈哈 既然成功了就记录下。过程挺折磨人的。 首先要保证你的电脑安装好了docker 为了保证docker当中主从能正常连网&#xff0c;现在docker里面创建一个网络环境 docker network create --driver bridge mysq…

C++-9

C 1.已知C风格的字符串&#xff0c;完成对字符串通过下标访问时的异常处理机制(越界访问) 2.写一个程序&#xff0c;程序包含两个类&#xff0c;类中实现一个成员函数&#xff0c;MyGetChar(), 类A中每调用一 次&#xff0c;按顺序得到一个数字字符&#xff0c;比如第-次调用得…

社交论坛问答发帖系统源码-java+vue+uniapp开发前后端

源码说明&#xff1a; 前后端分离社交论坛问答发帖BBS源码&#xff0c;社交论坛小程序|H5论坛。 下 载 地 址 &#xff1a; runruncode.com/php/19462.html 该项目是一个使用Java、Vue和Uniapp开发的前后端分离的社交论坛问答发帖/BBS项目。它包括了论坛图文帖、视频、圈子…

新唐的nuc980/nuc972的开发1-环境和源码同步

开发环境安装 1.1更新源 服务器端&#xff1a;可以参考&#xff1a;Linux替换清华源_更改清华源-CSDN博客 下面是桌面端的方法&#xff1a; 打开系统的软件中心&#xff0c;选择自己想要使用的源 更新缓存 1.2安装必须的库 apt-get install patch apt-get install libc6-dev …

SQL提升

1. SQL TOP 子句 TOP 子句用于规定要返回的记录的数目。 对于拥有数千条记录的大型表来说&#xff0c;TOP 子句是非常有用的。 **注释&#xff1a;**并非所有的数据库系统都支持 TOP 子句。 1.1 SQL TOP 语法 SQL Server 的语法&#xff1a; SELECT TOP number|percent c…

C#基础|了解对象在程序中的状态及垃圾回收机制

哈喽&#xff0c;你好啊&#xff0c;我是雷工&#xff01; 本节了解对象的生命周期及对象状态和垃圾回收机制&#xff0c;以下为学习笔记。 1、对象的生命周期 对象在内存中不断地被引用&#xff0c;被释放&#xff0c;形成了类似生命周期的过程。 2、对象在内存中的状态 对…

记一次生产事故的排查和解决

一. 事故概述 春节期间, 生产系统多次出现假死不可用现象, 导致绝大部分业务无法进行. 主要表现现象为接口无法访问. 背景为900W客户表和近实时ES, 以及春节期间疫情导致的普通卖菜场景近似秒杀等. 二. 排查过程 优先排查了info, error, catalina日志, 发现以下异常: 主要的…

一文掌握Vue依赖注入:原理、应用场景以及最佳模块化与单元测试实践,提升代码的可维护性与模块化程度

Vue 中的依赖注入&#xff08;Dependency Injection, DI&#xff09;机制通过 provide 与 inject API&#xff0c;实现了跨组件层级间的数据与服务透明传递&#xff0c;使父组件能够向其任意深度的子孙组件“注入”依赖&#xff0c;而不需要通过层层传递 props 或使用全局状态管…

搭建智能客服机器人设计流程

一、检索型机器人FAQ-Bot 在客服处理的问题中70%都是简单的问答业务&#xff0c;只要找到QA知识库中与用户当前问句语义最相近的标准问句&#xff0c;取出答案给用户就可以了。FAQ-Bot就是处理这类问题的。在没有使用深度学习算法之前&#xff0c;通常采用检索NLP技术处理。 …

如何用智能获客开启新商机?揭秘赢销侠软件的奇效

在当今数字化竞争日益激烈的商业环境中&#xff0c;企业为了生存和发展&#xff0c;必须寻找新的途径以获取潜在客户。智能获客作为一种新型的营销方式&#xff0c;正以其高效、精准的特点改变着传统的市场开拓模式。而在这个过程中&#xff0c;自动获客软件的作用愈发凸显&…

HTML:元素分类

HTML&#xff1a;元素分类 概述块级元素&#xff08;Block-level Elements&#xff09;内联元素&#xff08;Inline Elements&#xff09;替换元素&#xff08;Replaced Elements&#xff09;表单元素&#xff08;Form Elements&#xff09; 概述 HTML&#xff08;HyperText M…

Mysql从入门到精通——Mysql知识点总结(基础篇)

参考视频 黑马程序员 MySQL数据库入门到精通i 题单推荐 入门 进阶 SQL语句类型 DDL:数据定义语言&#xff0c;用来定义数据库对象(数据库&#xff0c;表&#xff0c;字段)DML:数据操作语言&#xff0c;对数据库表中的数据进行增删改DQL:数据查询语言,用来查询数据库中表的…

拓云启航 移动云全网型经销渠道合作伙伴火热招募

2024年4月28日至29日&#xff0c;2024中国移动算力网络大会在苏州召开。28 日下午大会主论坛现场&#xff0c;中国移动发布移动云全新万象算力网络生态合作计划&#xff0c;加速算力网络新质生产力落地。后续&#xff0c;移动云将依托“拓云计划”&#xff0c;招募超万家渠道伙…