如何在一个域上运行两个 React 项目？答案

【问题标题】：How to run two React projects on one domain?如何在一个域上运行两个 React 项目？
【发布时间】：2019-08-13 01:52:10
【问题描述】：

我是服务器配置的新手。我在 Linode 服务器上有两个正在运行的 React 项目，分别是 port 3000 和 5000。这两个 React 项目是不同的。端口3000 用于主页，端口5000 用于管理页面。现在我也购买了https://www.testeam.com的域名。如何将域名映射到我的反应项目如下？

+-------|---------------|-----------------------------+
| Page  | react project | Domain Name                 |
+-------|---------------|-----------------------------+
| Home  | port 3000     | https://www.testeam.com     |
+-------|---------------|-----------------------------+
| Admin | port 5000     | https://www.testeam.com/app |
+-------|---------------|-----------------------------+

注意：管理页面使用不同的目录app访问。

【问题讨论】：

理想情况下，您应该使用subdomain.domain.com。然后创建一个CNAME 记录到*.subdomain.domain.com 和一个A 记录到subdomain.domain.com。然后在您的nginx 配置中，您会将所有到子域的请求路由到另一个应用程序文件夹。然后你可以像这样访问管理应用程序：admin.testteam.com
@MattCarlotta，我应该做不同的目录而不是子域吗？

标签： reactjs nginx routes

【解决方案1】：

您可以为 nginx 使用反向代理。请阅读有关此主题的更多信息here

假设您只想在 https 中提供这些，这将是端口 443 的建议服务器块：

server {
    listen 443 ssl;
    listen [::]:443 ssl;

    server_name testeam.com www.testeam.com;

    # to map "Home" page
    location / {
        proxy_pass http://localhost:3000;
        # add other proxy configurations here
    }

    # to map "Admin" page
    location /app/ {
        proxy_pass http://localhost:5000;
        # add other proxy configurations here
    }

    # include SSL configurations here
}

添加：如果您想在添加 SSL 配置之前确保它有效，您可以使用相同的服务器块，但将 443 更改为 80。如果您对它感到满意，请仅使用端口 80 重定向到 https，然后使用上面的服务器块在 https 中提供页面，

希望这会有所帮助！

【讨论】：