I'm currently facing an issue where the LinkedIn iframe is not displaying content on iOS devices. I attempted a workaround by changing the URL protocol from 'https://' to 'outsystems://,' which resolved the issue but caused a loss of CSS styling, making it an unsatisfactory solution.
I also tried configuring the Content Security Policy (CSP) in LifeTime, but unfortunately, I wasn't successful. It's possible that my configuration is incorrect. Could someone provide assistance and guidance on how to properly configure CSP in LifeTime to address this LinkedIn iframe display problem on iOS? Additionally, if someone have any alternative solutions, I would be grateful to hear them.
Below, I provide an image of the CSP settings I configured.
Hi,
The issue is that. LinkedIn blocks Iframes. They send the header X-Frame-Options : SameOrigin
This is because of security with an Iframe. Because you have the possibility to send commands to an Iframe Hackers would love this, so for that reason a lot of sites block Iframes
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
However, how does it work for Android and on the web then? Even when using Safari, it functioned with PWA distribution, so I don't believe the issue is solely from LinkedIn. Perhaps it's more related to the mobile application backend services (MABS). Are there any specific considerations or configurations that should be addressed to handle this on iOS devices?
It's weird that this works,
Is it possilbe for you to share an OML whith your situation because I can't replicated this from my end, I always get the error: "Refused to frame 'https://www.linkedin.com/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self' *.www.linkedin.com:* *.prod.linkedin.com"." And this is because linkedIn only allows it's own domain to use it as an Iframe.
The Frame-anectors is used to allow your app to be embedded in other iframes. https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors
Yes, here is the OML file containing the LinkedIn iframe. This setup works on Android devices but at iOS dont. You can find the example on the login screen.
Access the screen using the following link: Link to the Login Screen