React Native에 AWS Amplify 설정하기

로그인

https://github.com/aws-samples/aws-amplify-auth-starters/blob/react-native/src/nav/auth/Auth.js

https://dev.to/bastianbavaresco/social-authentication-with-aws-amplify-and-react-native-18op

 

이름 얻기

https://github.com/aws-amplify/amplify-cli/issues/2534

 

 

 

 

아래 Getting Started를 참고했다.

https://aws-amplify.github.io/docs/js/start?platform=react-native

Getting Started

Step 1. Create a New App 👌

Step 2, 3은 backend 하시는 분이 설정했을 것으로 믿고 진행!

-> aws-exports.js라는 파일이 꼭 필요한 것 같다... 정보를 더 달라고 요청해보자

identity_pool_id 추가

oauth에 domain 추가 후 redirectSignIn, redirectSignOut은 localhost:3000

 

Step 4. Integrate into your app 🤔

-> 예제가 마땅치 않아 자세히 나와있는 예제를 참고했다▼

https://aws-amplify.github.io/docs/js/authentication#authentication

Authentication

FB, Google 로그인은 환경설정이 필요해보여서 User Pool은 만들어두었기 때문에

Cognito User Pool 기본 로그인을 사용해보려고 한다.

위 링크의 Manual Setup에서 aws-exports.js 파일 대신 정보를 적어주면 될 것 같음.

 

그 다음에 React App을 빌드하기 위해 어떻게 AWS Amplify를 사용하는지 알려주는 문서를 참고해 봤다.

https://aws-amplify.github.io/docs/js/react

React & React Native

Add Auth

withAuthenticator 함수를 사용해서 App 인증을 하도록 도와주는 듯 하다.

 

SignUp component는 user가 회원가입을 할 수 있도록 한다.

sign up config에서 우리 앱에 회원가입한다고 표시할 수 있음!

둘 중 하나를 사용하면 됨. 
<Authenticator signUpConfig={ signUpConfig }/>

난 이걸 사용했다▼
export default withAuthenticator(App, { signUpConfig });

 

요 화면을 설정 한 것임!

 

AWS에서 알려주는 건 여기까지 이해했고ㅜㅜ

 

https://dev.to/aws/the-complete-react-native-guide-to-user-authentication-with-the-amplify-framework-ib2

 

 

다른 사람이 한 걸 참고했다.

https://itnext.io/aws-amplify-react-native-authentication-full-setup-7764b452a138

AWS Amplify + React Native / Authentication 🔐 FULL SETUP

Part 1 👌

Part 2 🤔

 

 

https://stackoverflow.com/questions/11485271/google-oauth-2-authorization-error-redirect-uri-mismatch

여기를 보니 provider와 함께 code를 넘기라는 얘기가 있어서 federatedSignIn에 추가해봤다 👌

 

 

https://thedistance.co.uk/react-native-2/how-to-set-up-aws-cognito-and-react-native-to-enable-federated-sso-part-2/

https://github.com/aws-amplify/amplify-js/issues/3210

https://reactnativeseoul.org/t/aws-cognito-federated-oauth/462

https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-app-idp-settings.html

https://thedistance.co.uk/react-native-2/setting-up-aws-cognito-and-react-native-to-enable-federated-sso/

 

 

---

 

일반적인 자격증명 예제▼

https://aws-amplify.github.io/docs/js/authentication#common-authentication-use-cases

 

로그인

user가 로그인 상태인지 아닌지를 확인한 뒤에 sign in을 불러오도록 한다.

확인하는 과정을 challenge라고 부른다.

user의 challenge 상태를 challengeName에서 확인할 수 있다.

 

1) MFA 상태

user가 SMS나 OTP token을 입력하도록 함.

 

 

 

 

외부 사용자 인증은 이걸 참고해보자

https://dev.to/aws/the-complete-react-native-guide-to-user-authentication-with-the-amplify-framework-ib2

https://serverless-stack.com/chapters/facebook-login-with-cognito-using-aws-amplify.html

https://aws-amplify.github.io/docs/js/authentication#using-components-from-aws-amplify-react

https://github.com/aws-amplify/amplify-js/issues/4621

https://github.com/aws-amplify/amplify-js/issues/3302

 

aws authentication API

https://aws-amplify.github.io/amplify-js/api/classes/authclass.html

 

linking?? 나중에 배포할 때 필요한 것 같음

https://facebook.github.io/react-native/docs/linking

 

모르는 에러

https://stackoverflow.com/questions/37438879/unable-to-verify-secret-hash-for-client-in-amazon-cognito-userpools

 

요것도 참고참고

https://www.kode24.no/guider/making-a-mobile-app-with-react-native-and-aws-amplify/70918282

 

redirect_url_mismatch error생김ㅜ

https://github.com/aws-amplify/amplify-js/issues/3584

https://stackoverflow.com/questions/11485271/google-oauth-2-authorization-error-redirect-uri-mismatch