[TIL/Coin Site Project] 2024/01/31

์›๋ฏผ๊ด€ยท2024๋…„ 1์›” 31์ผ

Coin Site Project

๋ชฉ๋ก ๋ณด๊ธฐ
26/31
post-thumbnail

4. Web Page -> Amazon API Gateway โœ๏ธ

Auth with API โ˜๏ธ

โœ… a) Amazon API Gateway์— ๋Œ€ํ•œ ์ธ์ฆ๋œ ์š”์ฒญ์„ ์–ด๋–ป๊ฒŒ ๋ณด๋‚ผ์ง€ ํ•™์Šตํ•ด์•ผ ํ•œ๋‹ค.

โœ… b) API ์š”์ฒญ์— ํ† ํฐ์„ ํฌํ•จํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ดํ•ดํ•ด์•ผ ํ•œ๋‹ค.

๐Ÿ”ด Access Token์„ ๋ณด๋‚ด๋Š” ๊ฒƒ์ด ํ•ต์‹ฌ

์ด๋ฒˆ ๋‹จ๊ณ„์—์„œ๋Š”, 'web page'์—์„œ Amazon API Gateway๋กœ ์ƒ์„ฑํ•œ 'API๋กœ' Access Token์„ ๋ณด๋‚ด์•ผ ํ•œ๋‹ค. ์—„๋ฐ€ํžˆ ๋งํ•˜์ž๋ฉด, ์ƒ์„ฑํ•œ API์™€ AWS Lambda๊ฐ€ ์—ฐ๋™๋˜์–ด ์žˆ๊ธฐ ๋•Œ๋ฌธ์—, Lambda๋กœ Access Token์„ ๋ณด๋‚ด์•ผ ํ•œ๋‹ค.

Lambda์—์„œ๋Š” Token์„ ๋ฐ›๊ณ  ๋‹ค์Œ ์ž‘์—…์„ ์ง„ํ–‰ํ•˜๊ฒŒ ๋  ๊ฒƒ์ด๋‹ค.

  1. Access Token Validation(status === 200?)
  2. Post 'Access Token' to Kakao API
  3. Retrieve User Email from Kakao API
  4. Post 'User Email' to AWS Cognito

API์™€ Lambda๋Š” ๋ฏธ๋ฆฌ ์—ฐ๊ฒฐ์„ ์™„๋ฃŒํ•œ ์ƒํƒœ์ด๋‹ค. ํ–ฅํ›„ ๋ฉ”์ธ ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•  ๋•Œ ์ „์ฒด์ ์ธ ๊ณผ์ •์„ ์ •๋ฆฌํ•  ๊ณ„ํš์ด๋‹ค.

์–ด์จŒ๋“  ์ง€๊ธˆ ํ•ด์•ผ ํ•  ์ž‘์—…์€, 'Invoke URL๋กœ Access Token์„ ๋ณด๋‚ด๊ณ , lambda์—์„œ ํ•ด๋‹น ํ† ํฐ์ด ์ž˜ ์ „๋‹ฌ๋˜์—ˆ๋Š”์ง€ ํ™•์ธํ•˜๋Š” ๊ฒƒ'์ด๋‹ค.

access token์„ ๋ฐ›์œผ๋ฉด home์œผ๋กœ ์ด๋™ํ•˜๋Š”๋ฐ, ์ด๋™๊ณผ ๋™์‹œ์— useLocation์— state๋กœ ํ† ํฐ์„ ๋‹ด์•„์„œ ์ „๋‹ฌํ–ˆ๋‹ค. realData์—๋Š” ํ† ํฐ์ด ์ž˜ ๋“ค์–ด๊ฐ”๋Š”๋ฐ, ๋ฌธ์ œ๋Š” API์—์„œ undefined๋กœ ๋‚˜์˜จ๋‹ค. ์˜ค๋Š˜์€ ๋„์ €ํžˆ ์ƒ๊ฐ์ด ๋‚˜์งˆ ์•Š๋Š”๋‹ค.

๐Ÿ™ ํšŒ๊ณ 

๊ธฐ๋Œ€ ์ด์ƒ์œผ๋กœ ๋Œ€๋‹จํ•œ ํ–‰์šด์ด ์ฐพ์•„์˜ค์ง€ ์•Š๋Š” ๊ฒƒ์ฒ˜๋Ÿผ, ๊ฑฑ์ •๋งŒํผ ์—„์ฒญ๋‚œ ๋ถˆํ–‰๋„ ์ž์ฃผ ์˜ค์ง€๋Š” ์•Š์„ ๊ฒƒ์ด๋ผ ๋ฏฟ๊ณ  ์‚ด์•„๊ฐ„๋‹ค.

๊ทธ๋ž˜์„œ ํŒ๋‹จํ•˜๊ธฐ๋ณด๋‹ค๋Š”, ๊ฐ๋‹นํ•˜๋Š” ์ชฝ์„ ํƒํ•˜๋Š” ํŽธ์ด๋‹ค. ์ž˜ ๋งž์ถ”์ง€๋„ ๋ชปํ•˜๋Š” ๊ณ„์‚ฐ๊ธฐ๋ฅผ ๋‘๋“œ๋ฆฌ๋Š” ๊ฒŒ ๋ฌด์Šจ ์˜๋ฏธ๊ฐ€ ์žˆ์„๊นŒ.

2์›”๋„ ๋ฉ‹์ง€๊ฒŒ ๊ฐ๋‹นํ•˜๊ธธ ์†Œ๋งํ•œ๋‹ค.

profile
Write a little every day, without hope, without despair โœ๏ธ

0๊ฐœ์˜ ๋Œ“๊ธ€