Detect Differences between Safari Webview and Safari on iOS using Javascript - javascript

What are the differences in terms of features or apis of Safari webview and regular safari on iOS? Is there a way to detect if a website is open in Safari webview like say from Twitter?
Currently I have pwa enabled in my app, but for iOS, the user has to add the app to their homescreen using the share button. Now, when the link is opened from twitter app, twitter renders the website in Safari webview. I'm trying to detect if website is opened in safari webview so I can show a message to user on how to add the app to their homescreen due to the safari webview limitations where Add to home is not available in the share sheet.

Related

Open links in main Safari browser instead of WebView - PWA (iOS)

I send an email with a link of my PWA website.
When I click on the link and say open with Safari it opens in the Safari webview.
The Safari webview however does not have an add to homescreen option like the native Safari browser does.
When I open the link with my native safari browser I get the ability to add to homescreen.
What can I do to open the link directly in the native Safari browser instead of the webview.
Alternatively is there a way to find out that I am in the webview instead of the native Safari browser to prompt the user accordingly?
Currently testing on iOS 14.2
You are using the Gmail App to open the link so it is prompting you which browser that you want to open the link with.
To open the link directly into the Safari browser instead of the webview (assuming you have it set as your default browser under Settings), click on the "Default browser app" option below the Safari option.
It is currently not possible to detect and prompt the user accordingly, however you could play around with window.navigator.standalone to detect if the user is in the PWA or not.

How to open a link in Safari rather than the in app browser

I'm struggling with solution to open instagram stories swipe up links opens into safari browser. I know that is possible because some stories contain links into safari instead of Instagram app Webview.
There is example: https://www.instagram.com/stories/highlights/17893042882461992/
Try to open link with Instagram app.
Solution to open links in browser for Android devices is:
https://medium.com/#sasan.salem/opening-of-your-website-in-the-viewers-external-browser-automatically-instead-of-instagram-s-8aca5ee7e22f

How to force a link to open in safari instead of webview?

IOS webviews do not support WebRTC - only Safari on IOS does.
How can I force a page/link to open in real Safari, instead of a webview?
For example, the Gmail app opens all links inside a webview. Instead, I want them to open in Safari.

Linking to iOS Safari's Share Menu

I'm helping to build a webpage that is mobile friendly. We are currently in beta and using the "Add to Homescreen" function of Safari on iOS to make the webpage appear as an app. Is there a way through javascript or html to code a link to Safari's share menu? We want to be able to access this share menu from the bookmark shortcut rather than having to be in the actual Safari browser on the phone.
This is an old question, but as of iOS Safari 12.2 and macOS Safari 12.1, Safari supports Navigator.share() to display the system share menu.
The Share menu in Safari is a component of the browser, not the web page. It cannot be linked to.
If you want your users to activate the "Add to Homescreen" function of Safari, you will need to instruct them to press the Share button themselves.

adding bookmark to mobile browser using javascript

There exist javascript APIs for adding bookmarks to browser using javascript, but it works only on Desktop
Firefox
window.sidebar.addPanel(location.href,document.title,"");
IE
window.external.AddFavorite(location.href,document.title);
http://www.hostingfanatic.com/webdev/add-to-bookmarks-javascript/
The above site hosts the code for it, the functionality works in Desktop FireFox and InternetExplorer but not in Desktop chrome or Safari.
The add bookmark also doesnt work on android default browser or android FireFox browser.
It also doesnt work on IOS Safari, on IPad 1 and IPad 2
Is there any javascript API that allows the add bookmark functionality programmatically via javascript in mobile browsers?
If not, is there any other way to achieve this programmatically in mobile browsers?
Also will Phonegap or rooting the android phone, help in any way to achieve this?
I am open to all views.

Categories