react native app auth - How to make scopes as optional? - react-native

I am trying to implement OAuth into my react native app.
I am using react native app auth.
I would like to make scope as optional.
Currently, it is mandatory.
How do I do that?
Can I modify the code of react native app auth and build it and import into my Example code?
React Native app auth - Github Link

One of the maintainers of react-native-app-auth here.
Up until this moment I was under the impression that the scope parameter was a required paramater in the OAuth 2.0 request spec, but looking at the relevant spec definition, it appears to be optional.
You should be able to remove the array.length check in the validateScopes helper. You can try this by editing the index.js file in your app's node_modules/react-native-app-auth/ directory.
Once done, you can pass an empty array [] as scopes.
I'm not sure how the underlying AppAuth native libraries deal with it, but if it works, you can open a PR to react-native-app-auth and I'm happy to accept the change.

Related

Setting the User Context App Insights for React Native

We have a React Native app and we are logging to App Insights using the "applicationinsights-react-native package", this all works fine in a sense, but we are trying to start using the monitoring side of things which uses a User ID. Now I'm pretty sure that whatever the User ID that the (app insights) package is using for a user ID won't cause too many problems if we kept it, but it won't be right.
The ApplicationInsights class has a setAuthenticatedUserContext method, however the comments seem to refer to cookies suggesting it's a React package re-purposed and this GitHub post https://github.com/microsoft/appcenter-sdk-react-native/issues/503 suggests we can't use it, however the response is for the React Natve AppCenter package which we are not using. We are using App Insights direct.
So I was wondering if there was a way to set our user_Id/User context if we are using App Insights directly from a React Native app?
It looks like setAuthenticatedUserContext does work if you talk to App Insights directly and not theough Appcenter, it's possible that it works through Appcenter now as well, I have not tested so I am not sure.
If you want to check that this ends up as on the App Insighst side, it appears as a property called user_AuthenticatedId.

Getting localStorage from Ionic application in my React Native app

We are rebuilding an Ionic 1.x application with React Native. The app is used by a lot of people and I don't want everyone to log in again after they update the app.
The current app uses localStorage to save the token that defines if a user is logged in (I know, it's not the safest method). Is there a possibility that we can get the current token from the localStorage in React Native and put in our secure storage?
So basically can we call the localStorage instance in React Native? We are using the same bundle identifier so many there is a possibility to access the localStorage from the old app.
You wont treat with a web enviroment like Ionic, then localStorage wont exist, but you can use AsyncStorage instead in react native or some DB like sqlite, realm, whatermelonDB (the last one I didnt use) to save your user data

Is it possible to integrate a TWA into a React Native project?

I am wondering if it is possible to integrate TWA (Trusted Web Activities) into an existing React Native project. This way I could have a section in my app where costumers can use my PWA inside my app. As fallback for iOS I would use something like their WebView. If it is possible, how would I go about implementing it?
In short, yes, it is possible to integrate Trusted Web Activity into a React Native App.
You'd need to create an Android Native Module that wraps Android Browser Helper into a React Native API. Since you want to use the Trusted Web Activity as part of your app, you will probably be looking into wrapping TwaLauncher.
Then, you will need to implement a module for iOS, which will have the same API in React, but will use the WebView as an implementation.
It seems someone has already created a wrapper for Android (but I haven't tested).

Can you interact with the app in test using absolute positioning in Detox?

I am trying to test a react native app on android which uses a native library which does oauth-based authentication using a webview. Detox does not support webviews (yet) so I was wondering if I could tap on the keyboard using coordinates in order to get through the auth (bad I know, but gets me unstuck for now).
Since the oauth screen is outside your app, I'd recommend you do the following:
Create E2E tests for your login up to the oauth screen
Get a CLI for your oauth provider or figure out how to authenticate via node.js to get the auth token
Create a deep link path in your app that accepts the token as a param and stores it the way you'd store it normally and trigger a continuation of the login flow (you may need to reverse engineer your native lib slightly)
This is generally the approach you want to take if you are using an external authentication party. If the party providing the auth package doesn't support 2 and 3, you should raise the issue with them.

Possible to access Cookies in a WebView in React Native?

If you create a WebView within a react-native application, is it possible to access the cookie from the WebView to be passed in subsequent requests?
An example would be presenting the User with a login page with reCaptcha in a WebView. Then using the authentication cookies from a successful login to make subsequent API requests to the same site.
React Native is just a bridge on top of the native code. Anything you can write in objective-c/java can be used in React Native by creating native modules.
I am not sure if there is JavaScript code present for clearing the cache of a webview, but you can certainly write native code for it and then bridge it using native module.
Here is the link for the native code(iOS) : https://stackoverflow.com/a/5606703/2164029
Tutorial for creating native moduels : https://facebook.github.io/react-native/docs/native-modules-ios.html
I believe this https://github.com/joeferraro/react-native-cookies should provide you what you want.I have used this to clear cookies successfully.