skip to Main Content

I am running a react app with a django backend. Users can log in to my app via django and are redirected to my react app. Now I want to show a grafana panel. I already set up a self-hosted grafana instance with a reverse proxy (for https). I can embedd the panel without a problem (iframe) when I use grafanas anonymous_authentication. But this is not an option for me. Also not an option for me is a login page on in app/iframe. I am reading alot that there is the option to manage the authentication via the reverse proxy. But since I am a nginx noob, I don’t really know how I can implement this.

Can someone guide me here? I think I have to somehow log in via the proxy to grafana

My nginx setup thus far:

server {
    server_name  myserver.co;

    location / {
        proxy_set_header Host $http_host;
        proxy_pass           http://localhost:3000/;
    }
    ##here is also some cert stuff
}
server {
    if ($host = myserver.co) {
        return 301 https://$host$request_uri;
    }

    listen 80;
    listen [::]:80;
    server_name  myserver.co;
    return 404; 
}

2

Answers


  1. Have you tried using auth_request from Nginx? It will allows you to make the validation before allowing/denying access to the Grafana.

    server {
        server_name myserver.co;
    
        location / {
            proxy_set_header Host $http_host;
            proxy_pass http://localhost:3000/;
        }
    
        location /grafana/ {
            auth_request /auth;
            proxy_set_header Host $http_host;
            proxy_pass http://localhost:3001/;
        }
    
        location = /auth {
            internal;
            proxy_pass http://localhost:8000/auth/;
            proxy_pass_request_body off;
            proxy_set_header Content-Length "";
            proxy_set_header X-Original-URI $request_uri;
        }
    
    }
    
    server {
        if ($host = myserver.co) {
            return 301 https://$host$request_uri;
        }
    
        listen 80;
        listen [::]:80;
        server_name myserver.co;
        return 404;
    }
    
    
    Login or Signup to reply.
    1. Install the htpasswd command-line tool to manage users and passwords for basic authentication:

      sudo apt-get install apache2-utils
      
    2. Create a password file for authorized users:

      sudo htpasswd -c /etc/nginx/.htpasswd myuser
      

      This will create a new password file at /etc/nginx/.htpasswd with a user named "myuser" and a hashed password.

    3. Modify the Nginx configuration to add basic authentication for Grafana:

      server {
          server_name myserver.co;
      
          location /grafana/ {
              auth_basic "Restricted Access";
              auth_basic_user_file /etc/nginx/.htpasswd;
      
              proxy_set_header Host $http_host;
              proxy_pass http://localhost:3000/grafana/;
          }
      
          # Add other location blocks for your app as needed
      
          # SSL configuration
          listen 443 ssl;
          ssl_certificate /path/to/ssl/certificate;
          ssl_certificate_key /path/to/ssl/private/key;
          include /path/to/ssl/options.conf;
      }
      
      server {
          if ($host = myserver.co) {
              return 301 https://$host$request_uri;
          }
      
          listen 80;
          listen [::]:80;
          server_name myserver.co;
          return 404;
      }
      

      This configuration restricts access to the /grafana/ path using basic authentication. The auth_basic directive sets the message that will be displayed to users when they are prompted for credentials, and the auth_basic_user_file directive specifies the path to the password file.

    4. Restart Nginx to apply the changes:

      sudo systemctl restart nginx
      

    With these steps, Nginx will prompt users for credentials when they try to access Grafana, and only users with valid credentials will be able to access the dashboard.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search