Feature/display root url setting

CHANGELOG

@@ -2,6 +2,7 @@
 - Fixed bug where HttPlaceholder would insert an incorrect value in the response if the "scenario_state" or the "scenario_hitcount" were used (https://github.com/dukeofharen/httplaceholder/pull/318).
 - Made several infrastructure changes to the code (https://github.com/dukeofharen/httplaceholder/pull/320).
 - Added AuditBehavior which logs all the interactions between the web API and the application layer using MediatR (only in verbose logging mode) (https://github.com/dukeofharen/httplaceholder/pull/320).
+- Added new `publicUrl` property which makes it possible to assign a root URL for both HttPlaceholder and the UI. Useful if you run HttPlaceholder behind a reverse proxy (https://github.com/dukeofharen/httplaceholder/pull/321).
 
 # BREAKING CHANGES
 

docker/httplaceholder-with-file-storage/docker-compose.yml

@@ -4,13 +4,12 @@ services:
   httplaceholder:
     image: dukeofharen/httplaceholder:latest
     environment:
-      fileStorageLocation: '/etc/httplaceholder'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
     volumes:
-      - stub_data:/etc/httplaceholder
+      - stub_data:/root/.httplaceholder
 
 volumes:
   stub_data:

docker/httplaceholder-with-mariadb/docker-compose.yml

@@ -9,7 +9,7 @@ services:
       mysqlConnectionString: 'Server=mariadb;Database=httplaceholder;Uid=httplaceholder;Pwd=httplaceholder;Allow User Variables=true'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
   mariadb:
     image: mariadb:10
@@ -19,7 +19,7 @@ services:
       MYSQL_USER: httplaceholder
       MYSQL_PASSWORD: httplaceholder
     ports:
-      - 3306:3306
+      - "3306:3306"
     volumes:
       - mariadb_data:/var/lib/mysql
 

docker/httplaceholder-with-mssql/docker-compose.yml

@@ -9,7 +9,7 @@ services:
       sqlServerConnectionString: 'Server=mssql,1433;Database=httplaceholder;User Id=sa;Password=Password123!'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
   mssql:
     image: mcr.microsoft.com/mssql/server:2019-latest
@@ -18,7 +18,7 @@ services:
       SA_PASSWORD: Password123!
       MSSQL_PID: Developer
     ports:
-      - 1433:1433
+      - "1433:1433"
     volumes:
       - mssql_data:/var/opt/mssql
       - ./initscripts:/usr/local/bin/initscripts

docker/httplaceholder-with-mysql5/docker-compose.yml

@@ -9,7 +9,7 @@ services:
       mysqlConnectionString: 'Server=mysql;Database=httplaceholder;Uid=httplaceholder;Pwd=httplaceholder;Allow User Variables=true;SSL Mode=None'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
   mysql:
     image: mysql:5
@@ -19,7 +19,7 @@ services:
       MYSQL_USER: httplaceholder
       MYSQL_PASSWORD: httplaceholder
     ports:
-      - 3306:3306
+      - "3306:3306"
     volumes:
       - mysql5_data:/var/lib/mysql
 

docker/httplaceholder-with-mysql8/docker-compose.yml

@@ -9,7 +9,7 @@ services:
       mysqlConnectionString: 'Server=mysql;Database=httplaceholder;Uid=httplaceholder;Pwd=httplaceholder;Allow User Variables=true'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
   mysql:
     image: mysql:8
@@ -19,7 +19,7 @@ services:
       MYSQL_USER: httplaceholder
       MYSQL_PASSWORD: httplaceholder
     ports:
-      - 3306:3306
+      - "3306:3306"
     volumes:
       - mysql8_data:/var/lib/mysql
 

docker/httplaceholder-with-reverse-proxy/docker-compose.yml

@@ -0,0 +1,23 @@
+# A Docker Compose example that starts HttPlaceholder with a file storage location and uses Nginx as reverse proxy.
+# HttPlaceholder can, when the Docker containers are started, be reached on http://localhost/httplaceholder and the UI on http://localhost/httplaceholder/ph-ui.
+version: '3.8'
+services:
+  httplaceholder:
+    image: dukeofharen/httplaceholder:latest
+    environment:
+      verbose: 'true'
+      publicUrl: 'http://localhost/httplaceholder'
+    restart: on-failure
+    volumes:
+      - stub_data:/root/.httplaceholder
+  nginx:
+    image: nginx:1.25.2
+    depends_on:
+      - httplaceholder
+    volumes:
+      - ./nginx.conf:/etc/nginx/nginx.conf
+    ports:
+      - "80:80"
+
+volumes:
+  stub_data:

docker/httplaceholder-with-reverse-proxy/nginx.conf

@@ -0,0 +1,51 @@
+events {
+        worker_connections  4096;
+}
+
+http {
+        map $http_host $port {
+                default 80;
+                "~^[^\:]+:(?<p>\d+)$" $p;
+        }
+
+        server {
+                listen 80;
+
+                location /httplaceholder {
+                        rewrite ^/httplaceholder(/.*)$ $1 break;
+                        proxy_pass http://httplaceholder:5000;
+                        proxy_set_header Host $host;
+                        proxy_set_header X-Real-IP $remote_addr;
+                        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+                        proxy_set_header X-Forwarded-Host $host:$port;
+                        proxy_set_header X-Forwarded-Proto $scheme;
+                }
+
+                location /httplaceholder/requestHub {
+                        rewrite ^/httplaceholder(/.*)$ $1 break;
+                        proxy_pass http://httplaceholder:5000/requestHub;
+                        proxy_http_version 1.1;
+                        proxy_set_header Upgrade $http_upgrade;
+                        proxy_set_header Connection "Upgrade";
+                        proxy_set_header Host $host;
+                }
+
+                location /httplaceholder/scenarioHub {
+                        rewrite ^/httplaceholder(/.*)$ $1 break;
+                        proxy_pass http://httplaceholder:5000/scenarioHub;
+                        proxy_http_version 1.1;
+                        proxy_set_header Upgrade $http_upgrade;
+                        proxy_set_header Connection "Upgrade";
+                        proxy_set_header Host $host;
+                }
+
+                location /httplaceholder/stubHub {
+                        rewrite ^/httplaceholder(/.*)$ $1 break;
+                        proxy_pass http://httplaceholder:5000/stubHub;
+                        proxy_http_version 1.1;
+                        proxy_set_header Upgrade $http_upgrade;
+                        proxy_set_header Connection "Upgrade";
+                        proxy_set_header Host $host;
+                }
+        }
+}

docker/httplaceholder-with-sqlite/docker-compose.yml

@@ -7,7 +7,7 @@ services:
       sqliteConnectionString: 'Data Source=/etc/httplaceholder/httplaceholder.db'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
     volumes:
       - sqlite_data:/etc/httplaceholder

docker/httplaceholder-with-stub-files/docker-compose.yml

@@ -8,7 +8,7 @@ services:
       useInMemoryStorage: 'true'
       verbose: 'true'
     ports:
-      - 5000:5000
+      - "5000:5000"
     restart: on-failure
     volumes:
       - ./stubs:/etc/httplaceholder

docs/docs.md

@@ -2410,6 +2410,14 @@ httplaceholder --readProxyHeaders false
 
 By disabling the reading of the proxy headers, the IP, host and protocol as received by the client are always used.
 
+### Public URL
+
+When running HttPlaceholder behind a reverse proxy, you should set the public URL. This makes sure that requests made by the [UI](#management-interface) will succeed and the value written by the [root URL variable parser](#root-url) and [display URL variable parser](#display-url) is correct. This is not needed when not running behind a reverse proxy.
+
+```bash
+httplaceholder --publicUrl https://example.com/stubs
+```
+
 ## Authentication
 
 ### REST API Authentication (optional)

gui/index.html

@@ -1,13 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" href="favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<head>
+    <meta charset="UTF-8"/>
+    <link rel="icon" href="favicon.ico"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>HttPlaceholder</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
+</head>
+<body>
+<div id="app"></div>
+<script type="module" src="/src/main.ts"></script>
+</body>
 </html>

gui/src/plugins/api.ts

@@ -1,5 +1,6 @@
-import { addBeforeSendHandler } from "@/utils/api";
+import { addBeforeSendHandler, setDefaultRequestOptions } from "@/utils/api";
 import { useUsersStore } from "@/store/users";
+import { getRootUrl } from "@/utils/config";
 
 addBeforeSendHandler((url: string, request: RequestInit) => {
   const usersStore = useUsersStore();
@@ -9,3 +10,8 @@ addBeforeSendHandler((url: string, request: RequestInit) => {
     (request.headers as any).Authorization = `Basic ${token}`;
   }
 });
+
+setDefaultRequestOptions({
+  headers: undefined,
+  rootUrl: getRootUrl(),
+});