nodejs接收post请求的参数

这篇具有很好参考价值的文章主要介绍了nodejs接收post请求的参数。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

  • post请求参数不直接在url路径中拼接,而是放在请求体中发送给服务器

    • 请求三要素:请求行、请求头、请求体
  • 1.1-浏览器发送post请求参数的方式

  • post请求参数不能直接在url路径中拼接,所以一般使用ajax请求来发送post请求参数
    • 通常都是提交form表单数据使用post请求
  • 
    <script>
    
      //浏览器中一般使用ajax来发送post请求
      $('#form').on('sunmit', function (e) {
        //禁用表单默认提交事件
        e.preventDefault();
        $.ajax({
          url: 'heroAdd',
          type: 'post',
          dataType: 'json',
          data: $(this).serialize(),
          success: function (data) {
          }
        });
      });
    </script>
    
    
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <title>Hero - Admin</title>
      <!-- 导入jquery -->
      <script src="/node_modules/jquery/dist/jquery.js"></script>
      <!-- bootstrap布局 -->
      <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
      <script src="/node_modules/bootstrap/dist/js/bootstrap.js"></script>
      <style>
        .hero-list img {
          width: 50px;
        }
      </style>
    </head>
    
    <body>
      <header>
        <div class="page-header container">
          <h1>
            <a href="/">王者荣耀</a>
            <small>英雄管理器</small>
          </h1>
        </div>
      </header>
      <div class="container hero-list">
        <form id="form">
          <div class="form-group">
            <label for="exampleInputEmail1">英雄名称</label>
            <input type="text" name="name" class="form-control" id="exampleInputEmail1" placeholder="请输入英雄名称">
          </div>
          <div class="form-group">
            <label for="exampleInputPassword1">英雄性别</label>
            <div class="radio">
              <label>
                <input type="radio" name="gender" id="optionsRadios1" value="男" checked>男
              </label>
              <label>
                <input type="radio" name="gender" id="optionsRadios1" value="女" checked>女
              </label>
            </div>
          </div>
          <div class="form-group">
            <label for="exampleInputFile">英雄图片</label>
            <!-- <input type="file" id="exampleInputFile"> -->
            <p class="help-block">请上传英雄图片.</p>
          </div>
          <button type="submit" class="btn btn-success">点击保存</button>
        </form>
      </div>
    </body>
    
    <script>
      //浏览器中一般使用ajax来发送post请求
      $('#form').on('sunmit', function (e) {
        //禁用表单默认提交事件
        e.preventDefault();
        $.ajax({
          url: 'heroAdd',
          type: 'post',
          dataType: 'json',
          data: $(this).serialize(),
          success: function (data) {
          }
        });
      });
    </script>
    
    </html>
    

    1.2-服务端接收post请求参数的方式

  • 与get请求不同的是,服务端接收post请求参数不是一次就可以获取的,通常需要多次

  • 一般post请求发送的参数数据要比get请求大得多
    1.服务端接收表单数据流程

    (1)如果表单数据量越多,则发送的次数越多,如果比较少,可能一次就发过来了
    (2)接收表单数据的时候,需要通过监听 req 对象的 data 事件来取数据
    (3)每当收到一段表单提交过来的数据,req 的 data 事件就会被触发一次,同时通过回调函数可以拿到该 段 的数据
    服务端需要自己添加数据流
    (4)当接收表单提交的数据完毕之后,会执行req的 on 事件
    2.服务端处理表单数据的逻辑流程

    (1)对数据进行解码(中文数据提交时会进行url编码)
    decodeURI(data)
    (2)使用querystring对url进行反序列化(解析url将&和=拆分成键值对),得到一个对象
    querystring是nodejs内置的一个专用于处理url的模块,API只有四个,详情见nodejs官方文档
    post请求参数不能使用url模块解析,因为他不是一个url,而是一个请求体对象
    (3)将数据插入到数据库
     文章来源地址https://www.toymoban.com/news/detail-434057.html

  • 
    //导入querystring模块(解析post请求数据)
    var querystring = require('querystring');
    
     console.log(req.method);
    
    //1.通过判断url路径和请求方式来判断是否是表单提交
    if (req.url === '/heroAdd' && req.method === 'POST') {
        /**服务端接收post请求参数的流程
            * (1)给req请求注册接收数据data事件(该方法会执行多次,需要我们手动累加二进制数据)
            *      * 如果表单数据量越多,则发送的次数越多,如果比较少,可能一次就发过来了
            *      * 所以接收表单数据的时候,需要通过监听 req 对象的 data 事件来取数据
            *      * 也就是说,每当收到一段表单提交过来的数据,req 的 data 事件就会被触发一次,同时通过回调函数可以拿到该 段 的数据
            * (2)给req请求注册完成接收数据end事件(所有数据接收完成会执行一次该方法)
            */
        //创建空字符叠加数据片段
        var data = '';
    
        //2.注册data事件接收数据(每当收到一段表单提交的数据,该方法会执行一次)
        req.on('data', function (chunk) {
            // chunk 默认是一个二进制数据,和 data 拼接会自动 toString
            data += chunk;
        });
    
        // 3.当接收表单提交的数据完毕之后,就可以进一步处理了
        //注册end事件,所有数据接收完成会执行一次该方法
        req.on('end', function () {
    
            //(1).对url进行解码(url会对中文进行编码)
            data = decodeURI(data);
            console.log(data);
    
            /**post请求参数不能使用url模块解析,因为他不是一个url,而是一个请求体对象 */
    
            //(2).使用querystring对url进行反序列化(解析url将&和=拆分成键值对),得到一个对象
            //querystring是nodejs内置的一个专用于处理url的模块,API只有四个,详情见nodejs官方文档
            var dataObject = querystring.parse(data);
            console.log(dataObject);
        });
    }
    
    
    //1.导入http模块
    var http = require('http');
    //导入文件模块
    var fs = require('fs');
    //导入路径模块
    var path = require('path');
    //导入querystring模块(解析post请求数据)
    var querystring = require('querystring');
    
    //2.创建服务器
    var app = http.createServer();
    
    //3.添加响应事件
    app.on('request', function (req, res) {
    
        console.log(req.method);
    
        //1.通过判断url路径和请求方式来判断是否是表单提交
        if (req.url === '/heroAdd' && req.method === 'POST') {
            /**服务端接收post请求参数的流程
             * (1)给req请求注册接收数据data事件(该方法会执行多次,需要我们手动累加二进制数据)
             *      * 如果表单数据量越多,则发送的次数越多,如果比较少,可能一次就发过来了
             *      * 所以接收表单数据的时候,需要通过监听 req 对象的 data 事件来取数据
             *      * 也就是说,每当收到一段表单提交过来的数据,req 的 data 事件就会被触发一次,同时通过回调函数可以拿到该 段 的数据
             * (2)给req请求注册完成接收数据end事件(所有数据接收完成会执行一次该方法)
             */
            //创建空字符叠加数据片段
            var data = '';
    
            //2.注册data事件接收数据(每当收到一段表单提交的数据,该方法会执行一次)
            req.on('data', function (chunk) {
                // chunk 默认是一个二进制数据,和 data 拼接会自动 toString
                data += chunk;
            });
    
            // 3.当接收表单提交的数据完毕之后,就可以进一步处理了
            //注册end事件,所有数据接收完成会执行一次该方法
            req.on('end', function () {
    
                //(1).对url进行解码(url会对中文进行编码)
                data = decodeURI(data);
                console.log(data);
    
                /**post请求参数不能使用url模块解析,因为他不是一个url,而是一个请求体对象 */
    
                //(2).使用querystring对url进行反序列化(解析url将&和=拆分成键值对),得到一个对象
                //querystring是nodejs内置的一个专用于处理url的模块,API只有四个,详情见nodejs官方文档
                var dataObject = querystring.parse(data);
                console.log(dataObject);
            });
        }
    
        if (req.url === '/heroAdd' && req.method === 'POST') {
            fs.readFile('./heroAdd.html', function (err, data) {
                if (err) {
                    throw err;
                }
                res.end(data);
            });
        } else if (req.url.indexOf('/node_modules') === 0) {
            fs.readFile(__dirname + req.url, function (err, data) {
                if (err) {
                    throw err;
                } else {
                    res.end(data);
                }
            });
        } else {
            res.end('请求路径: ' + req.url);
        }
    });
    
    //4.监听端口号
    app.listen(3000, function () {
        console.log('欢迎来到王者荣耀英雄管理器');
    });
    

到了这里,关于nodejs接收post请求的参数的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 在Vue中使用axios发送post请求时,可能会出现后端无法接收到参数的情况。

    在Vue中使用axios发送post请求时,可能会出现后端无法接收到参数的情况。这个问题的原因是axios默认发送的请求是json格式的,而后端接收的请求是form表单格式的,这就导致后端无法获取json格式的请求参数。解决这个问题可以通过设置axios的请求头部信息,将请求格式设置为

    2024年02月16日
    浏览(46)
  • vue3使用axios发送post请求,后台接收到的参数总是null,使用postman测试后台是能接收数据的

    使用vue3,连基本的请求都失败了,使用浏览器查看post请求,参数中是有值,但是传到后台,每个参数都是null,不知道哪里错了。排除了后台的错误,就剩下了vue代码的错误了。我出错的地方是vue使用axios发送post请求的时候,参数格式写错了。 直接贴代码了,正确的写法 f

    2024年02月13日
    浏览(42)
  • python 发送和接收post请求

    bottle是python的web框架,只需要引用一个 .py 文件即可,点击去下载页

    2024年02月15日
    浏览(36)
  • 前端post,get请求传参方式 以及后台接收

    post请求: 1:js中 2:使用 首先引入方法js: 调用方法 3:浏览器请求 4:后台参数接收 get请求: 第一种:通过params对象传递,将参数以键值对的形式传递,当传递的参数为多个时,浏览器会自动拼接进行分割 1:js中 2:使用 首先引入方法js: 调用方法 3:浏览器请求 4:后台

    2024年02月10日
    浏览(43)
  • SpringBoot中接收POST参数的几种方式

    今天在做一个vue前后端分离项目的过程中,踩了一个坑,记录一下 前端如下: 用户名字段: username 密码字段: password 提交后,发现后端怎么也收不到参数,总结如下: 常见的接收post参数,有三种 额外参数: 使用 required = false 标注参数是非必须的。 使用 defaultValue 给参数

    2024年02月15日
    浏览(57)
  • Java中GET请求与POST请求,前端传参与后端接收实例

    此示例以代码方式展现,可直接结合controller层每个接口上方注释与其接口传递参数方式理解! 前端传参直接就以apiPost工具来代替 apiPost调用后端接口几种方式   代码:  controller层: service层: mapper层: xml:

    2024年02月07日
    浏览(54)
  • 嵌入式Qt中实现http服务接收POST请求

    嗨喽,大家好!以下知识点做个简单记录分享给小伙伴们! 首先我们来理解几个概念 “ WebSocket服务器和HTTP服务器是两种不同的服务器类型,它们在协议、连接方式和通信模式等方面有所区别。 协议:HTTP服务器使用HTTP协议进行通信,而WebSocket服务器使用WebSocket协议。HTTP协

    2024年02月20日
    浏览(40)
  • Java文件导入接口多参数写法 (POST方法同时支持接收文件流和其他参数)

    使用表单方式进行传输,需要注意其他参数需要使用 @RequestPart 注解进行接收,因为在 post 方法中表单传输使用@RequestParam 接收 json 格式默认视为字符串类型,接口无法映射对应实体类 @RequestParam 依赖Converter or PropertyEditor进行数据解析, @RequestPart参考’Content-Type’ header,依赖

    2024年02月16日
    浏览(48)
  • Python中的POST请求参数

    在HTTP协议中,GET和POST是两种常用的请求方法。GET请求通过URL参数将请求数据传递给服务器,而POST请求则通过请求体中的参数传递数据。POST请求通常用于提交表单、上传文件等操作。POST请求参数就是请求体中的参数。 在Python中,我们可以使用第三方库如requests来发送POST请求

    2024年01月24日
    浏览(47)
  • 使用HttpURLConnection发送POST请求并携带请求参数

    这里的param是请求参数,需要将其转换为字节数组后写入输出流。 这里的response是响应数据,需要将其读取为字符串后使用。 完整的示例代码如下所示: 需要注意的是,以上示例代码中的请求参数是以字符串形式传递的,如果需要传递复杂的请求参数,可以考虑使用JSON等格

    2024年02月04日
    浏览(53)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包