I have videos stored in a protected bucket on S3. I am able to retrieve the URLs in my React Native application using Amplify:
Storage.get(route.params.organizerVideoS3Keys, { level: "protected"})
.then((result) => {
console.log("result", result);
setOrganizerVideo(result);
})
However, when I put this url into the Expo Video component, nothing shows up. I am able to download the video onto my computer via this url (I am not able to open it, it "isn't compatible with QuickTime Player) so I think the problem is in the way I am attempting to display the video.
My question: how do I take this url and display the video in my React Native app?
some notes:
-when I download the video it is a .mov file
-as shown above, the video is in a protected level on S3
-currently I am using Expo
Thank you.
Related
A couple of months back, I came across a client requirement who wanted to build a feature to download and restrict video files in Android App, just like YouTube, Netflix, Amazon Prime does with us.
The steps need to be implemented is as follows :
Download the video from the URL
Encrypt the video file
Decrypt the video file at the time of playing
I use RNFetchBlob for download the video from the urls and RNFS is used for file access.
Requirement :
I need to encrypt the video file and decrypt the video file from the App.
If anyone knows the solution please help me......
I need to encrypt the video file and decrypt the video file from the App.
I want to stream music from Spotify in my React Native application created with Expo. This can be done in a browser with the Spotify Webplayer SDK, and I would like to use it in my application as well if that is possible.
I've tried to inject the script provided in the link above into my react native application with React Native Webview and initializing the playback device like so:
useEffect(() => {
window.onSpotifyWebPlaybackSDKReady = () => {
const player = new Spotify.Player({
...
})
}
})
But this does not seem to work.
There are libraries for controlling an existing playback device like Spotify Web API Node. Which means, that if I were to create a playback device in my application, I would then be able to control it.
It it possible to use the SDK to initialize a valid playback device in my react native application so that I can stream music to it?
I'm working on a Facebook video downloader application in react native with webview. I have added a download button with every video so when user click on the download button I'm extracting that video src URL value and that is a blob value which is not an exact video url.
Blob URL: blob:https://m.facebook.com/fa1b8a59-f983-4881-971b-47f9fed39242
So can anyone please explain how to get the actual video URL in webview to download that specific video?
I am trying to implement something in react native:
I have a url of video which i'm showing in react native video component, how can i give a button to download that same video in mobile but it should not appear in gallery.
Also if the video is private where the headers can be passed and how?
How to download any file ?
Well for downloading any file like video,img you first need permission to read and write into internal/external storage of phone and after that you need a native module that can download files from server to the local folders of phone.
there are two best known libraries for downloading files
https://www.npmjs.com/package/react-native-fs
https://www.npmjs.com/package/react-native-fetch-blob
Now you can follow their documentation to download files like Videos,images or whatever you want to your user's phone.
Now Lets come to the part that you dont want it to be available to user via gallery.
For this i suggest using react-native-fetchblob as it has builtin intent actions and views.
You can download a video file with any random name like 1234CACHE any random name without any extension to it, specially dont give it extension like video.mp4 because gallery detects .mp4 files so dont give it any extension and the file won't be available in any gallery.
Now how to hide the file?
react-native-fetch-blob allow us to save files into directories that are not publicly available i mean user cannot reach those directory and these directories are used only for saving App's data so you can save your video file in one of these directories.
Now after completing your download, You can open your file with the Intent.
For Example:-
const VIDEO_PATH = res.path() //the path where your downloaded video is saved, you will actually receive this in the response of download function.
const MIME_TYPE = "video/mp4"
//Now finally call the intent with video mime so the video will be opened in user's media player, or if you want your own media player you can use any library for that.
android.actionViewIntent(VIDEO_PATH , MIME_TYPE)
Note: You can only download a video if you have a path URL to the video file, You must not mix web URL with Video File URL, Video file url has file name and video extension at the end of the url. such as https://someURL.com/video.mp4 this is video file url, but if you have something like https://SomeURL.com/video it is not a video file instead it is a webpage displaying that video file so you cant really download that specific video from a webpage!.
There can be multiple approaches to this.
I hope you have an idea about your video player, download option depends on your server and site.
You can change the file extension of downloaded video, like my_video.notMP4. So the video will not show in the Gallery as it not detected as a video file now.
Hide the folder where the video file is downloaded, adding a dot(.) before the folder name can hide the folder in Android/Unix and video will be hidden from Gallery. Example .my_Video_folder
For more safety, you can encrypt the video and make them in custom chunk which only your player can play. But you may need to make or find such a video player.
I could not understand the headers part, please explain.
I've looked through the API documentation on Instagram and researched the web, but I haven't been able to find a consistent answer to whether it's possible to download your own Instagram photos via a web app.
For example, I'm trying to write a web app which allows users to authenticate into their Instagram account, and then download all their Instagram photos into the web app and display it.
The closest thing I've seen on Instagram is the following url: http://instagram.com/developer/endpoints/media/#get_media
But can someone confirm if this is the correct endpoint? Also, if this is the correct endpoint, assuming that I uploaded a high-resolution photo, would that photo be available for me to download in high resolution via the API?
You can do it easy with Google Chrome and you don't need the API:
I wrote a small ES6 script that does just this ( let's you view and save instagram images and videos on right click )
Here's the code:
document.addEventListener('contextmenu', (event) => {
const elements = document.elementsFromPoint(event.clientX, event.clientY);
const mediaSource = elements.find(element => /img|video/gi.test(element.tagName)).getAttribute('src');
mediaSource && window.open(mediaSource, '_blank');
});
What it does is when you click on image or video, it get's all elements under the mouse, finds the image/video and opens it in new tab. Then you save it.
Also, it's available as a Chrome Extension
Download instagram images of a particular user or tag using python. Source is included both console and GUI. Install all the dependencies before running. Remember this code is not optimized for python 3. Make sure that the profile is public or else only the profile picture will be downloaded.
link to my github repo:https://github.com/techweed/instagami
Its a python2 script and you need to install it for this to work.
The images would be downloaded to your working directory.