Integrate Internet Identity within iFrame

I’m trying to put Internet Identity within an iframe to integrate it more seemless within our application. I’m facing issues on safari and getting the error:

Refused to display ' https://identity.ic0.app/#authorize ' in a frame because it set 'X-Frame-Options' to 'DENY'.

It works on chrome. From my perspective and understanding this should be possible. But from a security point of view I’m not sure if the protection is justified.

Is there something I’ve overseen? Any help or hints very much appreciated.

1 Like

The spec at internet-identity/internet-identity-spec.adoc at main · dfinity/internet-identity · GitHub explicitly says

It loads the url https://identity.ic0.app/#authorize in an <iframe> or separate tab.

So this was certainly intended at some point. I am not sure who is setting the X-Frame-Option here. I think it should be fine to allow that, however. @bjoern, WDYT?

1 Like

The X-Frame-Options header is present on the query calls:

Hmm, that’s the header on the query as done by the service worker. I would expect that this does not apply to the resource as loaded via the service worker. But I am just optimistically guessing.

I assume this header is set by the boundary nodes (if only we had the source…), and not by the canister itself or the service worker. Maybe a Web technology expert can advise us about the interplay of that header and service workers.

Ah, when you open an URL like https://identity.ic0.app/ without the service worker installed, the boundary node’s response (the one that installs the service worker) sets x-frame-options: DENY.

So yes, the boundary node need to change to allow the Internet Identity (or any other canister-hosted frontend!) to be embedded as an iframe.

2 Likes

Restricting use on iframes sometimes makes sense from a security perspective (cf. clickjacking). That said, I do not sufficiently understand the interplay of service workers and X-Frame-Options, that does not seem to be specified in general and may be the reason for the different observations in Safari and Chrome.

@nomeata Thanks for the information, it was very helpful to me!

But same case here
I am trying to use iframe to display one asset-canister inside another and deny header breaks my case. This is a rather critical moment for me(
Are there any ways to change the header x-frame-options: DENY to SAMEORIGIN in custom cases?
Maybe the dfinity team has any plans to improve this?
I tried to change the headers in certified_assets canister (lol) and install code to my canisters, but it didn’t help me (lol_twice).
@kpeacock please help :slight_smile:

Hi 3cL1p5e7,

We realize that it is inconvenient that currently iFrames do not work on the Internet Computer. But adding proper support for iFrames (without introducing any security risks) is a bit of work. It is definitely on our roadmap, but I cannot give promises regarding release dates.

For the time being, we have removed iFrames from the Internet Identity specification to avoid developer confusion.
I hope this helps.

Best regards,
Frederik

2 Likes

Thank you for you reply, Frederik!