Share page from Safari iphone to facebook native app - javascript

I'd like to add to my website a piece of javascript code that will share the current page to the facebook's user profile.
https://www.facebook.com/sharer/sharer.php?u={URL}
It works well in the desktop version. In the mobile version it open a new Safari tab/window.
Is there a way to open the facebook native app with the share page?

If I'm reading this correctly, your question is very similar to another on the website. To quote an answer there:
The Facebook app does not officially support deep linking so what you are trying to do is not possible (right now).

Related

Does Progressive Web-Apps really works on iOS?

I am really confused by PWA on my iPhone.
First, before showing my code, I was trying to check how a good web-app look.
Searching in Google for best progressive web-apps i open all of them on my iPhone in Safari, and clicked the Share button and then Add To Home Screen. (Uber, Flipboard, Twitter, Google Maps, Ali-express, etc)
When opening the icons from home-screen, it will open Safari again with that same page i was at, just like any website.
No full screen
No separate window (just opens in Safari like a website)
No splash screen
On Chrome- no "Add to home-screen" button
Basically just a website with an icon.
Then i was trying to do so on my website using Google's pwacompat library on my page.
I have added those into the page head :
<link rel="manifest" href="manifest.webmanifest" />
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="../images/logo.png">
then the JS library at the bottom of my html :
<!-- webapp manifast library -->
<script async src="https://cdn.jsdelivr.net/npm/pwacompat#2.0.6/pwacompat.min.js" integrity="sha384-GOaSLecPIMCJksN83HLuYf9FToOiQ2Df0+0ntv7ey8zjUHESXhthwvq9hXAZTifA" crossorigin="anonymous">
</script>
Same again, i am adding this page to home screen, and nothing.
No full screen, no different window, just Safari.
Do i misunderstand a fundamental thing about PWA ?
iOS started very late to open to PWAs and it still needs extra attributes (as you used) to provide the full set of PWA features.
In Chrome DevTools if you go to Application tab (for your application), can you see that the web manifest with its properties is correctly displayed and the service worker as well?
As Mathias said, you need an HTTPS connection to be able to register correctly a service worker. Localhost however is considered "safe" for developing purposes.
I wrote a series of articles about PWA, you can have a look and follow along to see if you missed anything.
Here a list of browsers supporting service workers (to compare with the safari version you are using).
UPDATE
I answer here to your comments:
If some web sites that offers PWAs (eg. Uber, FB) work as PWA on other devices, but not on your phone, then I would try to investigate whether there is a setting missing on your side. I made a quick research and it seems that for iOS users some extra steps are needed to use/enable PWAs:
The user has to access the PWA URL with Safari and then manually press the Share icon and then “Add to Home Screen.” There is no indication that the visited website is a PWA.
About the "Add to home screen" in Chrome, I could not indeed find any official information when it has been removed. I can only say that I never seen it again since one of the latest versions (v74+).
Every pages of a PWAs should be linkable in order to benefit from sharing it via social media apps. Therefore if you have a working PWA and you send links to others, these should work as well. There are no special browser restrictions, given that the app is correctly implemented.
I leave you below some links where other people have similar issues with PWAs and iOS 12.2:
Link with discussion
Test PWA
Article with some tips (here there are some suggestions on how to make the PWA work on iOS)

Is there any way to force a link to open in Chrome from Facebook's in-app browser?

I've got a web app that requires the ability to print. Facebook's in-app implementation of Chrome doesn't allow printing. Currently, I'm giving the user instructions on how to open in chrome themselves in place of the print button I give normal users. But I'd prefer to just open Chrome for them when they get to that page, or at the very least provide a button/link that would open the page in Chrome instead of forcing them to find the settings button and figure out how to open Chrome themselves.
I've tried using the googlechrome://myurl.com approach, and Chrome opens, but the specified url doesn't load.
I've looked into Google's Intent option but I wasn't able to figure out how to open Chrome with that method.
Is there a way to accomplish this in javascript? or by some url scheme in an href attribute?
So far, all the other answers I've found give explanations for how to do this from an Android App, but not from a website.
** Update: The googlechrome://myurl.com seems to work fine from iOS in the native facebook app. It does not appear to work correctly using the native facebook app in Android.
Try
googlechrome://navigate?url=example.com
for Android users.
Reference from https://stackoverflow.com/a/12013755/9514189

Facebook JS API does not work with progressive web app

I have a "Progressive Web App" installed to my phone's homescreen.
The Facebook Javascript SDK it trying to open a login dialog popup window using window.open.
This results in an about:blank tab being opened in Chrome which never loads, and never redirects the user back to the web app.
Does anyone have any advice or experience with this problem? I imagine since these "Homescreen Apps" are fairly new, this might not be a well known issue (yet).
Looks like it was a bug with Chrome itself. Should be fixed by now (Chrome 68 was released the 24th of July).

Come back to iPad Webapp after going to Mobile Safari

I'm creating an RSS Reader Web app for iPad. In my application, there is a button that opens the URL of each article in Mobile Safari (with target="_blank" method)
But the problem is, after user goes to Mobile Safari from my web app, and then closes Mobile Safari, iPad goes to the home page. but it should come back to my web app.
I tried to implement an in-app browser in my web app with iframes, but there is too much problems with it. many sites does not allow users to open their website inside an iframe, also there are some problems with implementing back button for the iframe, you can read the problem here.
What is the best way for my purpose? Is there any way to come back to web app after closing Mobile Safari? If not, what should I do? Is it possible to solve in-app browser problems? How?
If you're using phonegap (which it sounds like you are), I would suggest the InAppBrowser or ChildBrowser plugin

Notification for a chat widget

I have developed a javascript based widget application having IM features, use case of this widget will be to embed it on any web page.
we have embedded this widget app to our organizational portal, and IM is working fine. Now the management wants if we can have notification for any incoming IM, if the browser is minimized or is in the background. Notification on task bar as gtalk was providing on windows XP.
But now a days, these notifications are not available on windows 7, even facebook has an messenger embedded with their FB page and even no notification is there.
I searched internet for solution but as of now found nothing. It seems for desktop application it can be done for widget kind of application is it feasible??
Please help..
You can change the window title to the notification. This is similar to what Facebook does.
http://heyman.info/2010/sep/30/jquery-title-alert/
This should help you out.

Categories