Behavior react-native linking - react-native

My question is about Linking of react-native : https://reactnative.dev/docs/linking
I implement this functionnality but I have a behavior that I don't want.
In case of my app is close, I click on a link and my app start. But before the link is detected my app start normaly, and after the link detected by the method Linking.getInitialURL() the redirection is done.
I find this behavior weird because the application starts as if it had been started normally and after a delay the link is detected and the redirection is executed. The user see the start useless screen before the redirecton.
Moroever it's a problem if the redirection with url is faster than the normally redirection. We see firt the redirection with url, and after the redirection of open app. So user can't access to the link redirection.
I don't know how resolve properly this problem.

Related

expo deep linking url doesn't work when clicked from email

so I'm trying to open my app using the deep linking URL for my react-native app. The link was sent to my email and in the form of HTML something, I clicked it but nothing happened.
I also have my scheme: myapp in app.json and have the default Linking configuration set.
Aside from that I also tried to open it through web browser (not sure if it actually a thing), by typing it in the URL part and it doesn't open my app too.
Anyone know what the problem is?

Branch.io architecture query

I have the following requirement and based on the branch docs I cannot get myself a straight answer.
We want to enable deep links that if the user has the app installed that it uses them and if not redirects to download then redirects.
If the user is on a desktop they get redirected to a page to download app.
We want to control all the actual deep linking using react navigation config and wanted to know how we can pair the two!? The guides are very poorly written and makes understanding the flow a nightmare.
Some guidance and suggestions on how best to accomplish this would be great.
P.s. are the links generated that when app found it takes the prefix and replaces with appname:// ??
Your requirement for deep linking can be handled with Branch, you can set the URI schemes of the apps under the link settings of your Branch dashboard and also mention your app on PlayStore/Appstore for the user to download the app when clicked on the link.Similarly you can add the redirection URLs for the scenarios when your link is clicked on a desktop.
Alternatively you can use our React SDK to create links with all these link properties and even more. More details here.
The handling of the deep link data and redirecting the user to the desired page can be found here.
If you wish to know more about how Branch passes data through to the app and attributes app sessions, check this.

BaseClass functionality not working in react native

Am totally stuck with something. Working on deep link and its redirection. When clicking on a deep link it's getting redirected to my app. I have added the code to handle in my HomePage.js.
Scenario 1:
If app is removed from background in phone then the deep link redirection works great
Scenario 2:
If app is kept at HomePage.js and left in background of device. then on deep link click opens the app no redirection happens.
Scenario 3:
If app is kept at HomePage.js which have AppState.addListener() and left at background and then on click of deep link HomePage state change listener is hit but there is no url.
Expected behaviour
App should detect its being redirected when its on any page with the url.

iOS 13 PWA URL bar shows up when navigating to a new page

I have a PWA (specifically concerned about iOS Safari at the moment), where when I add the PWA to my homescreen, the page I was on when I added it shows up like a native app. However, when I navigate within the PWA (same domain just new pages) the URL bar shows up.
This post was similar, but mentions it's for chrome/android.
PWA: Address bar showing up when redirectioning to subdomains -- and, as I understand it, iOS doesn't use all of the manifest file. I tried setting the scope, but no luck.
I have the necessary head elements in for showing a standalone (like I said, the initial page when I saved the PWA to the homescreen works fine).
Any ideas how to fix this?
I was able to resolve this by undoing the router mode history and reverted back to # hash-based routing.
I'm using Vue, so basically I just undo what I did here
https://router.vuejs.org/guide/essentials/history-mode.html

Facebook Connect button not showing up in Safari/Chrome

My implementation of Facebook Connect (just a simple login button, fb:login-button) works perfectly on Firefox and IE.
But the same button is not showing up in Safari/Chrome (Webkit).
Here's what's ironic. In my debugging effort, I saved the page (that contains fb:login-button) up as a static page and then load it in Safari. And the button shows up, everything works!
The exact same page (with the exact same HTML source) rendered by my PHP has no way for bringing up the button.
I'm trying hard to support Webkit here but I'm close to giving up. Can anybody help?
I found one more way this can occur (the blame-myself-for-being-stupid way); it's probably not common, but in the event is saves anyone else the hassle, here it is:
This symptom can also be caused by various security tools blocking facebook resources.
In my case, I'd installed Facebook Disconnect ages ago in Chrome as a plugin and forgotten all about it being installed. I also had a second installation of Chrome that was seemingly identical (but did not have Facebook Disconnect). The first would properly load the fb:login-button, and the other would not; took me ages before I looked at the plugins, because Facebook Disconnect didn't have an icon and so its presence was pretty easy for me to miss.
Here's what you'll see if some sort of security plugin is preventing facebook resources from loading. Just look at the html that renders in the browser using developer tools.
In a normal chrome session you'll end up with something like this:
<fb:login-button><a class="fb_button fb_button_medium"><span class="fb_button_text">Your text here</span></a></fb:login-button>
But in the version with facebook's resources disabled you'll end up with this:
<fb:login-button>Your text here</fb:login-button>
Like I said, pretty obvious in retrospect.
Had the same problem but it was not related to anything like a plugin or malformed content. It seems if you enable country filtering on your facebook page it has an issue with the like button, this should be fairly obvious. Facebook gets your location from your profile and not your IP address.
Make sure to disable country locking if you plan on using the social plugins.
This can be due to having ClickToFlash installed. Either disable it, or check "Automatically load invisible Flash views" in the ClickToFlash settings.
What we found out is that Safari (and maybe some older versions of Chrome or other WebKIT browsers) have a problem with Facebook's code using the innerHTML JS function if your page arrives with an XHTML response header (application/xhtml+xml).
Using text/html solves the issue.
In case of JSF2, which we use, the implementing the fix was as simple as wrapping the FB button like this:
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="http://www.facebook.com/2008/fbml"
xmlns:f="http://java.sun.com/jsf/core">
...
<f:view contentType="text/html">
<fb:login-button>Login using Facebook</fb:login-button>
</f:view>
Facebook bug report here:
http://bugs.developers.facebook.net/show_bug.cgi?id=5545
I had this problem with the Facebook button not showing at all and it took me forever to figure out what it was. Luckily after days of hair pulling I will now share the answer with everyone. In my situation I simply didn't have xfbml enabled. In my FB.init I had it set to false:
FB.init({
appId : 'app_id', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : false, // parse XFBML
oauth : true // enable OAuth 2.0
});
I changed this to "true" (xfbml) and the login buttons works great now! :P Good luck!
This happened when I had the wrong domain in callback_url in config/facebooker.yml. Apparently it uses that to load the js files.
I had the same problem but I resolved it by making sure the URL in my app settings was exactly the same as the one for my site (i.e. it didn't work when I accessed my site without the www.).
I have tried every suggested solution here and it didn't work for me. But now I finally found the solution.
Facebook requires now a secured (https) for Canvas (Secure Canvas URL). The unsecured one will be deprecated soon.
Here is the main difference, Chrome doesn't like https connections with invalid certifications. On a localhost, it is very likely you have stunnel installed to allow https connection for the localhost. Firefox is ok with the self created SSL certificate and allows you to add an exception when trying to access that site. Chrome doesn't allow it out of the box.
When I load my app in Chrome the page is blank and I dont see any login button.
Click F12 and click the Netwrok tab in Chrome:
You see that the post request to your localhost is cancelled. DOUBLE Click on it.
Now you would see that chrome is blocking the localhost because of the certificate:
click on proceed anyway.
Now to back to your other tab and reload the page:
Chrome works now like Firefox and shows the login button.