Open Whatsapp from React Native app with Expo - react-native

Currently trying to open whatsapp from my React Native app with Expo. I have the code below:
let url = 'whatsapp://app';
Linking.openURL(url).then((data) => {
console.log('WhatsApp Opened');
}).catch((err) => {
console.log(err);
alert('Make sure Whatsapp installed on your device');
});
The error I get is this:
Error: Could not open URL 'whatsapp://app': No Activity found to handle Intent { act=android.intent.action.VIEW dat=whatsapp://app flg=0x10000000 }
However when I change the url to send, it opens whatsapp fine?
whatsapp://send?phone=3464478983
I am trying to only open whatsapp without a send param

Related

Expo linking fb post url scheme

Is there a working url scheme for posting on Facebook app (not opening in browser) from Expo app? I've read all about deep linking on Expo documentation, but whatever I type for fb:// it only opens the app and does nothing, and I need to post some text. I've used expo-linking to share an image or text in Facebook Messenger and other apps (Sms, Twitter, WhatsApp) and it's working:
const openMessenger = async() => {
try{
await Linking.openURL(`fb-messenger://share/?link=${myLink}`);
}
catch(error){
console.log(error);
}
}

How to open URL with scheme intent:// on react native

I have a react native mobile app with a webview. In the webview I added the facebook messenger chat plugin so my users can easily contact us if they need help.
if you ran the website through a mobile browser it works. It redirects you to the official messenger.
But when you ran it through react native webview somehow it says No activity found to handle Intent
here is my code on how i handle the opening of the intent
onShouldStartLoadWithRequest={(request) => {
let url = request.url
if(url.startsWith('intent:')){
Linking.openURL(url).catch(er => {
console.log(er)
alert("Failed to open URL")
});
return false
}else{
return true
}
}}
this will console log
[Error: Could not open URL
'intent://user/107571147455693/?intent_trigger=mme&nav=discover&source=customer_chat_plugin&source_id=1507329&metadata=%7B%22referer_uri%22%3A%22https%3A%5C%2F%5C%2Ffusiontechph.com%5C%2Ff9fe1863270a2%22%7D#Intent;scheme=fb-messenger;package=com.facebook.orca;end':
No Activity found to handle Intent { act=android.intent.action.VIEW
dat=intent://user/107571147455693/?intent_trigger=mme&nav=discover&source=customer_chat_plugin&source_id=1507329&metadata={"referer_uri":"https://fusiontechph.com/f9fe1863270a2"}
flg=0x10000000 }]
I have a workaround that worked for me. Facebook messenger provides a link to your facebook page message. So you can just open that link directly without using the intent scheme of facebook here is the final code
onShouldStartLoadWithRequest={(request) => {
let url = request.url
if(url.startsWith('intent:')){
Linking.openURL('https://m.me/mluc.jsites').catch(e=>{
console.log(e) })
return false
}else{
return true
}
}}

Export whatsapp messages to react-native app

I'm trying to access whatsapp messages from my device with react-native. Accessing them directly seems impossible so I was looking into the possibility of exporting the messages and importing them in my app. The options which are currently provided by whatsapp sharing menu lack any direct download option.
Is there a way to add my app to the whatsapp sharing menu? Or is there an easy way to import these messages?
You can use https://github.com/meedan/react-native-share-menu this library for exporting chat from Whatsapp. When you export chat file from WhatsApp, your app will show on the share dialog. After that, you can open that file from your app like below
ShareMenu.getSharedText((text :string) => {
if (text && text.length) {
if (text.startsWith('content://media/')) {
//this will be a media
} else {
content = this.readFile(text)
}
}
})
Then you can read the content of that file using RNFS library
readFile = async (path) => {
try {
const contents = await RNFS.readFile(path, "utf8");
return("" + contents);
} catch (e) {
alert("" + e);
}
};
After getting the content of the chat, you can parse that chats.
We had the same issue when building a Website to analyze WhatsApp chats, as with android you can not save the exported chat on the device.
Our solution was to use a PWA (Progressive Web App) and listen share Events.
When somebody now installs the PWA, they can share the export with the App directly. (Currently, this is only supported for Android with Chrome, as Apple is heavily against PWAs)
Our implementation:
if (workbox) {
workbox.addEventListener("message", (m) => {
// eslint-disable-next-line no-prototype-builtins
if (_this.$route.query.hasOwnProperty("receiving-file-share")) {
let files = m.data.file;
// currently only the first file, but ultimately we want to pass all files
_this.$refs.filehandler.processFileList(files, true);
}
});
workbox.messageSW("SHARE_READY");
}

twilio react native integration

I'm trying to create a react native app that allows the user to click a button and a call to their phone will be placed using the TWILIO API. I have it working from terminal by typing node make_call.js(name of file) but i want the user to be able to make the call when they want to by inputing their phone number and clicking a call button. Heres my code. the credentials are fake. Is this possible??
var accountSid = 'AC76d99966f35141f7c8585e31ed740480'
var authToken = '6470ce0905736f0f9da91456f088e97cc2'
var client = require('twilio')(accountSid, authToken);
client.calls.create({
url: 'https://demo.twilio.com/welcome/voice/',
to: '7781234564',
from: '6042322056',
}, function(err, call) {
if(err) {
console.log(err);
} else {
console.log(call.sid);
}
})
Twilio developer evangelist here.
You can actually build phone calling directly into your application using the Twilio Voice SDK.
There is already available to, built by the community, a React Native wrapper for the Twilio Voice SDK.
Let me know if that helps at all.

React Native: How to open a Bitcoin URL?

How do you open a Bitcoin URL in a react native app? I am using React Native Linking to detect if there are any apps on the phone that can open a Bitcoin URL formatted according to BIP21. I have 3 apps installed that should handle it:
1) Coinbase
2) Breadwallet
3) Blockchain.info wallet
But it's not opening. Here's the code:
async _openWallet() {
const coinURL = 'bitcoin:15bMc6sQTiQ5jSqoRX3JzatAbQqJaffqup';
try {
const supported = await Linking.canOpenURL(coinURL);
if (supported) {
Linking.openURL(coinURL);
} else {
console.log('Could not find a compatible wallet on this device.');
}
} catch (error) {
console.log(error);
}
}
supported keeps returning false, which causes "Could not find a compatible wallet..." to execute. The weird thing is if I click on a Bitcoin URL on any random website via the Chrome / Safari browser, I get a popup that asks me if I want to open the URL in one of the above apps. So only URLs on websites are opening, but not URLs from inside react native code.
Any ideas?
Looks like every URI scheme you want to use at runtime must be defined up-front in Info.plist. Found the answer here: React Native: Linking API not discovering Uber app