I've been trying to run a reverse proxy to manage a graph of Grafana in an iframe. I'm using Apache on port 80 with the html page, Grafana server on port 3000 and Nginx with the reverse proxy on 8081.
The problem is that the proxy gives me a 404 error when I try to access the contents of the iframe. To test everything, I tried a local Grafana server configuration and a remote server configuration with 2 different iframes. The one connected to the local Grafana gives me a generic error of Grafana and a 404 when uploading the file, the remote one only 404.
Obviously each link taken individually works if I insert it on the browser, and without using the proxy it works the same way on the iframe.
I am not an Nginx expert and there will probably be some errors in the configuration. As a configuration file I'm using the Nginx default.conf file, so I haven't touched the nginx.conf because I don't think I need it for this purpose.
index.html
<h4>grafana local</h4>
<iframe src="http://localhost:8081/grafana/d-solo/KXusIR0Mk/test?orgId=1&from=1606211757397&to=1606233357397&panelId=2" width="450" height="200" frameborder="0"></iframe>
<h4>grafana remote</h4>
<iframe src="http://localhost:8081/salvo/d-solo/s-kg75yZz/stazione-meteo?orgId=1&panelId=8&from=1606215708391&to=1606237308391" width="450" height="200" frameborder="0"></iframe>
default.conf
server {
listen 8081;
listen [::]:8081;
server_name 127.0.0.1;
location /grafana/ {
#rewrite (grafana\/).* d-solo/KXusIR0Mk/test?orgId=1&from=1606211757397&to=1606233357397&panelId=2 break;
proxy_pass http://localhost:3000/;
}
location /salvo/ {
#rewrite (salvo\/).* d-solo/s-kg75yZz/stazione-meteo?orgId=1&panelId=8&from=1606215708391&to=1606237308391 break;
proxy_pass http://<ip_remoteGrafana>:<port>/;
}
}
PS: the ip and the port of the remote Grafana are not mine so I removed them, but in the code they are there ;)
access.log
::1 - - [26/Nov/2020:14:17:41 +0100] "GET /salvo/d-solo/s-kg75yZz/stazione-meteo?orgId=1&panelId=8&from=1606215708391&to=1606237308391 HTTP/1.1" 302 29 "http://localhost/grafana/" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.66 Safari/537.36"
::1 - - [26/Nov/2020:14:17:41 +0100] "GET /login HTTP/1.1" 404 197 "http://localhost/grafana/" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.66 Safari/537.36"
error.log
2020/11/26 14:17:41 [error] 101110#101110: *1 open() "/usr/share/nginx/html/login" failed (2: No such file or directory), client: ::1, server: 127.0.0.1, request: "GET /login HTTP/1.1", host: "localhost:8081", referrer: "http://localhost/grafana/"
What is this due to?
Apparently proxied Grafana needs authentication (redirect to /login), which is not compatible with your context path (it must be /salvo/login in your case). You will need redirect/content rewrite, which fill update all path to your used context /salvo/. That's complicated and not very reliable.
But you may somehow do that, but then you may discover that target Grafana doesn't allow to be embedded in the iframe or that Grafana cookies config (e.g. samesite, secure) may be also problem for your http app or Grafana auth is a problem. I would work with simple / context first to discover issues early and later also with more complicated context paths e.g. /salvo/.