Tích hợp user pool cognitor vào api gateway – Step by step guide (cross account)

Yêu cầu

Có 2 tài khoản AWS, vì sẽ cần phải tạo Cognito user pool tại 1 tài khoản, tạo API tại 1 tài khoản khác

Link docs tham khảo: 

https://docs.aws.amazon.com/apigateway/latest/developerguide/apigateway-cross-account-cognito-authorizer.html

Bước 1: Tạo Cognito User Pools

a. Đăng nhập AWS Console, click Services Và chọn Cognito

b. Chọn Manage User Pools

c. Chọn Create a User Pool

d. Đặt tên cho user pool, ví du “WildRydes”, sau đó chọn Review Defaults

e. Tại page review, click Create pool

f. Ghi lại Pool Id và Pool ARN để dùng sau này.

Bước 2: Add App và User pool

Lưu ý từ AWS:

Client secrets aren’t currently supported with the JavaScript SDK. If you do create an app with a generated secret, delete it and create a new one with the correct configuration.

a. Từ page Pool Details, chọn App clients từ navigation bar.

b. Chọn Add an app client.

c. Đặt tên cho app, ví du “WildRydesWebApp”.

d. Bỏ check option Generate client secret option, còn lại để mặc định. Để cho đơn giản trong việc lấy token để test sau này, thì tick chọn Enable token revocation

e. Chọn Create app client.

f. Ghi lại App client id của app vừa tạo để dùng sau này.

Bước 3: Integrate app

a. Chọn App client settings trong navigation bar

b. Chọn Cognito User Pool trong phần Enabled Identity Providers

c. Nhập Callback URL và Signout URL, giả sử: https://example1.com/callback và https://example1.com/signout (Lưu ý: phải là https, có thể đặt call back là url API Gateway, demo nên tùy chọn)ở phần Sign in and sign out URLs

c. Ở phần Allowed OAuth Flows, tick chọn Authorization code grant, Implicit grant, bỏ qua Client credentials

d. Ở phần Allowed OAuth Scopes, có thể chọn hết các tùy chọn

Bước 4: Tạo domain name

a. Chọn Domain name ở navigation bar, ở dưới Amazon Cognito domain, cho 1 cái tên tùy thích, sau đó chọn Check availability, nếu báo là domain available thì OK

b. Chọn Save changes. (Lưu ý: không thích dùng domain provide bởi AWS thì có thể chọn Use your domain, nhưng nếu làm demo thì chọn của AWS cho dễ + đỡ config nhiều)

c. Chọn lại App client settings và chọn Launch Hosted UI

Lưu ý: Tham khảo ảnh màn hình sau khi đã thực hiện bước 3 và 4 ở file đính kèm tên cognito1.png __

Bước 5: Đăng ký user cho App

a. Sau khi chọn Launch Hosted UI ở bước trước, trình duyệt sẽ tự động nhảy ra 1 tab mới và yêu cầu thông tin đăng nhập. Chọn sign up. b. Cung cấp Username và email, password. Lưu ý: Phải là email thật, để còn nhận code verify tài khoản! c. Check mail lấy Verification Code và chọn Confirm Account.

Bước 6: Tạo một Rest API

a. Vào AWS Management Console, click Services và chọn API Gateway.

b. Chọn Create API, chọn nút Build ở REST API

c. Chọn New API và nhập tên, ví dụ “WildRydes” cho API Name, còn lại có thể để mặc định

e. Chọn Create API

Bước 7: Tạo Cognito User Pools Authorizer

a. Bên dưới API vừa tạo, chọn Authorizers.

b. Chọn Create New Authorizer.

c. Nhập “WildRydes” cho trường Authorizer name.

d. Chọn Cognito ở phần type.

e. Ở phần Cognito User Pool, dán arn của Cognito User Pool đã tạo

g. Nhập Authorization cho mục Token Source.

h. Chọn Create.

Bước 8: Tạo resource và method cho API:

a. Trong nav bar bên left, click vào chữ Resources dưới WildRydes API.

b. Từ Actions dropdown, chọn Create Resource.

c. Nhập “ride” trong phần Resource Name.

d. Đảm bảo phần Resource Path được set là ride.

e. Chọn Enable API Gateway CORS.

f. Click Create Resource.

g. Chọn resource /ride, từ Action dropdown, chọn Create Method.

h. Chọn GET từ dropdown, sau đó click vào icon checkmark.

i. CHọn Lambda Function cho integration type. (Nếu chưa có sẵn 1 Lambda function, thì có thể tạo 1 Lambda function đơn giản, chỉ cần trả về Hello thôi cũng OK)

j. Chọn box Use Lambda Proxy integration.

k. Chọn region.

l. Nhập tên Lambda function.

m. Chọn Save.

n. Khi nhảy ra pop up yêu cầu cấp Amazon API Gateway permission để invoke function, chọn OK.

o. Chọn card Method Request.

Chọn biểu tượng cái bút chì bên cạnh chữ Authorization.

q. Chọn “WildRydes” Cognito user pool authorizer từ drop-down list, sau đó click icon check checkmark.

Bước 9: Deploy API

a. Ở Actions drop-down list, chọn Deploy API.

b. Chọn [New Stage] ở Deployment stage drop-down list.

c. Nhập “prod” for the Stage Name.

d. Chọn Deploy.

e. Ghi lại Invoke URL để dùng sau này.

Bước 10: Lấy access token để test

a. Quay lại màn hình manage cognito, chọn App client setting ở navigation pane, và click vào Launch Hosted UI

b. Khi nhảy sang tab đăng nhập, lưu ý nhìn trên thanh URL sẽ có dạng link như này: 

https://cogdemoaaa.auth.ap-northeast-1.amazoncognito.com/login?client_id=2dqsidi23cijtg7vt2p1aldrgd&response_type=code&scope=aws.cognito.signin.user.admin+email+openid+phone+profile&redirect_uri=https://example1.com/callback

c. Sửa đoạn response_type=code&scope thành response_type=token&scope và nhấn enter, đăng nhập.

d. Sau khi đăng nhập thành công, bạn có thể copy thanh hiển thị URL, sẽ được dạng như sau:

https://example1.com/callback#id_token=eyJraWQiOiI3RU9zaU9TSUdmdzlzV0gxYzE2VjVTUHNQNXIzTEIrd21CTHNoNEVrRklVPSIsImFsZyI6IlJTMjU2In0.eyJhdF9oYXNoIjoiMFQ0YlJ1QzViSTJldEV5a1RkMlVqUSIsInN1YiI6IjBkZTU0NTAwLWQxZDgtNGY5NS05MTNkLWMzODNkYjI1ZjAxMCIsImF1ZCI6IjVkcnFpMmcwa3RkZ2gwamw0cDgxb3BtYTRuIiwiZW1haWxfdmVyaWZpZWQiOnRydWUsInRva2VuX3VzZSI6ImlkIiwiYXV0aF90aW1lIjoxNjM3MzA0MDQ3LCJpc3MiOiJodHRwczpcL1wvY29nbml0by1pZHAuYXAtbm9ydGhlYXN0LTEuYW1hem9uYXdzLmNvbVwvYXAtbm9ydGhlYXN0LTFfTlhTM05KeTRyIiwiY29nbml0bzp1c2VybmFtZSI6InllbnR0aCIsImV4cCI6MTYzNzMwNzY0NywiaWF0IjoxNjM3MzA0MDQ3LCJqdGkiOiJlY2E3ZGFiMS05NGFjLTRjZWItOGM5MC0yNTI3YWRjNTcwODYiLCJlbWFpbCI6InRyaW5oaGFpeWVuNzlAZ21haWwuY29tIn0.hZAOHFnmUlc50WhJAM-JmiqmuFHnnhnOzQbXRD842Fj-zpSutLbWy-VZ9Dm91rOpV5RlMuRxGuCrzoCP9vS9f1DfcKw1Y4bSjh_HWWsDO8zK2tXlq9guBQQIws-IQJunZa0SYXWgZUMhsvE9XX6WVBF6SBvfow_63liB25J1eEBjUShw84o-pWtwSaSIvcTbo1xxYxfvgW4jAsxNO3YU0K7iRdmHPUeNeYeCxo0MVInQ3o-qiLEVJxfpnFG-lm1SxEt8iLw9qHh8UuryBSxdpafDhgeTiaalA-AlaXUOZaupTbXL9KB5pt2QU-UD4fL3JltfBJnbrP7ESi-SZD_LhQ&access_token=eyJraWQiOiJubVZkNHdGNWM1WDBscDZYVFl4K2JIWXR0MVQ4OTJnZFZKM0drNUZvTlEwPSIsImFsZyI6IlJTMjU2In0.eyJzdWIiOiIwZGU1NDUwMC1kMWQ4LTRmOTUtOTEzZC1jMzgzZGIyNWYwMTAiLCJ0b2tlbl91c2UiOiJhY2Nlc3MiLCJzY29wZSI6ImF3cy5jb2duaXRvLnNpZ25pbi51c2VyLmFkbWluIHBob25lIG9wZW5pZCBwcm9maWxlIGVtYWlsIiwiYXV0aF90aW1lIjoxNjM3MzA0MDQ3LCJpc3MiOiJodHRwczpcL1wvY29nbml0by1pZHAuYXAtbm9ydGhlYXN0LTEuYW1hem9uYXdzLmNvbVwvYXAtbm9ydGhlYXN0LTFfTlhTM05KeTRyIiwiZXhwIjoxNjM3MzA3NjQ3LCJpYXQiOjE2MzczMDQwNDcsInZlcnNpb24iOjIsImp0aSI6ImYwMWE2NzY5LTRjYWYtNDE5MC1hMTRlLWU3ZGFiNGViNDRiYSIsImNsaWVudF9pZCI6IjVkcnFpMmcwa3RkZ2gwamw0cDgxb3BtYTRuIiwidXNlcm5hbWUiOiJ5ZW50dGgifQ.b3XCUQrSbJM8gIC0OE5y7h444FoNEA7ixod1Z9UdDTF6a7nisRt0BbiooIAKnuviYNzHYO7teXdiQnLCcn5aQ5jOQdSWxE6nJqXHHAHVzqlDIAyzocmYpIlC2pRhLRDqQuDh3ZbdRWsq9hLp7x1fmCYa88LDh86z8-rJnAl-5jhTxowgofOlSP-1ag1oZphZIo8gPodPosxhsATxU9FSV2SgqANdbj4P-IpLhUzUVAaUKU982G1wdRsC5gpZo_7ZKdOANDZ203QlNm55Gc7GkVN7MnCs66zgDdH92N3cehVSIcIwD-6dBcBAvs8J2Ibq1loSx2xQJYAtsWY1MhnIow&expires_in=3600&token_type=Bearer

Tìm từ access_token=, và copy hết token, dán ra 1 chỗ riêng để dùng. Đây chính là access token mà bạn có thể dùng để test việc integrate Cognito của bạn. Việc còn lại chỉ là dán token vào, và test, easy life! 

Kết quả testing của guide này, bạn có thể tham khảo tệp đính kèm tên cognito2.png

Done! Cognito hóa ra cũng dễ chứ không khó chút nào! Cross account của AWS lại càng dễ, thay vì chọn trực tiếp, thì ta dán ARN vào giống như cách ta làm cross-account cho IAM hoặc S3 là xong

Cognito1.png:

Cognito2.png: