Node.js 连接前端和后端MERN堆栈

react客户端如何通过express连接到服务器？许多教程都谈到Superagent和axios，这让我更加困惑。在react上下文中，服务器端路由上是否有任何资源？谢谢

他们完全独立。无论是使用axios、本机Javascript获取、jQuery AJAX等，它们都在浏览器中运行，并向nodejs发出GET/POST请求。您将在nodejs中定义相应的GET/POST路由，以响应这些请求并返回JSON响应数据供它们使用

---

我会从完全忘记反应开始。而是构建一个包含各种GET/POST路由的expressapi，这些路由返回JSON响应。使用简单的客户端进行测试，如。一旦你对此有了一个句柄，那么就从前端Javascript框架开始使用这些服务。

在MERN stack中，你不必把整个堆栈看作一个实体。Mongo、ReactJS和NodeJS服务器都可以独立工作。为了便于理解，让我们假设它们都在不同的服务器上。也就是说，我们可以在一台服务器上安装Mongo，在另一台服务器上安装ReactJS，在第三台服务器上安装带有express的NodeJS，然后它将成为一个MERN stack应用程序

MERN应用程序的工作原理如下

例如，让我们有一个应用程序，显示一个班级中所有学生的详细信息。首先，在React应用程序中，让我们假设您选择了一个类，然后React前端将向nodejs服务器发送一个查询。查询将包含特定的类名。现在nodejs将向mongodb发送一个查询，询问该类学生的详细信息，并将其发送回节点服务器。然后，节点服务器将详细信息发送到前端，并对其进行更新

如果您请求这样的连接，那么除了查询数据之外，根本就没有连接。不使用reactjs前端，您可以使用其他前端，它将为您提供相同的详细信息。React、Mongo和Node都能够在各自的领域独立工作

---

Axios是一个基于promise的HTTP客户端，用于浏览器和node.js

以下是我的express+react api的一部分：

var express = require('express');
var router = express.Router();

router.get('/', function (req, res) {
    res.render('index', {myjson: "myValue"});
})

module.exports = router;

基本上，我将json字符串发送到index.jsx，在那里呈现前端

此外，我在express中设置为：

app.set('views', __dirname + '/views');
app.set('view engine', 'jsx');
app.engine('jsx', reactViews.createEngine());

所以express服务器知道React在哪里

---

签出npm包。

堆栈的所有元素都可以独立使用，React、Node.Js和MongoDB。

---

它们可以安装在不同的服务器上，通过Fetch、Axios或任何其他工具进行通信。

您的意思是想通过套接字连接吗？如果您想在react with express中使用服务器端路由，可以使用next.js，否则您可以使用Axios从react应用程序直接点击api，在开发过程中，使用run on 3000进行响应，您的express服务器可能会在3000以外的单独服务器上运行