使用Heroku

Question

我有一个应用程序，我们称之为derpshow，它由两个存储库组成，一个用于前端，一个用于后端。

我想使用Heroku部署这些，最好是在同一个域上。我还想将两个部分的管道分开使用，每个管道都有一个分段和生产环境。

是否可以让两个应用在同一个域上运行，以便前端可以在/api/*上调用后端？另一个选择是在api.derpshow.com和app.derpshow.com的前端提供后端，但这会使安全性有些复杂。

这方面的最佳做法是什么？前端只是静态文件，所以它甚至可以从S3或类似的服务，但我仍然需要登台和生产环境和自动测试等等。

非常感谢任何建议！

Answer 1

对于您的尝试，您必须使用网络服务器来提供静态内容，并提供对持有您的应用程序的容器（gunicorn，tomcat等）的访问权限。这也是最佳做法。

假设您使用nginx作为网络服务器，因为它更容易设置。 nginx配置文件看起来像这样

# Server definition for project A
server {
    listen             80;
    server_name        derpshow.com www.derpshow.com;

    location / {
        # Proxy to gUnicorn.
        proxy_pass             http://127.0.0.1:<projectA port>;
        # etc...
    }
}

# Server definition for project B
server {
    listen             80;
    server_name        api.derpshow.com www.api.derpshow.com;

    location / {
        # Proxy to gUnicorn on a different port.
        proxy_pass             http://127.0.0.1:<projectBg port>;
        allow   127.0.0.1;
        deny    all;
        # etc...
    }
}

就是这样。

OLD ANSWER：尝试使用nginx-buildpack它允许您在Heroku上的应用服务器前运行NGINX。然后，您需要在不同的端口上运行您的应用程序，并将一个端口设置为api.derpshow.com，将其他端口设置为app.derpshow.com，然后您只能从localhost限制对api.derpshow.com的调用。

Answer 2

愿意贡献我最近做的事情。我有一个NodeJS w / Express后端和一个普通的Bootstrap / vanilla前端（只用Cannot delete or update a parent row: a foreign key constraint fails (`database`.`response_user`, CONSTRAINT `FKf48he1fef6q4d4t3kw4605pfw` FOREIGN KEY (`user_id`) REFERENCES `user` (`id`)) 进行通信）。要连接这两个，您只需告诉express提供静态文件（即向/index.html，/ img / pic1.png提供请求）等。

例如，要告诉express在目录test_site1中提供资源，只需执行：

XMLHttpRequest

非常感谢这篇帖子提出的想法：https://www.fullstackreact.com/articles/deploying-a-react-app-with-a-server/

请注意，所有这些答案似乎都是合并由一个整体服务器提供的代码的变体。

Jozef的回答似乎是在所有内容（前端和后端）之上添加一个完整的nginx服务器来反转代理请求。

我的回答是让你的后端服务器提供前端请求;我确信还有一种方法可以让前端服务器提供后端请求。