Sharing URL on android doesn't show up as link. React Native - android

I'm trying to share a deep-link to my app with a message using react-native-share.
The massage is there and so is the URL, but the URL is appearing as a String of array with the link in it.
Something like :["app://app/home"]
I want it to be a clickable link to my app,
IOS works fine for me.
My code:
import Share from 'react-native-share';
shareLink() {
Share.open({
title: 'Welcome',
message: 'this is a link to the home page',
url: 'app://app/home'
})
.catch((err) => console.log(err));
}
Thanks!

Related

Download Word .docx as Blob file from Angular on mobile devices

I am trying to download .docx file from REST API (.NET Core FileContentResult) in Angular application. Everything is working fine on PC, but there is problem with downloading .docx files in VMware Workspace ONE Web browser (didn't try standard browsers like Chrome or Safari, it looks like there is just Android WebView). It is company application and this browser is the only one allowed.
The problem is only with .docx files. Files like PDF, .doc and .xlsx (created by ClosedXML) are working fine.
REST API call (also tried with 'arraybuffer' instead of 'blob' and created Blob object in client, but problem persists)
this.httpClient.get(requestUrl, {
responseType: 'blob',
observe: 'response'
});
Then I save response body with FileSaver.
generateDocument(file: string | Blob, name: string): void {
FileSaver.saveAs(file, name);
}
I also tried approach that creates link and click on it (it does not work).
Solution with using window.open(blobUrl) is not working.
EDIT:
I got information that it is not working at all in iOS with same browser. Users get error message "Link is invalid."
Can someone help me with this issue? Thanks.
If you can retrieve obtain an ArrayBuffer, this could be used to initiate the download with those bytes:
Test here: https://batman.dev/static/70085191/
async function downloadUrl(url) {
downloadBuffer(
await (await fetch(url)).arrayBuffer()
)
}
function downloadBuffer(arrayBuffer) {
const a = document.createElement('a')
a.href = URL.createObjectURL(new Blob(
[ arrayBuffer ],
{ type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' }
))
a.download = 'my-file.docx'
a.click()
}

Uploading Audio to Cloudinary

this is my first Stack Overflow post so please go easy on me!
I'm building an audio recording app using EXPO as the SDK with React Native. One of the main features of the app is to be able to to record live audio as well as uploading audio from the client's device. By leveraging Expo's Audio API and FileSystem, I'm successfully able to record and save live audio and then retrieve it via FileSystem to upload, however I'm running in an error when I try to pass the localUri to upload to my Cloudinary database. There is very little documentation in regards to audio and audio uploads to cloudinary are clumped into video uploads so there's nothing audio specific to really point me in the right direction. I've tried converting the URI to base64 as well as a variety of MIME types but the response from Cloudinary with a secure url returns empty/undefined. I've successfully uploaded images with this method so you can imagine how frustrating it is. Here's my code that grabs a recording and tries to upload it to Cloudinary:
DocumentPicker.getDocumentAsync({
type: '*/*',
copyToCacheDirectory: true,
base64: true
})
.then(succ => {
//check out the saved info
console.log(succ, `path: ${succ.uri}, type: ${succ.type}, name: ${succ.id}, size: ${succ.size}`)
let Base64 = {/* Truncated Base64 object*/};
let base64Aud = `data:audio/x-wav;base64, ${Base64.encode(succ.uri)}`;
let cloud = `https://api.cloudinary.com/v1_1/${CLOUD_NAME}/upload`;
const data = {
'file': base64Aud,
'upload_preset': CLOUDINARY_UPLOAD_PRESET,
'resource_type': 'video',
}
fetch(cloud, {
body: JSON.stringify(data),
headers: {
'content-type': 'application/x-www-form-urlencoded'
},
method: 'POST',
})
.then(async r => {
let data = await r.json()
console.log('cloudinary url:', data.secure_url)
return data.secure_url
})
.catch(err => console.log(err))
}
This call prints the following to the console:
Object {
"name": "20200117_143416.mp4",
"size": 519612343,
"type": "success",
"uri": "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Faloud-aaf24bff-8000-47f0-9d1c-0893b81c3cbc/DocumentPicker/c922deb7-fd4f-42d9-9c28-d4f1b4990a4c.mp4",
} path: file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Faloud-aaf24bff-8000-47f0-9d1c-0893b81c3cbc/DocumentPicker/c922deb7-fd4f-42d9-9c28-d4f1b4990a4c.mp4, type: success, name: undefined, size: 519612343
data:audio/x-wav;base64, ZmlsZTovLy9kYXRhL3VzZXIvMC9ob3N0LmV4cC5leHBvbmVudC9jYWNoZS9FeHBlcmllbmNlRGF0YS8lMjU0MGFub255bW91cyUyNTJGYWxvdWQtYWFmMjRiZmYtODAwMC00N2YwLTlkMWMtMDg5M2I4MWMzY2JjL0RvY3VtZW50UGlja2VyL2M5MjJkZWI3LWZkNGYtNDJkOS05YzI4LWQ0ZjFiNDk5MGE0Yy5tcDQ=
cloudinary url: undefined
Does anyone see any glaring issues or have any insight on this issue? Better yet, successfully uploaded audio to Cloudinary from the client using Expo & React Native? Thanks!
While I can't say for certain why the uploads fail in your case without seeing the error returned by Cloudinary, I have created a working JSFiddle which you can use to upload a Base64 data URI encoded audio file (1-second audio in my example to keep it short). Just replace your cloud name in the API endpoint URL and set the upload preset. Once that uploads successfully in your account you can replace the example with your Base64 Data URI and see if it works or not. That will tell you if the issue is with the Base64 String itself. Having said that, sharing the error returned by Cloudinary would be the best indicator.
Example code below:
var fd = new FormData();
fd.append("file", "data:audio/mpeg;base64,SUQzBAAAAAABBFRYWFgAAAASAAADbWFqb3JfYnJhbmQ...");
fd.append("upload_preset", "");
fd.append("resource_type", "video")
fetch('https://api.cloudinary.com/v1_1/cloud_name_here/upload',
{
method: 'POST',
body: fd
}
);

React Native sharing base64 image is not working

I am developing on android. My react-native version is 0.42. I'm using react-native-share package for sharing screen view. The data I want to share is being converted to base64.
...
const uri = "data:image/jpeg;base64,...";
Share.open({
title: "Title",
message: "Message",
url: uri,
subject: "Mail subject"
})
...
This process was working properly on whatsapp, facebook and email before.
However, now, when I tried on whatsapp the response is 'Sharing failed. Please try again', on facebook I'm getting an empty text area without sharing options and on email I'm getting the text typed options except for the image.
Do you have any suggestion? Thank you.
I am using react-native-share but using the shareSingle option like this:
Share.shareSingle({
message:'I just added a new outfit to my album.',
url:Constants.image64, //base64 image
social: "whatsapp"
});
It works great on both the platforms. You can try it if it suffice your needs.

Show PDF downloaded from API in Ionic / Angular

I need to hit an API endpoint, which returns a pdf file (not a url to a pdf, but the actual data), then somehow display this pdf in my ionic application. Ideally, I'd like to just give it to some other application like the phone's mobile web browser but I'd be open to trying to embed it within my app as well. On iOS, I just use $window.open(url) and mobile safari knows to download and display the pdf that is returned. However, Android tries to download the file then tells me that it can't be opened when I try to open it.
I've also tried embedding it in the app with <embed> but nothing gets embedded. However, a similar method works with images in <img ng-src="url">.
I've also tried messing around with cordova FileOpener2 but am having a lot of trouble getting anything to work in that. If that's the right way to do this, I'd be open to re-visiting that method.
The closest I've gotten is definitely just sending it to the devices mobile browser as that works perfectly on iOS.
I solved it using filetransfer and fileopener2. My code is below. The main issues I ran into was not having <access origin="cdvfile://*" /> in my config.xml file and not having ngCordova installed correctly.
if (ionic.Platform.isIOS())
$window.open(APIUrl, '_blank', 'location=no');
else if (ionic.Platform.isAndroid()) {
var fileExtension = filename.substr(filename.lastIndexOf('.')+1);
//I have a dictionary with this somewhere else
var MIMEType = extToMime[fileExtension];
var uri = encodeURI(APIurl);
var fileURL = "cdvfile://localhost/persistent/file."+fileExtension;
$cordovaFileTransfer.download(uri, fileURL, {}, true)
.then(function(result) {
$cordovaFileOpener2.open(
fileURL,
MIMEType
).then(function() {
console.log("SUCCESS");
}, function(e) {
console.log("ERROR");
console.log(JSON.stringify(e));
});
}, function(e) {
console.log("Error: " + JSON.stringify(e));
});
}

Uploading or linking to pictures to a Page from the Facebook Android feed dialog

I have an Android app with a requirement to upload a picture from the Android device to a Page that the user has Liked, using the Feed dialog. (The user is not an administrator of the Page.) I have not been able to get this to work in a way that actually displays the picture on the Page's timeline. I am going to describe what I have done, what happens, and what I would like to see; hopefully someone can help me out.
Here is the sequence of events that happens right now:
Within the app, the user connects to Facebook using the Login button provided by the Android SDK.
The user takes a picture using the app which is stored on the local device.
The app uploads the picture to one of the user's Facebook albums.
The app constructs a URL that points to the picture in the user's album.
The app invokes the Feed dialog with these parameters. "pictureUrl" is the URL that was built in step 4; "pageFbId" is the internal Facebook ID of the Page on which the picture should appear.
Bundle params = new Bundle();
params.putString("link", pictureUrl);
params.putString("to", pageFbId);
The user completes the entry in the Feed dialog.
The page's timeline shows the text entered by the user in the Feed dialog and a link to the picture in the user's album.
Is there a way to do this so that Facebook actually shows the picture on the Page's timeline, instead of just a link to the picture?
Thanks!
Example: Setting picture parameter in Facebook Feed dialog via JS SDK.
IOS, Adroid examples to come.
<script>
function feedthis() {
var obj = {
method: 'feed',
link: 'https://developers.facebook.com/docs/reference/dialogs/',
picture: 'https://developers.facebook.com/images/devsite/developers_og_image.png',
name: 'Facebook Dialogs',
caption: 'Reference Documentation',
description: 'Test via spoof Post',
properties: [
{ text: 'Link Test 1', href: 'http://example.com'},
{ text: 'Link Test 2', href: 'http://example.com?ref=1'},
],
actions: [
{ name: 'via Test App', link: 'http://anotherfeed.com'}
]
};
function callback(response) { // get post id here from response object.}
FB.ui(obj, callback);
}
</script>

Categories

Resources