aws-samples / amazon-cognito-passwordless-auth

Passwordless authentication with Amazon Cognito: FIDO2 (WebAuthn, support for Passkeys), Magic Link, SMS OTP Step Up
Apache License 2.0
359 stars 63 forks source link

React Native Support #88

Open S-Voss opened 1 year ago

S-Voss commented 1 year ago

I have been trying to use this library for two days to setup WebAuthn for mobile applications using React Native.

What do I possibly need to use for RP ID in the App.tsx configuration? I keep getting Failed to list credentials: [Error: Missing RP ID] when executing the fido2StartCreateCredential function. What do I need to do? Is it because I don't have Cognito configured to use Custom Domains?

I have tried every URL and ID in the AWS console regarding API GW and Cognito for the past two days. This is extremely frustrating the documentation falls just short of explaining how to use this repo for mobile applications. Can someone point me in the right direction?

ottokruse commented 1 year ago

Hi @S-Voss sorry to hear it's not working out for you.

You should configure the RP ID (Relying Party ID) when you call Passwordless configure:

Passwordless.configure({
  ...otherconfig,
  fido2: {
    baseUrl: "my base URL from the CFN outputs",
    authenticatorSelection: {
      userVerification: "required",
    },
    rp: {
      id: "my.domain.com"
    }
})

Providing RP ID like that is mandatory for RN but not for Web which is why it's not documented I guess (oversight), we should add it to the RN docs asap.

ottokruse commented 1 year ago

cc @EricBorland We really need a good end-to-end test for RN to have an example for people to follow, besides just having the docs.

S-Voss commented 1 year ago

That would be awesome @ottokruse. Once I can get this running end-to-end locally I plan to take a shot at the deep linking configuration as our clients prefer that experience quite often.

For the website should I use the domain I've associated with API Gateway or the S3 bucket domain that is serving my apple-app-site-association?

EricBorland commented 1 year ago

cc @EricBorland We really need a good end-to-end test for RN to have an example for people to follow, besides just having the docs.

Agree, I'll work on it these weeks

ottokruse commented 1 year ago

@S-Voss RP ID is usually the domain at which you serve your website and for a React Native app it would be the associated domain where you serve your .well-known/apple-app-site-association JSON config file from.

S-Voss commented 1 year ago

@EricBorland, I'd be happy to connect to discuss what I've learned so far but I still can't get a working Fido2 auth experience using AWS. I'm now in a block-box error state with react-native-passkey throwing:

Object {
  "error": "RequestFailed",
  "message": "The request failed. No Credentials were returned.",
}

...or at least I believe it is react-native-passkey.

EricBorland commented 1 year ago

Hey @S-Voss happy to connect too, maybe sometime next week. Few questions: 1) Are you on Android or iOS? 2) Using Expo?

Current version only supports iOS and non-expo projects. I'm working on upgrading the integration to support Android too and also adding an e2e example on this repo on how to use it with React Native. Expo support, however, will have to wait until Expo releases their native passkey implementation.

If you want, you can also share your config and relevant pieces of code and I'll review and compare with ours.

S-Voss commented 1 year ago

@EricBorland let me generalize my solution and I'll cut a PR. I'm currently also only supporting iOS + bare RN (0.72.4) so worked out great! Hopefully you all started this project post-Fabric architecture migration :)

Android support is next on my list as well so perhaps we can divide and conquer? Next week works great.

Thanks gents!

S-Voss commented 12 months ago

I've traced it down to the react-native-passkey library. It fails by throwing:

Object { "error": "RequestFailed", "message": "The request failed. No Credentials were returned.", }

I'm not sure if that is because my request is incorrect, my iOS simulator is an issue or something else. I can confirm that I'm getting a 200 status up to that point but the phone fails when calling Passkey.register() without prompting sign-in. I also noticed react-native-passkey is up to 2.0.0 but I also rolled back and it didn't work (I say that b/c it's a breaking change).

If I rollback to version 1.1.1 as in the sample the error I get instead is:

Object { "error": "RequestFailed", "message": "Unknown error has occurred.", }

KelvinPortuphy commented 12 months ago

[like] Kelvin Portuphy reacted to your message:


From: Stephen @.> Sent: Wednesday, September 6, 2023 1:51:51 AM To: aws-samples/amazon-cognito-passwordless-auth @.> Cc: Subscribed @.***> Subject: [aws-samples/amazon-cognito-passwordless-auth] React Native Support (Issue #88)

I have been trying to use this library for two days to setup WebAuthn for mobile applications using React Native.

What do I possibly need to use for RP ID in the App.tsx configuration? I keep getting Failed to list credentials: [Error: Missing RP ID] when executing the fido2StartCreateCredential function. What do I need to do? Is it because I don't have Cognito configured to use Custom Domains?

I have tried every URL and ID in the AWS console regarding API GW and Cognito for the past two days. This is extremely frustrating the documentation falls just short of explaining how to use this repo for mobile applications. Can someone point me in the right direction?

— Reply to this email directly, view it on GitHubhttps://github.com/aws-samples/amazon-cognito-passwordless-auth/issues/88, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AYMNIK4WES5NQUMNMB57NN3XY7JLPANCNFSM6AAAAAA4MS3ODA. You are receiving this because you are subscribed to this thread.Message ID: @.***>

asimaranov commented 8 months ago

I've traced it down to the react-native-passkey library. It fails by throwing:

Object { "error": "RequestFailed", "message": "The request failed. No Credentials were returned.", }

I'm not sure if that is because my request is incorrect, my iOS simulator is an issue or something else. I can confirm that I'm getting a 200 status up to that point but the phone fails when calling Passkey.register() without prompting sign-in. I also noticed react-native-passkey is up to 2.0.0 but I also rolled back and it didn't work (I say that b/c it's a breaking change).

If I rollback to version 1.1.1 as in the sample the error I get instead is:

Object { "error": "RequestFailed", "message": "Unknown error has occurred.", }

Hi. Have you solved the issue? What was the problem? Faced the same issue on IOS

ottokruse commented 8 months ago

FYI React Native support was reworked in #103 but this PR has been stale for a while and needs tweaks (one issue we found was a race condition during magic link sign-in, that raised a sign-in error sometimes)

If you're (very) brave you could try the code from that PR. We need someone to champion that PR again and bring it to a state where we can merge it.

PedroOrtegaEarnest commented 3 months ago

Hi @ottokruse wanted to ask you if this now currently supports Android? Or that is still in progress. I saw some comments on other PRs on the upgrade from react-native-passkey now handling android passkeys as well. Thanks for all the info provided in this issue!

ottokruse commented 3 months ago

Hi @PedroOrtegaEarnest TBH I'm not sure. Need to look into again but have been swamped

robb216 commented 3 months ago

In addition, for the demo to work, ALLOW_USER_PASSWORD_AUTH has to be enabled on the user pool client, since magic link is not supported.

Unfortunately I also ran into the Unknown error has occurred when I try to call fido2CreateCredential. A working iOS example would be greatly appreciated!

S-Voss commented 2 months ago

Has there been any recent progress on this? I'm getting all sorts of errors in the latest release. Seems like the exports are not working in React Native.

ottokruse commented 2 months ago

No progress yet unfortunately. We need to get PR #103 updated and merged, and to have a working ReactNative example app in this repo.