I have iframe content loading external source. my code is like this
<iframe title="xyz" allowtransparency = "true" marginheight="0"
marginwidth ="0" class="investisIframe"
src="https://irs.tools.investis.com/Clients/uk/bt/SharePriceLookup/Default.html?culture=en-GB"
frameborder="0" id="001" width="100%" height="500">
</iframe>
Above code works fine in android and windows devices. But not working in ios devices. Please help me to resolve this issue
- I have tried clearing the cache still the same issue.
- By adding timestamp at the end of url then also same issue.
Pradeep Mestha is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
3
The issue with iFrames not loading content on iOS devices (especially in Safari) is a common problem. This typically stems from Safari’s restrictions related to third-party cookies and security policies like cross-origin resource sharing (CORS).
Add sandbox Attribute to the iFrame
Safari requires certain permissions to allow content from different origins to load. Adding the sandbox attribute with specific values might help resolve the issue.
<iframe title="xyz" allowtransparency="true" marginheight="0" marginwidth="0" class="investisIframe"
src="https://irs.tools.investis.com/Clients/uk/bt/SharePriceLookup/Default.html?culture=en-GB" frameborder="0" id="001" width="100%" height="500"
sandbox="allow-scripts allow-same-origin allow-popups">
</iframe>
The sandbox attribute controls what the iframe is allowed to do. Allow-scripts, allow-same-origin, and allow-popup permissions are usually necessary for content loading.
CORS Headers
Ensure the external source (https://irs.tools.investis.com/) is properly configured to allow cross-origin access. It should send the correct CORS headers like:
Access-Control-Allow-Origin: *
4