React-Native-App | RN 开源之初，写几个小 App 玩玩 | Frontend Framework library

I have a few concerns with an OpenId Connect strategy that I would like to use and have been unable to find specifics on what the security concerns may be and any glaring issues with it I am overlooking.

Currently, I have an OpenId Connect implementation using Openiddict with Authorization Code flow. For the client, I have a React-Native app using react-native-app-auth.

I see from other questions on SO and from issues posted on the Openiddict repo that the recommended approach to third-party providers (e.g. Google) is: Client -> Auth server -> Google Auth -> Auth server -> Client/Auth server code and token exchange

However, it seems that a better approach from a UX standpoint (when using a SPA or native app) would be to implement something similar to GoogleSignIn on the client and either handle the identity on the server using an IdToken or authorization code from Google. This introduces an issue as the flow previously recommended could not be used as the entire initial challenge and redirect from Auth server to Google Auth has been skipped.

I have seen that this issue is mitigated by not using the authorization code grant and instead implementing a custom assertion grant. This seems to be an alright approach but would require exposing a custom grant and handling the flow differently on the client and server for local and third-party logins.

My proposed solution continues to use the authorization code flow and instead of adding a custom grant type the client could just pass a third-party identifier "Google" and the token or authorization code in the additional parameters of the OIDC authorize request. The authorize endpoint could then detect the provider and token, perform token validation, create a user or principal from it, and create an authorization code to send back to the client for the code/token exchange. This flow would look like the following:

1. Get the id token from the provider Client -> GoogleSignIn -> Client

2. Pass token to auth server and initiate code / token exchange Client -> Auth Server -> Auth server Verify Google IdToken (JWKS, issuer, audience, provider specific validation, etc...) or exchange auth code -> Auth server -> Client/Auth server code and token exchange

One downside to this approach would be the additional hops to verify the token on the server side. If the token was returned from GoogleSignIn, they themselves said that it could be trusted. https://developers.google.com/identity/protocols/oauth2/openid-connect#obtainuserinfo

I see that it is generally recommended to place the auth server between the client and the third-party but in this process the server is still between the client and auth server but only after the initial exchange from the client and third-party.

Questions,

1. In general am I missing something with this flow?

2. In this case would it be necessary to verify the token on the server side?

3. Is there some better way to approach this that I have completely overlooked?

4. Am I making this too complicated and UX should not be this much of a concern?

5. Instead of adding the provider and token to the additional parameters would it make more sense to pass it in the body of a post request? I don't see the issue with passing it via query string but that's also part of the reasoning for the authorization code grant from my understanding.

Apologies in advance for anything I have missed or omitted for brevity that should have been included.

Thanks.

I am trying to install React Native Firebase Mlkit to my existing iOS React Native app. My app is already using various Firebase packages (app, auth, firestore, etc.).

I am following the instructions from the guide. I tried both automatic and manual installation. But when I run pod install, I got this error:

i have the Invariant Violation: Native module cannot be null error and the 2nd error down below. I found online the issue might have to do with not having an ios folder in a module directory, i looked in each of the folders in the local system and on github with them all containing the ios folder

I have a react native app that it worked well until upgrade packages Actually after upgrade packages this permision added (android.permission.QUERY_ALL_PACKAGES) to manifest.please help me

this is first package.json

I am experiencing difficulty writing tests for react-native typescript screen using instructions from the URL below https://react-native-async-storage.github.io/async-storage/docs/advanced/jest/

I keep getting the below error

FAIL app/screens/login/login-screen.test.tsx ● Test suite failed to run

I have a login screen in the react-native mobile app. When a user enters the correct Email and password, then I store the jwt token in the react-native app, but not in the webview. After the login screen, I want to show a webview(Dashboard). How to skip the login screen because the user is already authenticated in react-native-app? How to pass the jwt token to webview so that the user does not need authentication again. Click to see code

hellow every one i migrated gitlab-ce into a new instance with new domain name using backup/restore

my problem : when i click a project it gives me "500 Whoops, something went wrong on our end "

i installed the same gitlab-ce version in the new host which is 13.6.2

my gitlab status

When I search the internet for react-native optimizations / best practices (Especially for FlatLists which are often greedy), I always find the advice not to use the arrow functions ... }.

Example 1 : https://reactnative.dev/docs/optimizing-flatlist-configuration#avoid-anonymous-function-on-renderitem :

Move out the renderItem function to the outside of render function, so it won't recreate itself each time render function called. (...)

Example 2 : https://blog.codemagic.io/improve-react-native-app-performance/ :

Avoid Arrow Functions : Arrow functions are a common culprit for wasteful re-renders. Don’t use arrow functions as callbacks in your functions to render views (...)

Example 3 : https://medium.com/wix-engineering/dealing-with-performance-issues-in-react-native-b181d0012cfa :

Arrow functions is another usual suspect for wasteful re-renders. Don’t use arrow functions as callbacks (such as click/tap) in your render functions (...)

I understand that it is recommended not to use arrow function (especially in onPress button and FlatList), and to put the components outside of the render if possible.

Good practice example :

Issue: This broke with no changes between days. Even though I have metro running npx react-native start when I run npx react-native run-android it starts it's own metro server and does not allow me to do "fast refresh" it basically installs the debug build of the app onto the device. I need it to fast refresh for development purposes. Already tried the steps on issue: Unable to load script from assets index.android.bundle on windows

To test and debug my android build for a react-native project I had an emulator running in one Powershell window, would start a metro server in a second Powershell window using npx react-native start then run the app in a third powershell window using npx react-native run-android it would go through the build and install the app, then it would "pass" the app to the react-native metro server then that would install it to the emulator. This would allow me to make changes to the code and "fast refresh" the application in the emulator/phone and logs got outputted to the Metro Server.

Versions (executed at project root folder)

npx react-native --version : 6.0.0

npx --version : 7.18.1

Setup:

First Powershell window: emulator -avd Galaxy_Nexus_Android9 -no-snapshot

Second Powershell window: Make sure abd device is running