Iframe issue (panel_iframe, Webpage Card)

Hello.
I tried to use different frames and also custom frame https://github.com/covrig/homeassistant-iframe-card.
In all cases I see nothing at window.
In case with “panel_iframe” , I see " 192.168.1.1 refused to connect." in the window.
192.168.1.1 is address of my router and it opens well in chrome.

When I change url to ‘http://192.168.1.221:8123/’ (HA address)


It opens HA under router label and inside it router field is empty.
Looks like something miss or something blocks to present external links in all kinds of frames.
I will glad to get advance to fix it.

Is your home assistant accessed via secure http (https)?
If so you can not show http iframes. See the big puke yellow warning at the top of the document:

The opposite is also true. You can not access https sites if you use http to access home assistant.

http://192.168.1.221:8123
It is only http.

What’s only http?

Your home assistant server by the looks of that port.

What about the iframe?

What do you mean ?
My HA is not works via https (I’m quite sure) and I tried to use addresses http.
If I look at “inspect mode” in chrome in “console” I get the next messege:
Refused to display ‘http://192.168.1.1/’ in a frame because it set ‘X-Frame-Options’ to ‘sameorigin’.

Hi, did you manage to solve this problem?

I also have an identical problem on the router of my operator, although the address is in the form of http://192.168.1.254 and after entering the correct login details, I have the following message:
Page has expired:
The page you are trying to access has expired.
I do not have such a message in the browser, even when I am in incognito mode

1 Like

There is a good reason to not load the iframe. (Security) the page that you try and load into the iframe deny’s the request to load the page. it’s a measure to prevent loading a webpage in a < frame >, < iframe >, < embed > or < object >

There is a way around this but it’s not recommended. and i do not know if a browser can still deny to request anyhow.

When a page loads it set’s whether if can be loaded in an iframe or not. There are 3 options and 1 is depreciated.

X-Frame-Options: DENY
X-Frame-Options: SAMEORIGIN
X-Frame-Options: ALLOW-FROM (URL)

You will have to check the source page (the page you are loading) it has been set to not allow loading in a iframe

DENY
The page cannot be displayed in a frame, regardless of the site attempting to do so. even on it’s own webserver.

SAMEORIGIN
The page can only be displayed in a frame on the same origin as the page itself. The spec leaves it up to browser vendors to decide whether this option applies to the top level, the parent, or the whole chain, although it is argued that the option is not very useful unless all ancestors are also in the same origin

ALLOW-FROM uri
This is an obsolete directive that no longer works in modern browsers. Don’t use it. In supporting legacy browsers, a page can be displayed in a frame only on the specified origin uri.

The X-Frame-Options HTTP response header can be used to indicate whether or not a browser should be allowed to render a page in a frame. Sites can use this to avoid click-jacking attacks, by ensuring that their content is not embedded into other sites.

2 Likes

Hi @tom_l long time ago topic.

May I ask for some advice since this is the only matching topic I could find.

I have home assistant served via an external reverse proxy over https and this runs smoothly. I can open all addon pages in the side panel. offcourse I cannot open the other “http” panels as decribed in your link. Same counts for using nabu casa.

What is the proper way to do serve them remotely? Thus via the nabu casa link?

I cannot find in the documentation on how to achieve this? Just by simply put an https link in the panel iframe? will my companion app know that it needs to follow the nabu casa link and not directly try to open the iframe pane link?

If I ask the other way around: Opening links to addons work well, how can I open another link the same way homeassistant tunnels/presents access to such an addon but then to something from myself? without publiching that thing directly to internet (over https)?

Thanks!

1 Like