Skip to content

Reverse Proxy Setup with NGINX

PhlexPlexico edited this page Jul 7, 2021 · 4 revisions

So instead of using webpack to reverse proxy requests (as it shouldn't be, since this is a production build after all, and HTTPS needs to be handled, etc. etc.), I've elected to attempting to setup NGINX as a reverse proxy to the API. The way we're going to make this work is that the front end will run off of NGINX (via yarn build and placing all the files in dist into your web directory, usually this is /var/www/html, but you may have other websites running and whatnot), then contact the API through a reverse proxy.

The biggest issue I had was setting up the config to ensure it's working properly. After a few hours of finnagling I've found a reliable setup for the config. Using the default server config, I added a proxy_pass for anything that goes to /api/

##
# Default server configuration
#
server {
        listen 80 default_server;
        listen [::]:80 default_server;

        # SSL configuration
        #
        # listen 443 ssl default_server;
        # listen [::]:443 ssl default_server;
        #
        # Note: You should disable gzip for SSL traffic.
        # See: https://bugs.debian.org/773332
        #
        # Read up on ssl_ciphers to ensure a secure configuration.
        # See: https://bugs.debian.org/765782
        #
        # Self signed certs generated by the ssl-cert package
        # Don't use them in a production server!
        #
        # include snippets/snakeoil.conf;

        # This is where the build for G5V resides, update this to wherever you need.
        root /var/www/html;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        # Change this to whichever hostname you have, such as get5.phlexplexi.co
        server_name example.com;

        # This is the main block that was added. Currently the API runs on port 3301. You may adjust to what you need it to if you changed ports in the config.
        location /api/ {
                proxy_pass http://localhost:3301/;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

        # IF YOU'RE USING THE DOCKER IMAGE, THIS WILL HAVE TO BE UPDATED IN THE DOCKER IMAGE ITSELF. Do not put this on your reverse proxy.
        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri /index.html;
        }


        # pass PHP scripts to FastCGI server
        #
        #location ~ \.php$ {
        #       include snippets/fastcgi-php.conf;
        #
        #       # With php-fpm (or other unix sockets):
        #       fastcgi_pass unix:/var/run/php/php7.0-fpm.sock;
        #       # With php-cgi (or other tcp sockets):
        #       fastcgi_pass 127.0.0.1:9000;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #       deny all;
        #}
}

Once this is done, try testing out your configuration (which is placed in /etc/nginx/sites-available and linked ln -sf /etc/nginx/sites-available/yourcfgname /etc/nginx/sites-enabled/) with nginx -t. If successful, then you'll be good to go!

One other change that needs to be done is in the configuration in G5API. In the server block, make sure you set your hostname, clientHome, and apiURL to whatever your server_name is in the NGINX config.

You may feel free to include your SSL certs by following many guides on google, such as the first hit for example.

Still not working?

As reported in issue #61 it seems that other portions of other software may affect what is put in your configs, so please make sure to double check the config, and perhaps disable PHP on the domain that you're using to ensure that this config falls back correctly.

Clone this wiki locally