0

My partner and I are developing an Angular 10 web application that creates a new subdomain per user (e.g. User: John. Subdomain: john.domain.com). The thing here is that we are using Nginx inside a docker container, and I have no idea how to dynamically generate those subdomains.

Since I don't know how to create those dynamic subdomains I'm not quite sure If I should create a new angular app for the users websites or use the same angular app for both, the users website and our projects website.

I read in another question that the right configuration for my nginx.conf should look like this:

server

{

root /sites/$http_host;

server_name $http_host;

...

}

But then he adds:

I like this as I can literally create sites on the fly, just create new directory named after the domain and point the DNS to the server ip.

This is where I get completely lost. I know what a DNS is and what they do, as well as IP's, but I have no idea how to dynamically create those new directories as well as point the DNS' to them. A friend told me something about bash scripting to add the directories but I'm not quite sure.

I would appreciate any help or guidance, I am completely lost.

1 Answers1

0

I don't know much about angular, but your general approach should be the following:

  • Create the wildcard DNS record for your domain and point it to your server;

  • Create the nginx server block for the *.domain.com and get the user name from the incoming request. This can be done several ways, for example

    map $http_host $username {
        ~^(.*)\.domain\.com$    $1;
    }
    
    server {
        ...
        server_name *.domain.com;
        ...
    }
    

    or

    server {
        ...
        server_name ~^(?<username>.*)\.domain\.com;
        ...
    }
    

    In both cases the user name would be accessible via the $username nginx variable.

  • Pass username to your angular app. As I said, I don't know how the angular apps are written, but if you tell me how some parameter could be passed to such an application (via query argument, HTTP header, URI route etc.), I will suggest you how to do it with the nginx config.

I don't know should it be a new angular application or this functionality could be added to your main app (I think you can do it both ways), but what I'm sure of is that you don't need to dynamically generate subdomains or create directories for users.

Ivan Shatsky
  • 13,267
  • 2
  • 21
  • 37
  • I ended up in a forum that partly explained the same but It worked like a charm with your answer. I added and it worked just fine: server { server_name *.localhost; location / { root /usr/share/nginx/html; index index.html index.htm; } } – Ángel Rivas 0dayyy Nov 05 '20 at 00:22
  • @ÁngelRivas0dayyy Hey, this approach isn't for `localhost` and won't work with it. There is no errors in your config from nginx point of view, but your server block won't ever receive any request. If you want to develop this using some local domain, look at [this](https://stackoverflow.com/questions/20446930/how-to-put-wildcard-entry-into-etc-hosts) thread for example. – Ivan Shatsky Nov 05 '20 at 01:24