Iframe not Load Properly with NGINX & Kibana

Hi Masters,

Kindly need your expertise on Kibana & NGINX config.
So my Kibana Application and Angularjs is running in the same server and I have enable the connection from internet.

So when i hit mydomain.com, browser will display my Angular apps.
Inside my Angular Apps, I have an Iframe which is the url of my Kibana Dashboard.

Everything accessible if I access from a direct URL.

  1. https://mydomain.com -> it will go to my Angularjs
  2. https://mydomain.com/kibana -> it will go to my Kibana

It is not working if I tried to get the embeded code from Kibana and put it into my Angular Iframe. Do you happen to know why?

My current NGINX config as below:

Server {
  listen 80;
  server_name mydomain.com;

  location / {
     root /usr/share/nginx/html;
     try_files $uri $uri/ /index.html;
  }

  location ~ ^/kibana/(.*)$ {
     rewrite /kibana/(.*) /$1 break;
     proxy_pass http://DOMAIN_IP: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;
  }
}

Current Kibana Config as below:

#Server Setup
server.port: 5601
server.host: 0.0.0.0
server.basePath: "/kibana"
path.data: "/app/kibana/data"

My Iframe Code as below:

<iframe src="http://mydomain.com/kibana/s/realtime/app/kibana#/dashboard/fnjd7230-en1c-10l9-bmk4-2d8ks6be2e99?embed=true&_g=()" height="600" width="800"></iframe>

Use the same url above, copy the url and open in the new tab, able to work but not in Iframe.

Do you see any errors in the browser console?

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.