如何在一个域名下托管多个应用程序?

How can I host multiple apps under one domain name?

假设我拥有一个域名:domain,并且我在 www.domain.com 上托管了一个静态博客。拥有静态网站的好处是我可以在 netlify.

这样的网站上免费托管它

我现在想在同一个域名下拥有多个静态网络应用程序,这样我就不必为每个网络应用程序购买一个域。我可以通过为我的应用程序添加一个子域来做到这一点。添加子域很容易。 This video 举例说明了如何使用 GoDaddy 执行此操作。我可以为我的应用程序创建一个名为 apps.domain.com 的页面,其中 apps 是我的子域。

说,我有几个静态网络应用程序:app1app2app3。我不想为每一个单独的子域,例如 app1.domain.com。我想要的是将每个应用程序作为 apps 子域下的子文件夹。换句话说,我想要以下端点:

apps.domain.com 主页上,我可能会有一个列出可以访问的各种应用程序的静态页面。

我该如何设置它?我是否需要在 apps.domain.com 有某种服务器(例如 nginx)?问题是我希望能够彼此独立地开发和部署 app1、app2、app3 等,并且独立于 apps 子域。这些应用程序中的每一个都可能由 netlify 或类似的东西托管。

也许这个问题有一个明显的答案,但我现在不知道该怎么做。我将不胜感激指向正确方向的指针。

如果您决定使用 nginx,下面的内容应该可以帮助您入门。这是一个非常基本的设置。您可能需要对其进行相当多的调整以满足您的要求。

apps.domain.com 将从 /var/www

服务 index.html

apps.domain.com/app1 将从 /var/www/app1

服务器 index.html

apps.domain.com/app2 将从 /var/www/app2

服务器 index.html

apps.domain.com/app3 将从 /var/www/app3

服务器 index.html
http {
  log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                  '$status $body_bytes_sent "$http_referer" '
                  '"$http_user_agent" "$http_x_forwarded_for"';

  access_log  /var/log/nginx/access.log  main;

  sendfile            on;
  tcp_nopush          on;
  tcp_nodelay         on;
  keepalive_timeout   65;
  types_hash_max_size 2048;
  include             /etc/nginx/mime.types;
  default_type        application/octet-stream;
  index               index.html;

  include /etc/nginx/conf.d/*.conf;

  server {
    listen       80 default_server;
    listen       [::]:80 default_server;
    server_name  apps.domain.com;
    root         /var/www;

    # Load configuration files for the default server block.
    include /etc/nginx/default.d/*.conf;

    location / {

    }

    location /app1 {

    }

    location /app2 {

    }

    location /app3 {

    }    

    error_page 404 /404.html;
        location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
        location = /50x.html {
    }
}

仅需补充一点:如果您在外部服务器上托管应用程序,您可能需要设置 nginx 并使用代理插件将来自 nginx 安装的传入请求转发到外部网络服务器:

web-browser -> nginx -> external-web-server

以及需要转发的位置:

location /app1 {
   proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
   proxy_set_header Host $http_host;
   proxy_redirect off;
   proxy_pass https://url-of-external-webserver;
}

您似乎过早地问了这个问题 — 在使用天真的方法做您想做的事情时,您遇到了哪些实际问题?!

将每个应用 运行 放在自己的域或子域中通常是最好的主意;这样做是为了防止 XSS 攻击,在这种攻击中,您的一个应用程序中的漏洞可能会导致您的整个域变得脆弱。这是因为安全功能通常在每个域的基础上在浏览器中实现,其中假定整个域都在单一方的控制之下(例如,运行ning 单个应用程序,最后当天)。

否则,要在一个域上拥有多个应用程序,真的没有什么特别需要做的。如果您在每个应用程序中的路径都是正确的(例如,它们是相对的,或者是特定应用程序位置的完整路径的绝对路径),坦率地说,真的没有任何需要注意的具体问题。

我最初使用nginx解决了这个问题。但是,我对此很不满意,因为我需要支付服务器费用,还需要为其设置架构等。

据我所知,最简单的方法是使用 URL 重写。例如。 Netlify rewrites, Next.js rewrites.

重写允许您将传入请求路径映射到不同的目标路径。

Here 是我网站中的示例用法。