React.js使用axios将数据发布到php,但php echo为空

2024-04-05

我正在使用react.js、axios和PHP将数据发布到MySQL数据库

这是我的react.js代码

sendData(){
var data = new FormData();
data.append('name', 'jessie');
data.append('time', '12:00');
data.append('food', 'milk');
data.append('nutrition', 'vitaminA');
axios.post(
'./sendData.php',{
  data: data

})
.then(response => {
console.log(response)
console.log(response.data)
this.filter = response.data
})
.catch(e => {
this.errors.push(e)
})
}

这是我的 PHP 代码

<?php
$servername = "127.0.0.1";
$username = "root";
$password = "";
$database = "mydb";


$conn = new mysqli($servername, $username, $password, $database);


if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
echo "Connected successfully yayaya";
echo "the post after this";
echo json_encode($_POST);

?>

这是我的 Chrome 控制台

Connected successfully yayayathe post after this[]

我不知道为什么我的 PHP 得到空数据并回显空值。


根据axios 文档 https://github.com/mzabriskie/axios#using-applicationx-www-form-urlencoded-format

默认情况下,axios 将 JavaScript 对象序列化为 JSON。

一种选择是从 PHP 代码的正文中读取 json https://stackoverflow.com/a/8945912/1633510:

$entityBody = file_get_contents('php://input');

那么就不需要将您的数据包装在FormData,直接添加即可:

axios.post(
'./sendData.php',{
  data: {
    name: 'jessie',
    time: '12:00',
    food: 'milk',
    nutrition: 'vitaminA'
  }
})

另一个选项是设置Content-typeaxios 中的标头:

axios.post(
  './sendData.php',{
  data: data
  {
    headers: {
      'Content-type': 'multipart/form-data'
    }
  }
})

不过,选项 1 对我来说似乎更好

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React.js使用axios将数据发布到php,但php echo为空 的相关文章

  • magento成功页面变量

    我正在尝试捕获一些 magento 成功页面变量以传递给我们的广告公司 到目前为止 我已经得到了这个 但变量没有输出任何内容 数据需要采用以下格式 price1 price2 price3 qty1 qty2 qty3 sku1 sku2
  • 简单的dom php解析获取自定义数据属性值

    HTML div class something ddsf PHP foreach dom gt find something data rel as this var dump this gt attr 我尝试了这个但错误 在其文档中找不
  • 如何在 select 和 option 标签中添加 JSON 数据?

    我有这个html代码 div class searchfilter div class searchwrapper div div
  • karma/jasmine 控制台更详细的测试结果

    我使用 Karma 和 Jasmine 进行 javascript 单元测试 假设我有一个失败的测试 如下所示 expect objectA toEqual expectedObjectA 当失败时 我看到控制台上转储了两个对象 并显示一条
  • 将 Firebase FCM 添加到 ReactJS 应用程序

    我正在尝试向我的 ReactJS 应用程序中的用户发送推送通知 我已添加 firebase 请求用户通知权限 这正在发挥作用 但现在我想注册设备令牌 但这给了我错误 消息传递 我们无法注册默认的 Service Worker 无法注册 Se
  • 在 JQuery 中发布表单并填充 DIV - 在 IE 中损坏

    我正在尝试创建一个通过 jQuery 发布数据并将返回值填充到同一 DIV 中的表单 这样页面就不会在发布操作时刷新 div div
  • 如何在 Web 服务器上设置 gzip 压缩?

    我有一个嵌入式网络服务器 总共有 2 兆空间 通常 您使用 gzip 文件对客户端有利 但这会节省我们在服务器上的空间 我读到你可以只 gzip js 文件并将其保存在服务器上 我在 IIS 上测试过 但没有任何运气 为了使这项工作成功 我
  • 如果没有 /// 标签,TypeScript 的“将 JavaScript 输出合并到文件中”选项无法推断出正确的脚本顺序

    我正在开发一个使用 将 JavaScript 输出合并到文件中 选项的 TypeScript 解决方案 我经常引用另一个文件中定义的项目 例如 In MyBaseClass ts export class MyBaseClass In My
  • 使用 JQuery 禁用和启用所有超链接

    我有以下禁用所有超链接的内容 但在事件发生后我想再次启用它们 我该如何执行此操作 a click function return false 我认为这不仅仅是将其设置为 true 那么简单 谢谢大家 不要以这种方式绑定 点击 处理程序 而是
  • 如何将 arraylist 从 servlet 传递到 javascript?

    我通过在属性中设置数组列表并将其转发到 jsp 来从 servlet 传递数组列表 Servlet ArrayList
  • ES6继承:使用`super`访问父类的属性

    JavaScript 的super关键字 当我在 Chrome Babel TypeScript 上运行代码时 得到了不同的结果 我的问题是哪个结果是正确的 规范的哪一部分定义了这种行为 下面的代码 class Point getX con
  • 监听文件夹和文件(更改)

    可以直接在 PHP 或 Node 上监听文件夹和文件的更改 通过事件 还是我需要创建自己的方法来执行此操作 Example 我需要听文件夹 user 如果我将一些文件添加到该目录中 PHP 或 Node 会收到信息并运行PathEvent
  • 模板中带有 ng-if 的 angularjs 指令

    我正在构建一个在模板内使用 ng if 的指令 奇怪的是 提供给链接函数的元素没有扩展ng if代码 它只是ng if的注释行 经过一番尝试 我发现通过将链接代码包装在 timeout 中似乎可以使其正常工作 但我想知道这是否不是正确的处理
  • 接口中的构造方法

    接口中的构造方法不好吗 为什么人们认为有人想要实例化接口 我们想要做的是强制实现者实现构造函数 就像其他接口方法一样 接口就像一个合同 假设我有一个接口 Queue 并且我想确保实现者创建一个带有一个参数的构造函数 该构造函数创建一个单例队
  • 类中可以有生成器 getter 吗?

    我的意思是吸气剂是发电机 我相信这一切都是 ES6 也许像这样 class a get count let i 10 while i yield i let b new a for const i of b count console lo
  • ThreeJS 中阴影的奇怪行为

    所以我有一个 ThreeJS 场景 并且添加了一些球体 多材质 我还添加了定向光 this light new THREE DirectionalLight 0xFFFFFF 1 this light position set 2 10 2
  • ng-include 和 ng-view 不同时加载

    下面是我的应用程序的结构 很简单 页眉和页脚是非常小的文件 而主页上的 ng view 要大得多 当我进入该页面时 我注意到了这一点 首先加载两个 ng include 然后 ng view 出现 页脚被推到底部 页脚闪烁大约 0 1 秒
  • Chrome 扩展:强制 popup.html 关闭

    我想知道是否可以强制 popup html 关闭 在弹出的 javascript 中 window close
  • 使用“INSERT ... ON DUPLICATE KEY UPDATE”插入多条记录

    我的表结构 table marks 我的目标 我想用条件插入或更新多条记录 我目前正在通过此查询进行检查 第一步 SELECT FROM marks WHERE student 115 AND param 1 第二步 if records
  • 如何在 PHP 中从字符串类名实例化? [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 如何创建返回方法名称的新实例 不幸的是我收到这个错误 错误 类名必须是有效的对象或字符串 这是我的代码 class Foo public f

随机推荐

  • 使用knitr和RStudio在外部文件中进行代码折叠

    我找不到任何方法可以将语法上可接受的 RStudio 样式折叠插入到外部 R 代码文件中 该文件设置为从 knitr 文档中使用 或者我错过了什么 有几种方法可以做到这一点 1 允许代码标头 例如 knitr Q1 也许 knitr Q1
  • java中如何对对象进行排序? [复制]

    这个问题在这里已经有答案了 可能的重复 如何按属性对对象的数组列表进行排序 https stackoverflow com questions 2535124 how to sort an arraylist of objects by a
  • 将行恢复为默认列值 mysql

    我正在使用 MySQL 社区服务器 5 1 有没有一种方法可以通过一个查询将所有行设置回默认列值 我刚刚添加了很多行 我为大多数指定的列设置了默认值 但由于某种原因 所有列值都设置为 0 我想知道是否有一个查询将所有列值设置为其默认值 并且
  • java.lang.IllegalStateException:找不到工厂javax.faces.application.ApplicationFactory的备份[重复]

    这个问题在这里已经有答案了 我想从 jsf 2 1 迁移到 2 2 但无法运行我的服务器 Tomcat 导致出现以下错误 我谨通知您 我在项目 Maven 中使用了 Hibernate Spring JSF Root WebApplicat
  • Windows 7 中 NASM 程序中的 I/O

    我想用 NASM 汇编语言进行编程 我有 NASM 2 07 和 Borland C 编译器 5 0 bcc32 我的操作系统是Windows 7 我不知道如何在Windows平台上使用NASM进行输入和输出 请问你能帮我吗 最简单的方法是
  • 调试 javascript 有哪些好的技巧? [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 所以我相当经常地使用 JavaScr
  • 关于C++类中typedef函数的疑问

    我需要定义一个返回类对象的函数 假设我有一个名为狗的类 h 中的类声明和 cpp 中的实现 当狗死时 我想调用一个函数让狗管理器知道这一点 在dog的SetFunc中我将收到要调用的函数 Dog h class Dog public typ
  • 从插件 (.so) 加载 Qt UI(带图像)时遇到问题

    我有一个插件 可以加载并显示一个自定义小部件 该小部件显示从资源文件 resources qrc 加载的图像 作为 QLabel 的背景 我面临的问题是 加载插件后 它会正确显示小部件 但不显示图像 我尝试将 Q INIT RESOURCE
  • Safari 上的 Flex-wrap 问题

    我试图让两个元素填充其容器并在达到某个最小尺寸时进行包装 我的代码在除 safari 之外的所有浏览器上都能完美运行 而且我无法找到替代方案 这似乎是 flex basis 0 的问题 问题是这样的 http www cssdesk com
  • 错误:“grep:参数列表太长”[重复]

    这个问题在这里已经有答案了 我正在尝试运行以下命令 但出现参数太长错误 你能帮我吗 HOST grep rl pattern home public html bash bin grep Argument list too long 有没有
  • Hadoop - 如何收集没有值的文本输出

    我正在从事地图缩减工作 我想知道是否可以向我的输出文件发出自定义字符串 没有计数 没有其他数量 只有一团文本 这是我正在思考的基本想法 public static class Map extends MapReduceBase implem
  • VueJS 和 Laravel 的 Textarea v-model 初始值

    我想使用刀片语法将用户名显示为 Markdown 编辑器的默认文本区域值
  • 自动滚动 JavaFX TextFlow

    我有一个 JavaFXTextFlow包裹在一个ScrollPane 我试图让它在有新内容时自动滚动到底部Text被添加到TextFlow 我尝试过附加监听器以最大化ScrollPane s vvalue to The ScrollPane
  • Rails 包含查询,其条件不返回左表中的所有结果

    我有两个表格 帖子和图像 以下是 schema rb 中的相关部分 create table posts force true do t t string name t string body t datetime created at t
  • 更新张量流中的张量切片

    我想更新 3 维张量的切片 下列的如何在 Tensorflow 中进行切片分配 https stackoverflow com questions 39157723 how to do slice assignment in tensorf
  • 我可以使用QTimer来实现多线程算法吗?

    目前我需要实现一个基于Qt的多线程算法 也许我应该尝试延长QThread 但在此之前 我想问一下 我是否可以只使用两个QTimers timer1 timer2 并将它们的超时信号分别连接到线程上 来实现一个 假 的多线程程序 您可以连接
  • WCF 中的两个接口和一个具体类

    请检查下面的示例 namespace GServices ServiceKnownType typeof SearchType ServiceContract SessionMode SessionMode Allowed public i
  • 组合两张地图

    Scala 中是否有一个函数可以组合两个映射 或者 flatMap 是一个明智的方法吗 scala gt val caps Map String Int Map A 1 B 2 caps Map String Int Map A gt 1
  • tinypng.org 如何压缩 PNG 文件? [关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 http tinypng org http tinypng org 是一项很棒的服务 他们将我的 png 图像优化了约 67 他们的服务如何运作 他们
  • React.js使用axios将数据发布到php,但php echo为空

    我正在使用react js axios和PHP将数据发布到MySQL数据库 这是我的react js代码 sendData var data new FormData data append name jessie data append