I am trying to load the host1 page, it contains iframe and the URL for the iframe is host2. But iframe with URL host2 is not loading properly.
I am loading host1 page through SFSafariViewController. If I load the same thing with the iPhone safari browser then it is working fine but not working with SFSafariViewController. As per my understanding, WKWebview has some limitations but SFSafariViewController doesn't have but still facing the issue.
I have tried the below options also in iOS14.5.1 but still, it is not working:
Enabled Allow Cross-Website Tracking by using NSCrossWebsiteTrackingUsageDescription in info.plist
Enabled Allow Tracking by using Privacy - Tracking Usage Description in info.plist
used WKAppBoundDomains also.
am I missing anything, please help me out?
Adding few more details:
When I am inspecting the code got the below errors with the mobile app SFSafariViewCotroller and the required content is not loading, but it is working fine with mobile, desktop Safari browsers and not showing any errors.
Refused to load {URL://_csrfRefresh=1} because it does not appear in the frame-ancestors directive of the Content Security Policy.
Sandbox access violation: Blocked a frame at {URL} from accessing a cross-origin frame. Ther being accessed is sandboxed and lacks the "allow-same-origin" flag
Attaching a screenshot below for reference,
Related
I create a App with Ionic which embed the twitch player for streams and clips.
var url = https://player.twitch.tv/?video=v${videoId}&time=${time}&parent=localhost
<iframe [src]='url' frameborder='0' allow='autoplay; encrypted-media' allowfullscreen></iframe>
On Android its working perfect but in the iOS App the iframe will not be shown and no player is available. Just a white screen.
Does anybody know what the problem can be related to ios?
I have the same issue. Security limitations are the culprit indeed: I opened the Safari console while the iframe was trying to load and saw this error:
Refused to load https://player.twitch.tv/?channel=...&controls=false&parent=localhost&muted=true because it does not appear in the frame-ancestors directive of the Content Security Policy.
Looking at this security header that Twitch returns, it looks like this:
Content-Security-Policy: frame-ancestors http://localhost:* https://localhost:*
However, when using the Ionic WebView, according to its documentation:
iosScheme
<preference name="iosScheme" value="httpsionic" />
Default value is ionic
Configures the Scheme the app uses to load the content.
Values like http, https or file are not valid and will use default value instead.
So your WKWebView will have ionic://locahost as its application URL by default, which doesn't match the http://localhost and https://localhost prefixes specified by Twitch.
I tried using &parent=ionic://localhost in the Twitch iframe URL. The WKWebView doesn't refuse to open the iframe, but Twitch itself freaks out about the special characters in that parameter and refuses to render its player page.
To me it seems that currently, iOS Ionic/Cordova Apps and Twitch iframes are mutually exclusive.
Edit:
I found a bunch of discussions in the Twitch forum talking about this subject (1, 2), but none of them went technically in-depth to the point where a working solution or workaround could be found. Unfortunately, threads are closed after 1 month of inactivity, so I had to open yet another thread in the Twitch forum explaining the technical details from my point of view. I also added a feature request in their user-voice feedback portal. I'm afraid trying to make Twitch realise / accept that they should do something about mobile embeds is all we can do at this point. Here's the link to it:
https://twitch.uservoice.com/forums/310213-developers/suggestions/44682766-make-embeds-work-on-ios-web-based-apps-like-ionic
I'm building a mobile app using WKWebView. I register custom url schemes image:// and thumb:// to serve assets from the native part to the web part of the app.
webViewConfiguration.setURLSchemeHandler(handler, forURLScheme: "image")
webViewConfiguration.setURLSchemeHandler(handler, forURLScheme: "thumb")
This approach works well if urls with a custom scheme are used in HTML. For example, <img src="thumb://watermarkly.com/1.jpg" /> works properly - WKWebView invokes my handler and displays the result. However, WKWebView blocks requests if I try to fetch these urls using XMLHttpRequest:
[Warning] The page at https://watermarkly.com/app/watermark/ was allowed to display insecure content from thumb://watermarkly.com/1.jpg.
[Warning] [blocked] The page at https://watermarkly.com/app/watermark/ was not allowed to display insecure content from image://watermarkly.com/1.jpg.
[Error] Not allowed to request resource
[Error] XMLHttpRequest cannot load image://watermarkly.com/1.jpg due to access control checks.
The only difference here is that "thumb:" url was assigned to an img tag, while "image:" url were fetched via XMLHttpRequest. Unfortunately, no other info provided in Safari Developer Tools.
The problem appears on a real devices only - everything works properly in iOS Simulator.
Is there something I need to configure to make it work for XMLHttpRequests as well?
Update
We switched from HTTPS to HTTP to make XHR to solve the problem.
Unfortunately, custom url schemes seems not to work on some iPhones. We have 5 customers with iPhones where nor switching to HTTP, nor sending Access-Control-Allow-Origin header help. We weren't able to identify which setting causes the issue - the problem cannot be reproduced on any of devices we have. Apple reviewer didn't have any complaints as well. Nor XHR, not getting images through urls work on these phones. One of the customers has two phones. Custom url schemes work on one of them and they don't work on the second one at all. He says they are identical and there is no Safari extensions installed. Unfortunately, we weren't able to identify what causes the problem. Beware custom url schemes may not work on some phones.
I have an embedded twitter video in a webview in a mobile app (Titanium, but this doesn't really matter). When I click play on the video I see this error:
Refused to display '[the url]' in a frame because an ancestor violates
the following Content Security Policy directive: "frame-ancestors *".
What is causing this issue is the fact that the webview content is being populated via a Hogan template that is loaded in from a local file path. I get the same error if I just copy the embed code into a file on my desktop and open the file in Chrome. It works fine in a webview in iOS and the local file works okay in Firefox, so this seems to be Chrome related.
Why is this failing with a wildcard for frame-ancestors?
Is there a way around this in my current setup?
I'm using an iPhone App that has some important information on it, but I also figured out that it uses a webview. And I'm not sure if it's safe; like; is it over https? What URL is being called?
Is there a way you can find out what Website is being called in the webview? Like you can do inspect element when using Safari from OSX with usb-connected iPhone.
UIWebview works for any url you call it with. If your site is https, the communication will be encrypted. Not all requests on UIWebView are not https. You can't inspect element from iPhone/iPad/Simulator. You can do it in web in the mobile view (by using useragent).
I am developing an app using Appcelerators Titanium. The app consists of a webview. The webview shows i local page, iframe.html, and this iframe's src is pointed to a remote page.
However, this doesn't work out as i expected since it doesn't seem like the remote page can't store cookies when wrapped in an iframe. It works great on desktop and other devices. This seems to be an issue exclusive to iOS. I need the iframe, and i need cookies. What can i do to solve this?