react + webpack - 传递 POST 数据进行构建

Question

来自 PHP 背景，我曾经有一个 index.php 做两件事：

如果没有设置参数，则提供该网页；
或在请求中包含特定 POST 参数时提供 JSON 数据。

像这样：

// -- index.php
<?php
    if ($_POST["some_parameter"]) {
        ...
        echo json_encode(someArrayData);
        exit(0);
    }
?>

<html>
    ...
</html>

我已经使用 npm、webpack、webpack-dev-server 和 React 构建了完整的前端应用程序。完成第一部分后，当请求包含特定 POST 参数时，如何有效地提供 JSON 数据而不是 HTML？

我可以看到两种方法：

像往常一样构建前端，每次构建包时，修改 index.html，在其中注入我的 PHP 代码，并将其重命名为 index.php。然后我将不得不通过 apache 或 nginx 运行这个文件夹，这样我就能够运行 index.php 脚本。这种方法非常丑陋，可能是最糟糕的方法。
运行一个单独的 PHP 服务器，它只提供数据或重定向到静态 webpack 生成的构建。然后所有请求都应该从这个服务器开始，这个服务器决定是提供数据还是重定向到前端。问题在于巧妙地将从请求中收到的 POST 数据传递给静态反应应用程序。据我所知，唯一的方法是在重定向中包含一个 URL (GET) 参数，并在前端用 javascript 手动解析它。在我看来，这是一个肮脏的解决方案。

所以，总结一下：

我需要一种在 react/webpack/webpack-dev-server 环境中获取 POST 数据的有效方法。
它应该适用于我的热模块更换开发设置。
我可以切换到像 express 这样的基于节点的后端。
静态反应应用中不应该有任何ajax。

有什么想法吗？必须有一种方法可以正确地做到这一点。

Answer 1

更新： 我通过 webpack 配置简单地将 index.php 从我的源目录复制到我的构建目录来解决这个问题。我将构建文件夹提供给 PHP 服务器并保留 webpack --watch 构建我的源代码。

我失去了自动重新加载和 css 注入等内置功能，但是对于一个非常简单的任务（获取单个 POST 变量）不必实施 SSR 带来的便利是值得的.

对于任何感兴趣的人，我还添加了 2 个 npm 脚本：

npm run start 使用热重载运行我原来的 webpack-dev-server，提供静态内容，包括静态 index.html 文件
npm run static 运行 webpack --watch 将 index.php 文件复制到构建目录

这让我可以在开发前端时进行热重载，并允许 POST 在编程逻辑时获取数据。

它简单、方便，适用于大多数网络托管服务提供商。

react + webpack - 传递 POST 数据进行构建

react + webpack - pass POST data to build

reactjs

webpack

webpack-dev-server