I have a requirement to set the X-Frame options on the server level to either:
- X-Frame-Options: SAMEORIGIN
- X-Frame-Options: ALLOW-FROM https://example.com/
Understand that X-Frame Options are mutually exclusive. See here.
However, my application requires framing in https://example.com and also from its SAMEORIGIN.
Please advise if there is a way around this while retainining my application's requirement to having allow framing on the same origin and be framed on 1 external site.
Or is this impossible?
In addition to only supporting one instance of the header, X-Frame-Options does not support any more than just one site, SAMEORIGIN or not.
You'll have to use Content-Security-Policy and frame-ancestors, which does support multiple origins, like so:
Content-Security-Policy: frame-ancestors 'self' https://example.com
A couple notes to bear in mind:
frame-ancestors obsoletes X-Frame-Options - meaning that if frame-ancestors is present and the browser supports it, it will override the behaviour of X-Frame-Options.frame-ancestors directive, according to MDN. This means they will fall back to X-Frame-Options. If you need to support multiple origins in IE, see this answer on SO with a workaround.