'Unable to access Kibana behind NginX reverse proxy on Docker

I have a Docker Compose setup with NginX, ElasticSearch and Kibana like the following:

web:
    build:
      context: .
      dockerfile: ./system/docker/development/web.Dockerfile
    depends_on:
      - app
    volumes:
      - './system/ssl:/etc/ssl/certs'
    networks:
      - mynet
    ports:
      - 80:80
      - 443:443

  elasticsearch_1:
    image: docker.elastic.co/elasticsearch/elasticsearch:7.7.0
    container_name: "${COMPOSE_PROJECT_NAME:-service}_elasticsearch_1"
    environment:
      - node.name=elasticsearch_1
      - cluster.name=es-docker-cluster
      - discovery.seed_hosts=elasticsearch_2,elasticsearch_3
      - cluster.initial_master_nodes=elasticsearch_1,elasticsearch_2,elasticsearch_3
      - bootstrap.memory_lock=true
      - "ES_JAVA_OPTS=-Xms512m -Xmx512m"
    ulimits:
      memlock:
        soft: -1
        hard: -1
    volumes:
      - es_volume_1:/usr/share/elasticsearch/data
    ports:
      - 9200:9200
    networks:
      - mynet

  elasticsearch_2:
    image: docker.elastic.co/elasticsearch/elasticsearch:7.7.0
    container_name: "${COMPOSE_PROJECT_NAME:-service}_elasticsearch_2"
    environment:
      - node.name=elasticsearch_2
      - cluster.name=es-docker-cluster
      - discovery.seed_hosts=elasticsearch_1,elasticsearch_3
      - cluster.initial_master_nodes=elasticsearch_1,elasticsearch_2,elasticsearch_3
      - bootstrap.memory_lock=true
      - "ES_JAVA_OPTS=-Xms512m -Xmx512m"
    ulimits:
      memlock:
        soft: -1
        hard: -1
    volumes:
      - es_volume_2:/usr/share/elasticsearch/data
    ports:
      - 9201:9201
    networks:
      - mynet

  elasticsearch_3:
    image: docker.elastic.co/elasticsearch/elasticsearch:7.7.0
    container_name: "${COMPOSE_PROJECT_NAME:-service}_elasticsearch_3"
    environment:
      - node.name=elasticsearch_3
      - cluster.name=es-docker-cluster
      - discovery.seed_hosts=elasticsearch_1,elasticsearch_2
      - cluster.initial_master_nodes=elasticsearch_1,elasticsearch_2,elasticsearch_3
      - bootstrap.memory_lock=true
      - "ES_JAVA_OPTS=-Xms512m -Xmx512m"
    ulimits:
      memlock:
        soft: -1
        hard: -1
    volumes:
      - es_volume_3:/usr/share/elasticsearch/data
    ports:
      - 9202:9202
    networks:
      - mynet

  kibana:
    image: docker.elastic.co/kibana/kibana:7.7.0
    container_name: "${COMPOSE_PROJECT_NAME:-service}_kibana"
    ports:
      - 5601:5601
    environment:
      ELASTICSEARCH_URL: http://elasticsearch_1:9200
      ELASTICSEARCH_HOSTS: http://elasticsearch_1:9200
    networks:
      - mynet
      
volumes:
  es_volume_1: null
  es_volume_2: null
  es_volume_3: null

networks:
  mynet:
    driver: bridge
    ipam:
      config:
      - subnet: 172.18.0.0/24
        gateway: 172.18.0.1

And here's my NginX configuration:

server {
   listen 80;
   listen 443 ssl http2;

   ssl_certificate /ssl/localhost.crt;
   ssl_certificate_key /ssl/localhost.key;

  ...

  location /app/kibana {
     proxy_pass http://kibana:5601;
     proxy_http_version 1.1;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection 'upgrade';
     proxy_set_header Host $host;
     proxy_cache_bypass $http_upgrade;
     proxy_set_header X-Real-IP $remote_addr;
     proxy_set_header Connection "Keep-Alive";
     proxy_set_header Proxy-Connection "Keep-Alive";
     proxy_set_header Authorization "";
  }

   location ~ /\. {    
      deny all;  
   }
   
   ...
}

When I try to access Kibana using http://localhost/app/kibana I see a blank page and I'm able to see errors in browser console:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'unsafe-eval' 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-P5polb1UreUSOe5V/Pv7tc+yeZuJXiOi/3fqhGsU7BE='), or a nonce ('nonce-...') is required to enable inline execution.

kibana:348 GET https://localhost/bundles/app/kibana/bootstrap.js net::ERR_ABORTED 404

manifest.json:1 GET https://localhost/ui/favicons/manifest.json 404

If I add the following location to my NginX config, the UI starts to display, but the page remain unresponsive:

  location ~ (/app|/translations|/node_modules|/built_assets/|/bundles|/es_admin|/plugins|/api|/ui|/elasticsearch|/spaces/enter) {
         proxy_pass          http://kibana:5601;
         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-Proto $scheme;
         proxy_set_header    X-Forwarded-Host $http_host;
         proxy_set_header    Authorization "";
         proxy_hide_header   Authorization;
  }

and there are other errors in browser console:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'unsafe-eval' 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-P5polb1UreUSOe5V/Pv7tc+yeZuJXiOi/3fqhGsU7BE='), or a nonce ('nonce-...') is required to enable inline execution.

commons.bundle.js:3 GET https://localhost/internal/security/session 404

Detected an unhandled Promise rejection.
Error

Solution 1:^[1]

This NginX config is working for me for Kibana (though it has created problems for my other app) :

location /app/kibana/ {
  proxy_pass http://kibana:5601;
}

location ~ (/app|/api|/internal|/translations|/bundles|/ui|/built_assets/|/elasticsearch|/spaces/enter) {
      proxy_pass          http://kibana:5601;
      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-Proto $scheme;
      proxy_set_header    X-Forwarded-Host $http_host;
      proxy_set_header    Authorization "";
      proxy_hide_header   Authorization;
  }

I figured out that internal needs to be handled as well in the second location. Thanks @mikezter for helping clear the clutter in the first one.

Solution 2:^[2]

Prefer to use simple container names for now. Instead container_name: "${COMPOSE_PROJECT_NAME:-service}_kibana" use container_name: "kibana". You can change these later, but remember to also update all references of that name (e.g. Kibana upstream host in Nginx config or the ELASTICSEARCH_HOSTS config for Kibana).

The only container that needs to open ports on your actual machine is the web-container with Nginx. Remove all other ports: xxxx:yyyy mappings.

For your Nginx config, you just need one simple location directive:

location / {
     proxy_pass http://kibana:5601;
}

When mounting Kibana on a different location, you will have to configure Kibana's server.basePath as described here.

location /kibana/ {
     proxy_pass http://kibana:5601;
}

  kibana:
    container_name: kibana
    image: docker.elastic.co/kibana/kibana:7.7.0
    environment:
      SERVER_BASEPATH: /kibana
      SERVER_REWRITEBASEPATH: 'false'
      ELASTICSEARCH_HOSTS: http://elasticsearch_1:9200
    networks:
      - mynet

Solution 3:^[3]

For version 7.16.0 I needed to configure SERVER_BASEPATH and SERVERPUBLICBASEURL

  kib01:
    image: docker.elastic.co/kibana/kibana:7.16.0
    ports:
      - 9201:5601
    environment:
      ELASTICSEARCH_URL: http://es01:9200
      ELASTICSEARCH_HOSTS: '["http://es01:9200"]' #,"http://es02:9200"]' #,"http://es03:9200"]'
      ELASTICSEARCH_USERNAME: elastic
      ELASTICSEARCH_PASSWORD: $ELASTIC_PASSWORD
      SERVER_BASEPATH: /app/kibana
      SERVER_PUBLICBASEURL: http://dmc.development.com:9201/app/kibana
      SERVER_REWRITEBASEPATH: 'true'

#Just this configuration for nginx
location /app/kibana/ {
  proxy_pass http://kibana:5601;
}

IMPORTANT!: It Just works in Firefox (idk why)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Uzair Ishaq
Solution 2
Solution 3	Juan Pablo

'Unable to access Kibana behind NginX reverse proxy on Docker

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]