forked from vikunja/vikunja
docs: add config guide for NGINX Proxy Manager
Taken from https://github.com/go-vikunja/frontend/issues/28#issuecomment-1765096790
This commit is contained in:
parent
e1525fca6e
commit
a1d0541a7a
GPG Key ID:
F40E70337AB24C9B
|
|
@ -1,147 +1,316 @@
|
||||||
---
|
---
|
||||||
date: "2019-02-12:00:00+02:00"
|
date: "2019-02-12:00:00+02:00"
|
||||||
title: "Reverse Proxy"
|
title: "Reverse Proxy"
|
||||||
draft: false
|
draft: false
|
||||||
type: "doc"
|
type: "doc"
|
||||||
menu:
|
menu:
|
||||||
sidebar:
|
sidebar:
|
||||||
parent: "setup"
|
parent: "setup"
|
||||||
---
|
---
|
||||||
|
|
||||||
# Setup behind a reverse proxy which also serves the frontend
|
# Setup behind a reverse proxy which also serves the frontend
|
||||||
|
|
||||||
These examples assume you have an instance of the backend running on your server listening on port `3456`.
|
These examples assume you have an instance of the backend running on your server listening on port `3456`.
|
||||||
If you've changed this setting, you need to update the server configurations accordingly.
|
If you've changed this setting, you need to update the server configurations accordingly.
|
||||||
|
|
||||||
{{< table_of_contents >}}
|
{{< table_of_contents >}}
|
||||||
|
|
||||||
## NGINX
|
## NGINX
|
||||||
|
|
||||||
Below are two example configurations which you can put in your `nginx.conf`:
|
Below are two example configurations which you can put in your `nginx.conf`:
|
||||||
|
|
||||||
You may need to adjust `server_name` and `root` accordingly.
|
You may need to adjust `server_name` and `root` accordingly.
|
||||||
|
|
||||||
### with gzip enabled (recommended)
|
### with gzip enabled (recommended)
|
||||||
|
|
||||||
{{< highlight conf >}}
|
{{< highlight conf >}}
|
||||||
gzip on;
|
gzip on;
|
||||||
gzip_disable "msie6";
|
gzip_disable "msie6";
|
||||||
|
|
||||||
gzip_vary on;
|
gzip_vary on;
|
||||||
gzip_proxied any;
|
gzip_proxied any;
|
||||||
gzip_comp_level 6;
|
gzip_comp_level 6;
|
||||||
gzip_buffers 16 8k;
|
gzip_buffers 16 8k;
|
||||||
gzip_http_version 1.1;
|
gzip_http_version 1.1;
|
||||||
gzip_min_length 256;
|
gzip_min_length 256;
|
||||||
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml;
|
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml;
|
||||||
|
|
||||||
server {
|
server {
|
||||||
listen 80;
|
listen 80;
|
||||||
server_name localhost;
|
server_name localhost;
|
||||||
|
|
||||||
location / {
|
location / {
|
||||||
root /path/to/vikunja/static/frontend/files;
|
root /path/to/vikunja/static/frontend/files;
|
||||||
try_files $uri $uri/ /;
|
try_files $uri $uri/ /;
|
||||||
index index.html index.htm;
|
index index.html index.htm;
|
||||||
}
|
}
|
||||||
|
|
||||||
location ~* ^/(api|dav|\.well-known)/ {
|
location ~* ^/(api|dav|\.well-known)/ {
|
||||||
proxy_pass http://localhost:3456;
|
proxy_pass http://localhost:3456;
|
||||||
client_max_body_size 20M;
|
client_max_body_size 20M;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
{{< /highlight >}}
|
{{< /highlight >}}
|
||||||
|
|
||||||
<div class="notification is-warning">
|
<div class="notification is-warning">
|
||||||
<b>NOTE:</b> If you change the max upload size in Vikunja's settings, you'll need to also change the <code>client_max_body_size</code> in the nginx proxy config.
|
<b>NOTE:</b> If you change the max upload size in Vikunja's settings, you'll need to also change the <code>client_max_body_size</code> in the nginx proxy config.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
### without gzip
|
### without gzip
|
||||||
|
|
||||||
{{< highlight conf >}}
|
{{< highlight conf >}}
|
||||||
server {
|
server {
|
||||||
listen 80;
|
listen 80;
|
||||||
server_name localhost;
|
server_name localhost;
|
||||||
|
|
||||||
location / {
|
location / {
|
||||||
root /path/to/vikunja/static/frontend/files;
|
root /path/to/vikunja/static/frontend/files;
|
||||||
try_files $uri $uri/ /;
|
try_files $uri $uri/ /;
|
||||||
index index.html index.htm;
|
index index.html index.htm;
|
||||||
}
|
}
|
||||||
|
|
||||||
location ~* ^/(api|dav|\.well-known)/ {
|
location ~* ^/(api|dav|\.well-known)/ {
|
||||||
proxy_pass http://localhost:3456;
|
proxy_pass http://localhost:3456;
|
||||||
client_max_body_size 20M;
|
client_max_body_size 20M;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
{{< /highlight >}}
|
{{< /highlight >}}
|
||||||
|
|
||||||
<div class="notification is-warning">
|
<div class="notification is-warning">
|
||||||
<b>NOTE:</b> If you change the max upload size in Vikunja's settings, you'll need to also change the <code>client_max_body_size</code> in the nginx proxy config.
|
<b>NOTE:</b> If you change the max upload size in Vikunja's settings, you'll need to also change the <code>client_max_body_size</code> in the nginx proxy config.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
## NGINX Proxy Manager (NPM)
|
## NGINX Proxy Manager (NPM)
|
||||||
|
|
||||||
1. Create a standard Proxy Host for the Vikunja Frontend within NPM and point it to the URL you plan to use. The next several steps will enable the Proxy Host to successfully navigate to the API (on port 3456).
|
### Method 1
|
||||||
2. Verify that the page will pull up in your browser. (Do not bother trying to log in. It won't work. Trust me.)
|
|
||||||
3. Now, we'll work with the NPM container, so you need to identify the container name for your NPM installation. e.g. NGINX-PM
|
Following the [Docker Walkthrough]({{< ref "docker-start-to-finish.md" >}}) guide, you should be able to get Vikunja to work via HTTP connection to your server IP.
|
||||||
4. From the command line, enter `sudo docker exec -it [NGINX-PM container name] /bin/bash` and navigate to the proxy hosts folder where the `.conf` files are stashed. Probably `/data/nginx/proxy_host`. (This folder is a persistent folder created in the NPM container and mounted by NPM.)
|
|
||||||
5. Locate the `.conf` file where the server_name inside the file matches your Vikunja Proxy Host. Once found, add the following code, unchanged, just above the existing location block in that file. (They are listed by number, not name.)
|
From there, all you have to do is adjust the following things:
|
||||||
```nginx
|
|
||||||
location ~* ^/(api|dav|\.well-known)/ {
|
#### In `docker-compose.yml`
|
||||||
proxy_pass http://api:3456;
|
|
||||||
client_max_body_size 20M;
|
Under `api:`,
|
||||||
}
|
|
||||||
```
|
1. Change `VIKUNJA_SERVICE_FRONTENDURL:` to your desired domain with `https://` and `/`.
|
||||||
6. After saving the edited file, return to NPM's UI browser window and refresh the page to verify your Proxy Host for Vikunja is still online.
|
|
||||||
7. Now, switch over to your Vikunja browser window and hit refresh. If you configured your URL correctly in original Vikunja container, you should be all set and the browser will correctly show Vikunja. If not, you'll need to adjust the address in the top of the login subscreen to match your proxy address.
|
2. Expose your desired port on host under `ports:`.
|
||||||
|
|
||||||
## Apache
|
example:
|
||||||
|
|
||||||
Put the following config in `cat /etc/apache2/sites-available/vikunja.conf`:
|
```yaml
|
||||||
|
api:
|
||||||
{{< highlight aconf >}}
|
image: vikunja/api
|
||||||
<VirtualHost *:80>
|
environment:
|
||||||
ServerName localhost
|
VIKUNJA_DATABASE_HOST: db
|
||||||
|
VIKUNJA_DATABASE_PASSWORD: secret
|
||||||
<Proxy *>
|
VIKUNJA_DATABASE_TYPE: mysql
|
||||||
Order Deny,Allow
|
VIKUNJA_DATABASE_USER: vikunja
|
||||||
Allow from all
|
VIKUNJA_DATABASE_DATABASE: vikunja
|
||||||
</Proxy>
|
VIKUNJA_SERVICE_JWTSECRET: <your-random-secret>
|
||||||
ProxyPass /api http://localhost:3456/api
|
VIKUNJA_SERVICE_FRONTENDURL: https://vikunja.your-domain.com/ # change vikunja.your-domain.com to your desired domain/subdomain.
|
||||||
ProxyPassReverse /api http://localhost:3456/api
|
ports:
|
||||||
ProxyPass /dav http://localhost:3456/dav
|
- 3456:3456 # Change 3456 on the left to the port of your choice.
|
||||||
ProxyPassReverse /dav http://localhost:3456/dav
|
volumes:
|
||||||
ProxyPass /.well-known http://localhost:3456/.well-known
|
- ./files:/app/vikunja/files
|
||||||
ProxyPassReverse /.well-known http://localhost:3456/.well-known
|
depends_on:
|
||||||
|
- db
|
||||||
DocumentRoot /var/www/html
|
restart: unless-stopped
|
||||||
RewriteEngine On
|
```
|
||||||
RewriteRule ^\/?(favicon\.ico|assets|audio|fonts|images|manifest\.webmanifest|robots\.txt|sw\.js|workbox-.*|api|dav|\.well-known) - [L]
|
|
||||||
RewriteRule ^(.*)$ /index.html [QSA,L]
|
Under `frontend:`,
|
||||||
</VirtualHost>
|
|
||||||
{{< /highlight >}}
|
1. Add `VIKUNJA_API_URL:` under `environment:` and input your desired `API` domain with `https://` and `/api/v1/`. The `API` domain should be different from the one in `VIKUNJA_SERVICE_FRONTENDURL:`.
|
||||||
|
|
||||||
**Note:** The apache modules `proxy`, `proxy_http` and `rewrite` must be enabled for this.
|
example:
|
||||||
|
|
||||||
For more details see the [frontend apache configuration]({{< ref "install-frontend.md#apache">}}).
|
```yaml
|
||||||
|
frontend:
|
||||||
## Caddy
|
image: vikunja/frontend
|
||||||
|
environment:
|
||||||
{{< highlight conf >}}
|
VIKUNJA_API_URL: https://api.your-domain.com/api/v1/ # change api.your-domain.com to your desired domain/subdomain, it should be different from your frontend domain
|
||||||
vikunja.domainname.tld {
|
restart: unless-stopped
|
||||||
@paths {
|
```
|
||||||
path /api/* /.well-known/* /dav/*
|
|
||||||
}
|
Under `proxy:`,
|
||||||
handle @paths {
|
|
||||||
reverse_proxy 127.0.0.1:3456
|
1. Since we'll be using Nginx Proxy Manager, it should by default uses the port `80` and thus you should change `ports:` to expose another port not occupied by any service.
|
||||||
}
|
|
||||||
|
example:
|
||||||
handle {
|
|
||||||
encode zstd gzip
|
```yaml
|
||||||
root * /var/www/html/vikunja
|
proxy:
|
||||||
try_files {path} index.html
|
image: nginx
|
||||||
file_server
|
ports:
|
||||||
}
|
- 1078:80 # change the number infront (host port) to whatever you desire, but make sure it's not 80 which will be used by Nginx Proxy Manager
|
||||||
}
|
volumes:
|
||||||
{{< /highlight >}}
|
- ./nginx.conf:/etc/nginx/conf.d/default.conf:ro
|
||||||
|
depends_on:
|
||||||
|
- api
|
||||||
|
- frontend
|
||||||
|
restart: unless-stopped
|
||||||
|
```
|
||||||
|
|
||||||
|
#### In your DNS provider
|
||||||
|
|
||||||
|
Add two `A` records that points to your server IP.
|
||||||
|
|
||||||
|
1. `vikunja` for accessing the frontend
|
||||||
|
|
||||||
|
2. `api` for accessing the api
|
||||||
|
|
||||||
|
You are of course free to change them to whatever domain/subdomain you desire and modify the `docker-compose.yml` accordingly but the two should be different.
|
||||||
|
|
||||||
|
(Tested on Cloudflare DNS. Settings are different for different DNS provider, in this case the end result should bei `vikunja.your-domain.com` and `api.your-domain.com` respectively.)
|
||||||
|
|
||||||
|
#### In Nginx Proxy Manager
|
||||||
|
|
||||||
|
Add two Proxy Host as you normally would, and you don't have to add anything extra in Advanced.
|
||||||
|
|
||||||
|
##### Frontend
|
||||||
|
|
||||||
|
Under `Details`:
|
||||||
|
|
||||||
|
```
|
||||||
|
Domain Names:
|
||||||
|
vikunja.your-domain.com
|
||||||
|
Scheme:
|
||||||
|
http
|
||||||
|
Forward Hostname/IP:
|
||||||
|
your-server-ip
|
||||||
|
Forward Port:
|
||||||
|
1078
|
||||||
|
Cached Assets:
|
||||||
|
Optional.
|
||||||
|
Block Common Exploits:
|
||||||
|
Toggled.
|
||||||
|
Websockets Support:
|
||||||
|
Toggled.
|
||||||
|
```
|
||||||
|
|
||||||
|
Under `SSL`:
|
||||||
|
|
||||||
|
```
|
||||||
|
SSL Certificate:
|
||||||
|
However you prefer.
|
||||||
|
Force SSL:
|
||||||
|
Toggled.
|
||||||
|
HTTP/2 Support:
|
||||||
|
Toggled.
|
||||||
|
HSTS Enabled:
|
||||||
|
Toggled.
|
||||||
|
HSTS Subdomains:
|
||||||
|
Toggled.
|
||||||
|
Use a DNS Challenge:
|
||||||
|
Not toggled.
|
||||||
|
Email Address for Let's Encrypt:
|
||||||
|
your-email@email.com
|
||||||
|
```
|
||||||
|
|
||||||
|
##### API
|
||||||
|
|
||||||
|
Under `Details`:
|
||||||
|
|
||||||
|
```
|
||||||
|
Domain Names:
|
||||||
|
api.your-domain.com
|
||||||
|
Scheme:
|
||||||
|
http
|
||||||
|
Forward Hostname/IP:
|
||||||
|
your-server-ip
|
||||||
|
Forward Port:
|
||||||
|
3456
|
||||||
|
Cached Assets:
|
||||||
|
Optional.
|
||||||
|
Block Common Exploits:
|
||||||
|
Toggled.
|
||||||
|
Websockets Support:
|
||||||
|
Toggled.
|
||||||
|
```
|
||||||
|
|
||||||
|
Under `SSL`:
|
||||||
|
|
||||||
|
```
|
||||||
|
SSL Certificate:
|
||||||
|
However you prefer.
|
||||||
|
Force SSL:
|
||||||
|
Toggled.
|
||||||
|
HTTP/2 Support:
|
||||||
|
Toggled.
|
||||||
|
HSTS Enabled:
|
||||||
|
Toggled.
|
||||||
|
HSTS Subdomains:
|
||||||
|
Toggled.
|
||||||
|
Use a DNS Challenge:
|
||||||
|
Not toggled.
|
||||||
|
Email Address for Let's Encrypt:
|
||||||
|
your-email@email.com
|
||||||
|
```
|
||||||
|
|
||||||
|
Your Vikunja service should now work and your HTTPS frontend should be able to reach the API after `docker-compose`.
|
||||||
|
|
||||||
|
### Method 2
|
||||||
|
|
||||||
|
1. Create a standard Proxy Host for the Vikunja Frontend within NPM and point it to the URL you plan to use. The next several steps will enable the Proxy Host to successfully navigate to the API (on port 3456).
|
||||||
|
2. Verify that the page will pull up in your browser. (Do not bother trying to log in. It won't work. Trust me.)
|
||||||
|
3. Now, we'll work with the NPM container, so you need to identify the container name for your NPM installation. e.g. NGINX-PM
|
||||||
|
4. From the command line, enter `sudo docker exec -it [NGINX-PM container name] /bin/bash` and navigate to the proxy hosts folder where the `.conf` files are stashed. Probably `/data/nginx/proxy_host`. (This folder is a persistent folder created in the NPM container and mounted by NPM.)
|
||||||
|
5. Locate the `.conf` file where the server_name inside the file matches your Vikunja Proxy Host. Once found, add the following code, unchanged, just above the existing location block in that file. (They are listed by number, not name.)
|
||||||
|
```nginx
|
||||||
|
location ~* ^/(api|dav|\.well-known)/ {
|
||||||
|
proxy_pass http://api:3456;
|
||||||
|
client_max_body_size 20M;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
6. After saving the edited file, return to NPM's UI browser window and refresh the page to verify your Proxy Host for Vikunja is still online.
|
||||||
|
7. Now, switch over to your Vikunja browser window and hit refresh. If you configured your URL correctly in original Vikunja container, you should be all set and the browser will correctly show Vikunja. If not, you'll need to adjust the address in the top of the login subscreen to match your proxy address.
|
||||||
|
|
||||||
|
## Apache
|
||||||
|
|
||||||
|
Put the following config in `cat /etc/apache2/sites-available/vikunja.conf`:
|
||||||
|
|
||||||
|
{{< highlight aconf >}}
|
||||||
|
<VirtualHost *:80>
|
||||||
|
ServerName localhost
|
||||||
|
|
||||||
|
<Proxy *>
|
||||||
|
Order Deny,Allow
|
||||||
|
Allow from all
|
||||||
|
</Proxy>
|
||||||
|
ProxyPass /api http://localhost:3456/api
|
||||||
|
ProxyPassReverse /api http://localhost:3456/api
|
||||||
|
ProxyPass /dav http://localhost:3456/dav
|
||||||
|
ProxyPassReverse /dav http://localhost:3456/dav
|
||||||
|
ProxyPass /.well-known http://localhost:3456/.well-known
|
||||||
|
ProxyPassReverse /.well-known http://localhost:3456/.well-known
|
||||||
|
|
||||||
|
DocumentRoot /var/www/html
|
||||||
|
RewriteEngine On
|
||||||
|
RewriteRule ^\/?(favicon\.ico|assets|audio|fonts|images|manifest\.webmanifest|robots\.txt|sw\.js|workbox-.*|api|dav|\.well-known) - [L]
|
||||||
|
RewriteRule ^(.*)$ /index.html [QSA,L]
|
||||||
|
</VirtualHost>
|
||||||
|
{{< /highlight >}}
|
||||||
|
|
||||||
|
**Note:** The apache modules `proxy`, `proxy_http` and `rewrite` must be enabled for this.
|
||||||
|
|
||||||
|
For more details see the [frontend apache configuration]({{< ref "install-frontend.md#apache">}}).
|
||||||
|
|
||||||
|
## Caddy
|
||||||
|
|
||||||
|
{{< highlight conf >}}
|
||||||
|
vikunja.domainname.tld {
|
||||||
|
@paths {
|
||||||
|
path /api/* /.well-known/* /dav/*
|
||||||
|
}
|
||||||
|
handle @paths {
|
||||||
|
reverse_proxy 127.0.0.1:3456
|
||||||
|
}
|
||||||
|
|
||||||
|
handle {
|
||||||
|
encode zstd gzip
|
||||||
|
root * /var/www/html/vikunja
|
||||||
|
try_files {path} index.html
|
||||||
|
file_server
|
||||||
|
}
|
||||||
|
}
|
||||||
|
{{< /highlight >}}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue