apinginxwebserverweb-hostingproxy-server

Host static website and api service on same server using nginx


I want to serve my static website and API service from same machine using nginx.

Website is present in /var/www/html
API service is running on port 8000

http://localhost should open static website
http://localhost/api should proxy api service which is running on port 8000

With the help of http://nginx.org/en/docs/beginners_guide.html I tried this config

server {
        listen 80 default_server;
        listen [::]:80 default_server;

        root /var/www/html;

        index index.html index.htm index.nginx-debian.html;

        server_name _;

        location / {
                try_files $uri $uri/ =404;
        }

        location /api {
                proxy_pass http://localhost:8000;
        }
}

http://localhost is working fine but http://localhost/api is giving me error 404.

What should be correct configuration to achive such infrastucture?


Solution

  • Here I am writing a conf that can perform the operation you need:

    server {
      listen 80;
      server_name <server_name_you_prefers>;
    
      location / {
        alias /var/www/html/; # Static directory's complete path from root
      }
    
      location /api {
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $host;
        proxy_pass_request_headers on;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        add_header 'Access-Control-Allow-Origin' '*' always;
        add_header 'Access-Control-Allow-Methods' 'GET,PUT,PATCH,POST,DELETE,OPTIONS,HEAD';
        add_header 'Access-Control-Expose-Headers' 'Origin,Content-Length,Content-Range,Authorization,Content-Type';
        add_header 'Access-Control-Allow-Headers' 'Content-Length,Content-Range,Authorization,Content-Type,x-json-response';
        add_header 'Access-Control-Allow-Credentials' 'true' always;
      }
    }