Is it a way to imitate iOS native custom url call from a React app? - reactjs

Facebook has this Sharing to Stories functionality fro native iOS and Android. I am not sure possible or not but I would to do the same, open Instagram, and profile with custom content.
Seems open Instagram works, but profile data not. Do you know why?
Image is copied programmatically, put on pasteboard, and url loads this instagram-stories://share?source_application=2773133082797983 but till content, the mp4 is not loaded. What do I miss? Is it even doable from a React app??

Related

How to embed a website in expo React Native

I want to embed or just redirect to a website I made which uses a webcam. I can redirect to the website with webView however the camera doesn't work.
This is the website I want to embed. https://chinmaymhatre.github.io/currency_detector
I don't think you can permit camera access inside a webview in a react native or expo app because of security concerns, neither could I find anything like that.
I think it would be easier to just implement this right into the react native app(if the app you want to show in the webview is written in javascript)
I have tried something similar. So, sometime ago I was making a video streaming app using React Native for a website that I made using WebRTC which was using camera and other medias(Video, Audio and Screen). I tried to be smart and tried to embed the webpage directly into the React Native App. My Idea was that I could access the Camera and other user media in Mobile Browser So, it should work with React Native as well. But this is not how the react-native works, React Native doesn't uses iframe to work or in other words react-native develops Native Apps for both IOS and Android. You can always implement an iframe in expo, but this is against the Device Security to provide such level of access to user-media. The device doesn't allow such functionality via iframe (here's the link to a live example how to implement iframe in expo). So, to understand it better You should use react-native-cli to make a simple app not expo. Now for using camera in expo there's a package called expo-camera (here's link) Which helps you develop camera oriented apps using Expo. If this doesn't answer your questions then let me know. Happy Coding :)

React, open mobile camera on web

I have a React web app and I want that the user click a button an open the camera if it's in mobile device, in order to select pictures from the gallery or take photos directly with the camera. With React Native is quit easy, but I need to do it in web, with browers.
I have test the npm library https://www.npmjs.com/package/react-webcam but that library display the webcam in the web, I want to open the mobile interface, any idea?
You cannot access native android libraries with reactJS(that's why we use React-Native or Android SDK), someone is still to create a library for this.
You can always ask the user to upload an image instead.
Code:
https://codesandbox.io/s/elated-shannon-5yg9x?file=/src/index.js

Responsive Website both mobile and phone, mingle both Reactjs and React native

I want to the responsive web app on Mobile and Web page. I have built a website on React js. I have brought that website using a web view to React native and made it a mobile app. Now I need to direct my users depending upon the platform. If they are mobile users I need to direct them to React native app(live on the browser) and if they use the system they should be seeing the website I build. How can I do that? Is it possible? Suggest me a better Idea.
You can achieve this using your backend code by checking request user agent if you get mobile, you can redirect to some other url (Probably play store).
You can do the same via front end JS also (not advisable). You can use these methods to detect if the user is on mobile, based on that redirect it to play store.
Check if the navigator userAgent is mobile or not. If mobile add a links to your app or app store to download it.
if (/Mobi|Android/i.test(navigator.userAgent)) {
// if I'm here that mean I'm a phone
}

Force stripe checkout modal on mobile?

I'm building a web app with Stripe checkout. On desktop it loads a nice modal when you go to pay, but on mobile it brings the users off to a Stripe page, and then back. I want it to look like the user is never leaving our site.
Is there a way to force the modal to be loaded on mobile? I'm building the web app in ionic at the same time, so if I want to turn it in to an app I can. Ionic uses a WebView on the phone and that loads the modal fine, so there must be some setting that is allowing it?
Anyone have any ideas? Thanks.
edit If I 'request desktop site' on my mobile it loads the modal fine
As Stripe makes these determinations based on the User-Agent you could try changing the User-Agent of your webview to match that of a desktop browser, (I did a similar thing except I needed to force mobile behavior in the desktop).
It should be stated, that this is definitely not recommended by Stripe nor supported and could break at any time. They'd recommend you just build a custom form using Stripe.js
How i can set User Agent in Cordova App has how to set the User-Agent in iOS and Android.

Bootstrap 3 - Is it possible not to load assets when on mobile?

Im looking for some guidance on a responsive site design written using Bootstrap 3.
Basically I want the mobile version to be as lightweight as possible and only load JS and HTML that is necessary for the mobile view, and not load assets required for the desktop view. I would like to ignore loading specific JS files when the page is loaded via a mobile device.
Is there a simple method to do this with Bootstrap?
My guess is that I need a Javscript function to detect the device and use that as a trigger, however I was wondering if Bootstrap had this capability that I could use?
Appreciate any thoughts.
It seems there is already answer to detect mobile browser with javascript. Detecting a mobile browser
Otherwise you can detect the mobile device by using http_user_agent to decide not to load assets when the page is loading.
Here is already answer to detect mobile device with php.
Check if PHP-page is accessed from an iOS device
You can perhaps do it by user agent. There is an answer here that might help
Load a javascript file and css file depending on user agent

Resources