Nginx Reverse Proxy Strips Path Prefix Trailing Slash Redirect in Docker Compose Hugo Deployment

Introduction

In this article, we will discuss how to configure Nginx reverse proxy in a Docker Compose environment to properly handle path rewriting for a Hugo blog. Specifically, we will address an issue where requests to /Hugo-Blog/X/Y/Z are being redirected to /X/Y/Z instead of maintaining the desired path prefix.

Context

When deploying a Hugo blog using Docker Compose, you may want to use an Nginx reverse proxy to handle HTTP traffic. One challenge that arises is ensuring that the URL path is properly maintained when redirecting requests. By default, Nginx will not strip the path prefix or remove trailing slashes, resulting in incorrect redirections.

Key Concepts

• path_strip_prefix: An Nginx directive to remove the specified prefix from the incoming request path
• permanent: An Nginx directive used to return a 301 Moved Permanently response to a client
• trailing_slash: An Nginx directive to add or remove a trailing slash from a location

Solution

To overcome the path rewriting problem, we need to configure Nginx to strip the path prefix and remove trailing slashes. This can be achieved by using the path_strip_prefix and trailing_slash directives in our Nginx configuration.

Nginx Configuration

In the Nginx configuration file, specify the path_strip_prefix and trailing_slash directives as follows:

server {
 listen 80;

 location /Hugo-Blog {
 path_strip_prefix /Hugo-Blog;
 index index.html;

 location / {
 trailing_slash off;
 proxy_pass http://hugo:1313;
 }
 }
}

This configuration will remove the /Hugo-Blog path prefix as well as ensure that there is no trailing slash when proxy_passing to the Hugo container.

In-Depth Explanation

First, the path_strip_prefix directive removes the specified prefix from the incoming request. In our case, we want to remove the /Hugo-Blog path prefix.

Next, the index directive specifies which file to serve as the default page for a location. For a Hugo blog, this would be index.html. After this, we define a new location block for the remaining path.

The trailing_slash directive is used to control the presence or absence of a trailing slash in the location. By setting it to off, we ensure that there is no trailing slash in the proxy_pass request.

Lastly, the proxy_pass directive specifies the address and port to which Nginx should forward the request. In our case, this should be the address of the Hugo container—http://hugo:1313.

In this article, we discussed a path-rewriting issue with an Nginx reverse proxy in a Docker Comp ```