首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

当我发出post请求表单react时,我在后端收到一个空的正文。我不明白为什么

当你发出POST请求表单React时,后端收到一个空的正文可能有以下几个可能的原因:

  1. 前端代码问题:首先,你需要确保前端代码中的表单数据正确地被提交到后端。你可以检查前端代码中的表单提交逻辑,确保表单数据被正确地包装成POST请求的正文部分。另外,你还可以使用浏览器的开发者工具来查看网络请求,确认表单数据是否被正确地发送到后端。
  2. 后端代码问题:其次,你需要检查后端代码,确保能够正确地解析POST请求的正文部分。根据你使用的后端框架或语言,可能需要使用相应的解析器或中间件来处理POST请求的正文数据。例如,在Node.js中,你可以使用body-parser中间件来解析POST请求的正文数据。
  3. 请求头问题:还有可能是由于请求头的问题导致后端收到空的正文。你可以检查请求头中的Content-Type字段,确保它正确地指定了请求正文的格式。常见的Content-Type值包括application/json、application/x-www-form-urlencoded等。
  4. 网络传输问题:最后,还有可能是由于网络传输问题导致后端收到空的正文。你可以检查网络连接是否稳定,并确保请求能够正确地到达后端服务器。

综上所述,当你发出POST请求表单React时,后端收到一个空的正文可能是由于前端代码问题、后端代码问题、请求头问题或网络传输问题所致。你可以逐一排查这些可能的原因,以找到问题所在并进行修复。

(注意:本回答中没有提及云计算相关内容,如有需要,请提供相关问题。)

相关搜索:当我从Node服务器命中我的后端时,为什么我收到404错误请求?当我尝试使用Swagger在AngularJS上构建post请求时,我收到了错误的请求为什么在PHP/Laravel中使用POST时我的请求为空为什么我在提交我的django表单时得到一个不为空的约束失败?当我从html表单传递一个值时,为什么在我的post api过程中,我得到了一个错误'Column post be null‘?在node.js中,我发出了一个POST请求,在收到来自POST请求的响应之前,函数正在向端点发送空格在创建MERN应用时,我需要创建一个从前端到后端的POST请求,但是请求体是空的为什么在发出post请求时,用户名不会出现在我的有效负载中?在成功创建HTTP Post记录时,我没有从请求中收到新创建的记录值。为什么?向服务器发出的Http.post请求不会将正文发送到颤动状态。在服务器端,请求的主体是空的。我添加了下面的代码为什么当我使用邮递员时,我的SuiteQL POST请求可以工作,但是当我在VS代码终端中cURL相同的代码时,它返回'INVALID_LOGIN‘每当我尝试调用我在另一个react本机应用程序中创建的ReactNativeLibrary时,我都会收到“未定义的不是对象”的消息我不明白为什么在rails应用程序中会出现这样的错误:表单中的第一个参数不能包含nil或为空错误正文解析器不能与typescript一起工作,当我发送一个请求时,我在request.body中得到一个未定义的
相关搜索:
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

node后端接收到axios的post请求体为空

node后端接收到axios的post请求体为空???...使用axios发送post请求,传入了Object格式的参数,在node后端req.body接收到的参数为空,但是网页上抓包检查时,发现请求的body确实是携带了参数的?...于是我在页面F12进行网络抓包来查看发出去的request请求 抓到的包中请求体确实携带了页面发送的参数,然后我就开始意识到事情的不对劲了,开始在网上搜索答案。...经过漫长的网上冲浪,并查了一下axios的源码,我发现axios的文档上有这样一句话 这就能解释为什么我之前发obj对象数据,请求体携带的确是json格式的数据,说明axios会自动转换数据为json格式后来我又在源码上看到了转换请求体参数格式的相关代码...在开发中,发送请求的入参大多是一个对象。在发送时,如果该请求为get请求,就需要对参数进行转化。

9610

解决:node后端接收到axios的post请求体竟为空?

前言: 在做项目时,你们是否会遇到这样一个问题: 使用axios发送post请求,传入了Object格式的参数,在node后端req.body接收到的参数为空,但是网页上抓包检查时,发现请求的body...今天,我在写vue+node项目时,在提交登录信息(username,password)到后端时,就遇到了这个小bug,花了我一个半小时的时间,才搞出了个所以然来。...显而易见,服务器中req.body请求体中没有任何参数。但是页面确实是提交了数据呀? 于是我在页面F12进行网络抓包来查看发出去的request请求 ? ​...body-parser无法解析请求体中的JSON字符串,所以当收到JSON格式的参数时,因无法解析,所以req.body就为空了 ---- 解决: 既然body-parser只能解析序列化的表单数据格式...在开发中,发送请求的入参大多是一个对象。在发送时,如果该请求为get请求,就需要对参数进行转化。

7.9K62
  • 深入探讨 Web 开发中的预渲染和 Hydration

    传统 SSR 的缺点 性能问题 每次用户请求一个页面时,都需要向服务器发出请求 这意味着会有一个整页重载。 复杂的查询可能会导致速度变慢。...在服务器上渲染 React 组件,然后将生成的 HTML 发送到浏览器。这可以提高 SEO 和初始加载时间。渲染过程在每个页面请求时发生。 什么是静态站点生成(SSG)?...在构建时生成静态 HTML 页面。这些页面可以快速提供服务,而不需要服务器实时渲染它们。 这两种方法都是有用的!现在用户收到的 HTML 将是正确的。...他们将看到一个有内容的页面,而不是像使用 Vite 或 Create React App 时看到的空白页面。 但有一个问题:用户收到的 HTML 不是交互式的。他们不能点击它或提交表单。...使用Gatsby(一个具有 SSR 功能的静态站点生成框架)创建了我的应用 即使没有 JavaScript,我们仍然可以在我的应用上看到内容。那是因为用户收到了预渲染的 HTML!

    17310

    React 支持 form action 是在作妖?不,它是一种重磅回归

    form 元素时,内部的表单元素可以根据 name 属性与 value 值自动组合成一个完整的序列化表单对象。...我们可以先创建一个空的 FormData 对象,然后通过 append 方法来添加属性。...抛开学习成本不谈,我个人认为这是一个非常好的变化,新的开发方式上在开发体验和性能表现上都有非常大的提升。...✓这个变化主要是 React 中并不提倡直接获取元素对象,以及直接往后端发送请求的方式并不常用 function action(formdata) { // do something } 的划时代意义 这里大家需要注意的一个小细节就是,许多针对表单功能增强的 API,都不是从 react 中引入,而是从 react-dom 中引入。 第一时间我还没想通这到底咋回事。

    34710

    剥开比原看代码09:通过dashboard创建密钥时,前端的数据是如何传到后端的?

    在前一篇文章中,当我们第一次在浏览器中打开dashboard时,因为还没有创建过密钥,所以比原会提示我们输入一些别名和密码,为我们创建一个密钥和相应的帐户。就是下面这张图所对应的:  ?...跟之前一样,我们将对这个问题进行细分,然后各个击破: 前端:当我们填完表单,点了提交以后,比原在前端是如何发送数据的? 后端:比原的后端是如何接收到数据的?...前端:当我们填完表单,点了提交以后,数据会发送到后端的哪个接口? 当我们点击了"Register"按钮,在前端页面中,一定会在某个地方触发一个向比原节点webapi接口发出请求的操作。...由于比原的前端页面是使用React为主的,所以我猜想在代码中,也该会有一个名为Register的组件,或者某个表单中有一个名为Register的按钮。...当我们清楚了在本文中,前后端数据是如何交互的,就很容易推广到更多的情景。在前端还在很多的页面和表单,在很多地方都需要调用后端的接口,我相信按照本文的思路,应该都可以快速的找到。

    79110

    我的职业是前端工程师【七】:你真的懂前后端分离吗?

    觉得它甚是麻烦,当我改一个接口的时候,我需要同时修改两部分的代码,以及对应的测试。反而,还不如直接修改原有的模板来得简单。 可是当我去使用这个,由前后端分离做成的单页面应用时,我开始觉得这些是值得。...整个过程里,我们只是不断地从后台去获取数据,不需要重复地请求页面——因为这些页面的模板已经存在本地了,我们所缺少的只是实时的数据。 后来,当我从架构去考虑这件事时,我才发现这种花费是值得的。...而我使用 React 时,也不影响后台使用某一个框架。 概念我们已经清楚了,但是还有一个问题:我们真的需要前后端分离吗? 真的需要前后端分离吗? ?...": ""}] 前端在一个 API 请求之后,可以直接渲染这些数据成 HTML。...如果一个前端应用只显示数据的话,那么这个应用就没有充足的理由,做成一个单页面应用——单页面应用是为了更好的交互而存在的。当我们注册、登录、购买东西时,就需要开始与表单进行处理。

    1.1K80

    邮件狂欢:Next.js和Resend SDK的电子邮件魔法

    下一步是按照以下步骤创建 API 密钥:导航至仪表板左侧的API 密钥部分。单击页面右侧的“创建 API 密钥”按钮。将出现一个包含表单的模式窗口。...toast从库导入react-hot-toast,在成功发送电子邮件后显示通知。定义一个名为 的异步函数onSubmit来在用户提交表单时处理表单提交。...在此函数内,使用 fetch 方法发出 API 请求,该方法将 POST 请求发送到端点, /api/send请求正文中的表单数据为 JSON。...reset提供的功能用于useForm在提交后重置表单字段。实施动态电子邮件模板使用 React Email,创建现代电子邮件模板变得非常容易。...该POST函数是一个异步函数,用于处理传入的 POST 请求。、和变量是从解析的请求正文中提取的name。emailmessage现在,导航到项目的主页并在表单字段中输入一些数据。点击“预约”按钮。

    2K00

    闲聊HTTP

    表单只能使用两种方法GET和POST,因为我们是要发送数据,所以需要使用POST方法。 如果客户端向服务器请求某个文件比如main.css呢?        ...Content-Length是必须包含在每个响应报文中的响应头字段,它告诉浏览器响应中正文的大小。这样浏览器就知道在请求头之后可以接收多少字节,并且在下载文件时可以显示有意义的进度条。...当我们输入网址,从在地址栏中按下 Enter 键到显示网页之间超过 50% 的时间都花在等待答案上,这段等待时间称为传送首字节的时间,简称 TTFB。...对于 HTTP 来说,连接就像一个队列,当第一个请求正在被处理时,所有其他请求都需要等待,这样就浪费了很多时间。...报头设为 keep-alive,服务器在成功发出响应后将不会关闭连接,而是允许客户端重复利用已经建立的连接来进行其他请求。

    46810

    CSRF的原理与防御 | 你想不想来一次CSRF攻击?

    你点了一下赢钱按钮,在这个不正规的网站中,将会发送https://www.a-bank.com/transfer这个请求,在发送这个请求的时候,会自动带上www.a-bank.com的cookie,不要问我为什么是这样...这种方式是在表单页面生成一个随机数,这个随机数一定要后端生成,并且对这个随机数进行存储。在前端页面中,对这个Token表单项进行隐藏。...第二种,通过请求头中的referer字段判断请求的来源。每一个发送给后端的请求,在请求头中都会包含一个referer字段,这个字段标识着请求的来源。...我们在做后端防御时,可以先取出每个请求的请求头中的referer字段,判断是不是以自己网站的域名开头,在咱们的示例中,如果referer字段是以https://www.a-bank.com/开头的,则继续执行转账操作...以上就是后端防御CSRF攻击的两种方式,都需要在后端做特殊的处理。当然也可以在前端做处理,怎么做呢?我们接着往下看。 前端防御CSRF 既然CSRF攻击的危害这么大,为什么不能在前端禁止这种请求呢?

    1K31

    让我们来深入了解下 CSRF

    CSRF 就是在不同的域名下却能够伪造出「使用者本人发出的请求」。要达成这件事也很简单,因为浏览器的机制,你只要发送请求给某个网站,就会把关联的 cookie 一并带上去。...CSRF 的防御就可以从这个方向思考,简单来说就是:「我要怎么挡掉从别的网站来的请求」 你仔细想想,CSRF 的请求跟使用者本人发出的请求有什么区别?...区别在于请求域名的不同,前者是从任意一个网站发出的,后者是从同一个网站发出的(这边假设你的 API 跟你的前端网站在同一个域名下) 检查 Referer 请求头里面会带一个叫做 referer 的属性,...或者说如果你是 SPA 的话,也可以把这信息直接放到请求header,你就不用在每一个表单都做这件事情,只要统一加一个地方就好。...意思就是你加上去之后,我们上面所讲的, , new XMLHttpRequest,只要是浏览器验证不是在同一个 site 底下发出的 请求,全部都不会带上这个 cookie

    10510

    安全开发之 token 那些事

    当用户在登录时,服务器生成一个 token 发送给客户端,客户端把这个 token 存在内存中或者本地,每次请求都带上这个 token,服务器接收到这个 token 并验证合法性,合法即继续执行请求,非法即拦截请求...token 在开发中的实践 1、前后端混合开发 使用前后端混合开发模式是较为传统的开发模式。一般是后端写完功能让前端写样式,前后端共同维护着同一个页面。...] =generateToken(); 一份存入页面中的表单,在页面上所有的表单中加入一个存放 token 的隐藏域: POST"> ......("token",generateToken(),time()+3600,'','','',true); 同样的,当服务端接收到请求时,比对 cookie 中的 token 和表单中的 token 是否相等...这是因为攻击者如果要利用 CSRF,构造一个包含恶意请求的页面,无论 GET 还是 POST 还是别的请求类型,由于同源策略的限制,请求只能由构造 form 表单发出,AJAX 是不支持跨域发送请求的(

    1.8K00

    【React】945- 你真的用对 useEffect 了吗?

    初始状态是一个object,其中的hits为一个空数组,目前还没有请求后端的接口。...我们可以传递一个空数组作为useEffect的第二个参数,这样就能避免在组件更新执行useEffect,只会在组件mount时执行。...我的思路是,先设置这个接口的返回值为data=[], 等到数据是再去请求另一个接口,即data作为useEffect的第二个参数传入。 但是不知道为什么会造成死循环,拿不到我们想要的结果。...但这会带来另一个问题:query的任何一次变动都会请求后端,这样会带来比较大的访问压力。这个时候我们需要引入一个按钮,点击这个按钮再发起请求。...4.3 处理表单 通常,我们不仅会用到上面的输入框和按钮,更多的时候是一张表单,所以也可以在表单中使用useEffect来处理数据请求,逻辑是相同的: function App() { ...

    9.6K20

    RESTful API接口设计规范与最佳实践

    ,并返回实体主体 2 POST 向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。...但是这是建立在业务场景规定,查询结果为空的时候属于异常的前提上。 1返回HTTP状态码 200 当我们查询一个资源但是结果为空,到底要不要把本次请求视为一个404的异常是取决于业务场景。...,那么我返回的结果自然是空的,并不能视为一个异常,这时候返回一个200的HTTP状态码,然后在响应结果里面明确结果是空的才是正确的做法。...最后总结一下这个问题,当请求的结果为空时,是不是属于异常要考虑业务场景,并且这个划分定义也是很有必要的,可以避免潜在的业务理解偏差导致的程序执行逻辑问题,因为如果是一个异常,那么会更早的被前端在统一异常处理里面的捕获并处理...,有利于前、后端开发人员开发出更健壮的系统。

    1.2K10

    小结HTTP状态码

    2xxs状态码 200 OK:请求成功。成功的含义取决于HTTP方法: GET:资源已被提取并在消息正文中传输。 HEAD:实体标头位于消息正文中。 POST:描述动作结果的资源在消息体中传输。...TRACE:消息正文包含服务器收到的请求信息。(方法不安全,一般不用) 说到了HTTP的方法,可以戳HTTP请求方法这个解析教程来了解一下。...201 Created:请求已经成功,并因此创建了一个新的资源。这通常是在PUT或POST请求之后发送的响应。 202 Accepted:请求已经接收到,但是没有响应,没有结果。...如果是复杂请求,那么在得到204返回时,浏览器有没有接受了这个请求的返回,如果没有,要叫后端搞下相关配置了。...与历史上302不同的是在重新发出原始请求时不允许更改请求方法。比如,使用POST请求始终就该用POST请求。

    1.1K20

    CORS 完全手册之 CORS 详解

    流程会像是这样: 我们要送出POST的request到http://localhost:3000/form 浏览器发现是非简单请求,因此先发出一个preflight request 检查response...而最大的差别在于非简单请求在发送正式的request之前,会先发送一个preflight request,如果preflight没有通过,是不会发出正式的request的。...对于那些古老的网站,甚至于是在XMLHttpRequest出现之前就存在的网站,他们的后端没有预期到浏览器能够发出method是DELETE或是PATCH的request,也没有预期到浏览器会发出content-type...这就是我所说的相容性,通过预检请求,让早期的网站不受到伤害,不接收到预期外的request。 而第二点安全性的话,还记得在第一篇问过大家的问题吗?送出POST request 删除文章的那个问题。...跟后端讨论过后,在送出表单之后后端会给一个token,前端只要带着这个token去打PATCH /form这个API,就能够编辑刚刚表单的内容。

    1.8K42

    React从入门到放弃,一个关于网页速度的故事

    如果你从没做过那样的工作,千万别去做。我会给那些愿意听我抱怨的人,喋喋不休地讲我遇到的各种困难。当我开始深入研究前端的替代方案时,我发现了 FRP、Flapjax 和 ClojureScript。...我在我的新工作中尝试了 React,并在 Clojure 主题的峰会(Clojure Cup 2013)期间发现 CLJS 和 React 简直是天作之合。React 为什么这么好呢?...这个库围绕布局和样式有更多特性,但是在 XHR 上的想法比较少(例如,如果没有表单,很难完成带参数的 POST 请求)。而且这个库大的多。...当我纠结于对 HTML 片段的请求时,我明白了一件事:当我为目录页选择技术路线图时,最后的选择是“类似 intercooler 的小东西”。 那为什么还不行动呢?...指令有明确的扩展点 支持对服务器的批量请求 更严格的属性命名规范(这是我的观点,但ic-get和ic-post使我烦恼:别让我改变观点啊!) 负载更小(多亏了没有 jQuery!)

    1K20

    web技术讲解(web安全入门03)

    一、Web 工作机制 为什么学习这节课 我们学习渗透测试这门课程,主要针对的 Web 应用,所以对 Web 架构需要一定的了解 1.1 网页、网站 我么可通过浏览器上网看到精美的页面,一般都是经过浏览器渲染的...Web 开发者在 Web 服务器后边增加了一个数据库服务器,这些经常变动的数据被存进数 据库,可以随时更新。...是一个请求和响应的协议。客户端发出请求,服务器端对请求给出回应。...、请求头、请求正文三部分组成 1、请求行:方法,资源路径,协议/版本 方法:GET 资源路径:/php/test/get.php 协议/版本:HTTP/1.1 2、请求头 从请求报文第二行开始到第一个空行为止的内容...3、响应正文 服务器返回资源的内容,即浏览器接收到的 HTML 代码。

    79510

    Web 应用开发进化论

    从客户端向 Web 服务器发送请求、从 Web 服务器向客户端发送响应都需要一定时间。 HTTP 请求带有四种基本的 HTTP 方法,我想在这里处理它们:GET、POST、PUT、DELETE。...这就是为什么在你的电脑上开发一个网站时,你必须用 URL localhost 打开它,这只意味着你是这个网站的本地主机。 我们更改了 URL 路径会发生啥?...可以说,在我们拥有单页应用之前,我们一直在使用多页应用,因为对于每个页面(例如 /about),都会向 Web 服务器发出一个新请求,以请求它所需的所有文件。...如果它发生了变化,它会收到一个基于时间戳的带有哈希的新文件名(例如 table.hash123.js 变为 table.hash765.js )。当浏览器请求具有缓存文件名的文件时,它会使用缓存版本。...当客户端应用程序在浏览器中渲染 Web 应用程序所需的一切时,服务器应用程序处理来自客户端的读取和写入数据的请求。 前端和后端 我们还没有讨论前端和后端这两个术语,因为我不想预先添加太多信息。

    4.2K10

    前端-不要再问跨域的问题了

    为了应付面试,我每次都随便背几个方案,也不知道为什么要这样干,反正面完就可以扔了,我想工作上也不会用到那么多乱七八糟的方案。...要掌握跨域,首先要知道为什么会有跨域这个问题出现 确实,我们这种搬砖工人就是为了混口饭吃嘛,好好的调个接口告诉我跨域了,这种阻碍我们轻松搬砖的事情真恶心!为什么会跨域?是谁在搞事情?...为了找到这个问题的始作俑者,请点击:浏览器的同源策略。 这么官方的东西真难懂,没关系,至少你知道了,因为浏览器的同源策略导致了跨域,就是浏览器在搞事情。 所以,浏览器为什么要搞事情?...没有同源策略限制的接口请求 有一个小小的东西叫cookie大家应该知道,一般用来处理登录等场景,目的是让服务端知道谁发出的这次请求。...这里通过前端发请求的时候增加一个额外的headers来触发非简单请求。 ? 后端: // 处理成功失败返回格式的工具 const {successBody} = require('..

    6.1K10
    领券