How to configure multiple projects with the same domain name in Nginx

There are two ways to configure multiple projects under the same domain name using Nginx:

nginx is distributed to different projects according to different directories
Enable the second-level domain name, and assign different second-level domain names to different projects

1. nginx is distributed to different projects according to different directories:

server {
  listen 80;
  server_name example.com;
 
  location ^~ /project1 {
    proxy_pass http://localhost:8081;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
 
  location ^~ /project2 {
    proxy_pass http://localhost:8082;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
 
  location / {
    proxy_pass http://localhost:8080;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

Three projects are configured here:

http://example.com/project1 is distributed to http://localhost:8081
The path http://example.com/project2 is distributed to http://localhost:8082
Other paths are distributed to http://localhost:8080

2. Enable the second-level domain name, and assign different second-level domain names to different projects

Note: Many students say it is invalid because you must first add an A record to the secondary domain name to the host. The same domain name can add N secondary domain names to the same host.

server {
  listen 80;
  server_name example.com;
  location / {
    proxy_pass http://localhost:8080;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

project1

server {
  listen 80;
  server_name project1.example.com;
  location / {
    proxy_pass http://localhost:8081;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

project2

server {
  listen 80;
  server_name project2.example.com;
  location / {
    proxy_pass http://localhost:8082;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

Note: These three projects belong to different domain names, and there will be cross-domain issues when accessing projects via http.

This is the end of this article about how to configure multiple projects with the same domain name in Nginx. For more information about configuring multiple projects with the same domain name in Nginx, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!

You may also be interested in:

Complete steps for Nginx proxy front-end and back-end separation projects with the same domain name
How to deploy multiple Vue projects under the same domain name using nginx and use reverse proxy

<<: Example of using CSS3 to customize the style of input multiple-select box

>>: Collapsed table row element bug