express - 如何在同一个 express 服务器上同时运行客户端和 API？

Question

我有一个使用 API 端点的 React/Redux 应用程序。我目前在一台服务器上渲染 React/Redux 客户端，在另一台服务器上渲染我的 API——两者都使用 express。我怎样才能在同一台服务器上同时运行它们。我会为我的客户提供一个静态目录并添加 GET/POST/etc 吗？对于这样的服务器:

//...

app.use(express.static('dist'));

app.get('/api/users', function(req, res) {
    //...
  })

app.post('/api/users', function(req, res) {
    //...
  })

const PORT = process.env.PORT || 3000;

app.listen(PORT, function() {
  console.log(`Listening on port ${PORT}...`);
});

非常感谢任何帮助。谢谢!!

Answer 1

您的建议应该可以正常工作，Express documentation 中对此进行了概述。 , 但如果你要提供静态文件，我建议将它们放在 Nginx 后面反向代理。 Nginx 非常擅长提供静态文件，而且如果您以后决定使用 HTTPS，您只需要为运行 Nginx 的机器提供一个证书，其余的通信可以通过 HTTP 完成。

基本上你会安装 Nginx 并设置你的配置看起来像这样:

upstream api_pool {
    server localhost:3000;
    # feel free to add as many other servers to this pool as you'd like
}

server {
    listen       80;
    server_name  localhost;

    root /www/static_stuff;

    location / {
    }

    location /api {
        proxy_pass http://api_pool;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_cache_bypass $http_upgrade;
    }
}

重新启动 Nginx 以使配置更改生效，将所有静态内容放入/www/static_stuff(或您决定创建根目录的任何内容)，然后在端口 3000 上启动您的 express 服务器。

现在，假设您将一个名为 style.css 的文件放入/www/static_stuff。将 Web 浏览器指向 localhost/style.css 将提供文件/www/static_stuff/style.css。将 Web 浏览器指向 localhost/api/some_express_route 就像将 Web 浏览器指向 localhost:3000/some_express_route 一样。

警告!我没有尝试这个配置文件，但如果你决定采用 Nginx 路线但它不起作用，请告诉我，我很乐意创建一个测试环境来让你启动和运行。