如何将MERN堆栈部署到托管服务？

Question

我是一名新手网站开发者，我有一个托管服务，想要部署我的reactjs/node项目。以前我只需上传运行npm run build生成的构建文件夹来部署它。现在我使用MERN栈添加了连接到mongodb数据库的功能。

该项目最初是使用create-react-app创建的，然后我按照这个教程设置了我的后端节点/mongodb：https://appdividend.com/2018/11/11/react-crud-example-mern-stack-tutorial/。所有服务器代码都在项目文件夹中的api文件夹中。

我可以通过运行npm start、nodemon server.js(从api文件夹中)并在终端中连接到mongodb，在本地主机上运行该项目。当我尝试像之前一样从托管服务运行它时，它说无法连接到数据库，我想这是因为连接没有在我的计算机上打开。

目前，所有API调用都使用axios post到http://localhost:4000/，我认为这也不适用于服务器。我已经在网上查找关于部署MERN栈的信息，但我找到的所有文章都是关于如何在AWS EC2上托管，而这不是我要做的事情。

我该如何将应用部署到我的托管服务上？有哪些参考资料或位置可以寻找这些信息？

编辑：我已经使用MongoAtlas连接到了数据库，因此使用了SRV地址。我认为问题在于axios post请求使用的是本地主机地址，因为只有在我的本地机器上运行nodemon时，服务器上的应用程序才能正常工作。我应该使用什么地址代替它？

- Meghan King

Answer 1

目前，所有的API调用都使用axios post到http://localhost:4000/，我也认为这在服务器上不起作用。

你是正确的，这不起作用。因为如果用户获取了你的React应用程序，所有的API调用将被重定向到他们的“localhost”。这并不包含你的API。

当我尝试以与之前相同的方式从托管服务运行它时，它会显示无法连接到数据库，我认为这可能是因为连接没有在我的机器上打开。这可能是因为MongoDB URL仍然设置为类似“mongodb://localhost:27017/myapp”的东西。这里有两个主要选项。

1. 使用类似于MongoDB Atlas的数据库托管服务，然后您需要更改数据库的URL以指向该服务提供的URL。
2. 将数据库托管在您的服务器上，这将与localhost URL配合使用。

我已经在网上查找了有关部署MERN堆栈的信息，但是我发现所有的讨论都是以在AWS EC2上托管为基础的，而这不是我要做的。

• 任何你有控制和灵活性的服务器 在这个场景中都可以使用。如果你想的话，你可以在上面托管所有东西（服务器，前端和数据库）。EC2 可以完成所有这些，但不是你唯一的选择。你也可以查看来自微软和谷歌等公司的类似产品......
• 另一种方法是分别部署每个组件，这更具可扩展性，但也引入了其自身的复杂性。如果你选择这种方式，你可能需要了解Docker 容器和Kubernetes，它们对于编排分布式系统非常有用。

编辑

由于你正在使用 MongoDB Atlas，请确保将服务器的 IP 地址列入白名单。

- molamk

---

我已经使用MongoAtlas连接到了数据库，因此正在使用SRV地址。我认为问题在于axios使用本地主机地址进行发布，因为只有在我的本地计算机上运行nodemon时，服务器上的应用程序才能正常工作。我应该使用什么地址代替这个？（编辑帖子以包括此内容） - Meghan King

你的前端需要调用后端的URL。例如，如果它托管在backend.com上，则类似于https://backend.com:your_port/api @MeghanKing - molamk

这个需要在服务器上安装mongodb才能运行吗？ - Meghan King

@MeghanKing 不是的。唯一的条件是服务器需要知道数据库的正确URL。所以如果你使用Atlas，那么它是srv...，如果它在同一台服务器上，则为localhost...。但是在前端，它必须指向服务器的URL。 - molamk

Answer 2

在前端，您需要设置一个axios配置，该配置将根据运行环境指向正确的URL： utils/axiosConfig.js（我喜欢使用名称app，以与express保持一致，但您可以随意命名）

import axios from 'axios';

const env = process.env.NODE_ENV; // current environment

export const app = axios.create({
  baseURL:
    env === 'production'
      ? 'http://example.com/api/' // production
      : 'http://localhost:5000/api/', // development
});

然后你可以在进行API调用时使用这个配置：

import { app } from '../utils/axiosConfig.js';

app.get("example");
app.post("example");
...etc

现在，它可以向 http://localhost:5000/api/example 或者 http://example.com/api/example 发送请求。

在你的 client package.json 中，你可以指定环境：

 "scripts": {
    "start": "NODE_ENV=development webpack-dev-server",
    "build": "NODE_ENV=production webpack",
    "stage": "NODE_ENV=staging webpack",
    "test": "NODE_ENV=testing jest --watchAll --coverage",
  },

- Matt Carlotta

---

这个需要在服务器上安装mongodb才能运行吗？ - Meghan King

不，这取决于您。您可以使用第三方主机，也可以在您的托管机器上设置Mongodb。 - Matt Carlotta

Answer 3

是的，您需要将服务部署到已经建立好的托管平台上。

有多种解决方案可供选择，例如Digital Ocean。以下是一些相关链接：

如何为生产环境设置Node.js应用程序

如何在Ubuntu上安装MongoDB

此外，还有Heroku。这里有一个完整的教程：

准备和部署MERN堆栈。

正如我所说，除了这些之外，还有其他多种解决方案。希望这能帮到您。

- Jazib

Answer 4

简洁版：

运行基于nodejs的应用程序需要拥有自己的服务器。

详情：

您可能拥有共享的托管计划，其中大多数不提供第三方和开源项目。(如nodejs或docker)

对于初创公司，我建议您考虑以下几点：

1. 如何获取提供docker容器的托管VPS(虚拟专用服务器)。 将您的应用程序放入docker容器中并上传至您的服务器。(例如Amazon、Azure等)

2. 其他更便宜的选择是获取未经管理的VPS，您需要自己安装操作系统、依赖项、数据库、防火墙等。不要被它们的名称吓到。

3. 购买一台专用服务器并安装所需的所有软件，申请静态IP将您的域名指向您的静态IP。

第三个选项在长期来看具有可扩展性且更加便宜，但学习有关服务器及其复杂性的知识也很重要。

- Naveed Abbas