Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SPAとWebアプリケーションでCognitoの使い方はどう変わるのか? / How do w...

SPAとWebアプリケーションでCognitoの使い方はどう変わるのか? / How do we use cognito with SPA and web applications?

Avatar for Kitano Yuichi

Kitano Yuichi

July 29, 2022
Tweet

More Decks by Kitano Yuichi

Other Decks in Technology

Transcript

  1. 41"ͱ͸  w ୯ҰͷϖʔδͰ8FCΞϓϦέʔγϣϯΛ 
 ߏ੒͢ΔγεςϜ w ௨ৗKBWBTDSJQUʢ3FBDU 7VFʣΛར༻ͯ͠ಈతʹ 


    දࣔɺϖʔδભҠΛ੍ޚ͢ΔɻϩάΠϯϢʔβʔͷ 
 ݸผσʔλ͸όοΫΤϯυ"1*͔Βಈతʹऔಘ͢Δɻ
  2. 41"ͷ"84ߏ੒ྫ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    41"༻ͷ ੩తϖʔδऔಘ ೝূτʔΫϯ όοΫΤϯυ"1*΁ ಈతΞΫηε ʢ*".ೝՄʣ $PHOJUP *%ϓʔϧ "84Ұ࣌ ΫϨσϯγϟϧΩʔऔಘ
  3. 41"ͷೝূͷྲྀΕᶃ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ 41"༻ͷ ੩తϖʔδऔಘ ϩάΠϯը໘ͷදࣔ
  4. 41"ͷೝূͷྲྀΕᶄ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ KBWBTDSJQUͰಈతʹ Ϣʔβʔ*%ύεϫʔυʹ ج͍ͮͨೝূϑϩʔͷ࣮ߦ ֤छτʔΫϯΛऔಘͯ͠อଘ
  5. 41"ͷೝূͷྲྀΕᶅ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ KBWBTDSJQUͰಈతʹ *%τʔΫϯ͔Β"84Ұ࣌ ΫϨσϯγϟϧΩʔͷऔಘ
  6. 41"ͷೝূͷྲྀΕᶆ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ KBWBTDSJQUͰಈతʹ "84Ұ࣌ΫϨσϯγϟϧΩʔ͔Β 4JH7ॺ໊Λ࡞੒ όοΫΤϯυ"1*΁ϦΫΤετ
  7. 41"ͷ)PTUFE6*ͷೝূͷྲྀΕᶃ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ 41"༻ͷ ੩తϖʔδऔಘ ϩάΠϯը໘ϦμΠϨΫτ Ϙλϯͷදࣔ
  8. 41"ͷ)PTUFE6*ͷೝূͷྲྀΕᶄ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ ʢ)PTUFE6*ʣ "1*(BUFXBZ BNQMJGZKT 64&3

    -BNCEB $PHOJUP *%ϓʔϧ 0"VUIೝূϑϩʔͷ։࢝ )PTUFE6*΁ϦμΠϨΫτ Ϣʔβʔ*%ύεϫʔυΑΔϩάΠϯޙ ೝՄίʔυͱ͋Θͤͯݩͷը໘΁ϦμΠϨΫτ
  9. 41"ͷ)PTUFE6*ͷೝূͷྲྀΕᶅ  $MPVE'SPOU 4 "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB $PHOJUP *%ϓʔϧ

    KBWBTDSJQUͰಈతʹ ϦμΠϨΫτʹΑΓड͚औͬͨೝՄίʔυΛݩʹ ֤छτʔΫϯΛ$PHOJUP͔Βऔಘͯ͠อଘ $PHOJUP Ϣʔβʔϓʔϧ
  10. 41"ͷ)PTUFE6*ͷೝূͷྲྀΕᶆ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ KBWBTDSJQUͰಈతʹ *%τʔΫϯ͔Β"84Ұ࣌ ΫϨσϯγϟϧΩʔͷऔಘ
  11. 41"ͷ)PTUFE6*ͷೝূͷྲྀΕᶇ  $MPVE'SPOU 4 $PHOJUP Ϣʔβʔϓʔϧ "1*(BUFXBZ BNQMJGZKT 64&3 -BNCEB

    $PHOJUP *%ϓʔϧ KBWBTDSJQUͰಈతʹ "84Ұ࣌ΫϨσϯγϟϧΩʔ͔Β 4JH7ॺ໊Λ࡞੒ όοΫΤϯυ"1*΁ϦΫΤετ
  12. Public subnet ैདྷܕ8FCαΠτͷ"84ߏ੒ྫ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ηογϣϯͰ ϢʔβʔΛࣝผ ೝূτʔΫϯ ηογϣϯ%#
  13. Public subnet ैདྷܕ8FCαΠτͷೝূͷྲྀΕᶃ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ αʔόʔଆͰϩάΠϯը໘ͷੜ੒ ϩάΠϯը໘ͷදࣔ
  14. Public subnet ैདྷܕ8FCαΠτͷೝূͷྲྀΕᶄ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ Ϣʔβʔ*%ύεϫʔυͷೖྗ 'PSNͰαʔόʔ΁1PTU
  15. Public subnet ैདྷܕ8FCαΠτͷೝূͷྲྀΕᶅ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ Ϣʔβʔ*%ύεϫʔυʹ ج͍ͮͨೝূϑϩʔͷ࣮ߦ ֤छτʔΫϯΛऔಘ
  16. Public subnet ैདྷܕ8FCαΠτͷೝূͷྲྀΕᶆ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ औಘ֤ͨ͠छτʔΫϯΛ ηογϣϯ৘ใͱඥ෇͚ͯ ηογϣϯ%#΁อଘ
  17. Public subnet ैདྷܕ8FCαΠτͷೝূͷྲྀΕᶇ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ϩάΠϯޙը໘ͷදࣔ ηογϣϯͰϢʔβʔࣝผ
  18. Public subnet ʲ࠶ܝʳैདྷܕ8FCαΠτͷೝূͷྲྀΕᶅ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ Ϣʔβʔ*%ύεϫʔυʹ ج͍ͮͨೝূϑϩʔͷ࣮ߦ ֤छτʔΫϯΛऔಘ 41"Ͱ͸BNQMJGZKT͕ೝূϑϩʔΛ ͏·͍͜ͱ࣮ߦͯ͘͠Ε·ͨ͠ɻ ैདྷܕ8FCαΠτͰ͸ೝূϑϩʔΛཧղ͠ɺ ೝূϑϩʔʹԊͬͯࣗ෼Ͱ࣮૷͢Δ ඞཁ͕͋Γ·͢ɻ
  19. $PHOJUPͷೝূϑϩʔൈਮ  ೝূϑϩʔ໊ આ໌ "%.*/@64&3@1"44803%@"65) ʢچশɿ"%.*/@/0@431@"65)ʣ αʔόʔ͔Β࣮ߦ͢Δ͜ͱΛ૝ఆͨ͠ύεϫʔυΛૹͬͯೝূ͢Δೝূϑϩʔɻ ௨ৗΫϥΠΞϯτγʔΫϨοτΛ࢖༻͢Δɻ 64&3@431@"65) ΫϥΠΞϯτʢ41"౳ʣ͔Β࣮ߦ͢Δ͜ͱΛ૝ఆͨ͠431ϓϩτίϧͰύεϫ

    ʔυΛجʹͨ͠νϟϨϯδϨεϙϯεΛૹΓ͍͋ೝূ͢Δೝূϑϩʔɻ BNQMJGZKT͕σϑΥϧτͰ࢖༻͢Δɻ 64&3@1"44803%@"65) ΫϥΠΞϯτʢ41"౳ʣ͔Β࣮ߦ͢Δ͜ͱΛ૝ఆͨ͠ύεϫʔυΛૹͬͯೝূ͢ Δೝূϑϩʔɻ ΫϥΠΞϯτʢ41"౳ʣ͔Βͷ࣮ߦ͸643@431@"65)ͷར༻͕ਪ঑͞ΕΔɻ $6450.@"65) ೝূ࣌ʹ-BNCEBϑΝϯΫγϣϯ͕τϦΨʔ͞Εɺࣗ෼ͰೝূϑϩʔΛࣗ༝ʹ ઃఆͰ͖Δೝূϑϩʔɻ
  20. "%.*/@64&3@1"44803%@"65)ϑϩʔ  &$ $PHOJUP Ϣʔβʔϓʔϧ "ENJO*OJUJBUF"VUI TFDSFU@IBTI#BTF )."$@4)" $PHOJUP ϢʔβʔϓʔϧͷγʔΫϨοτΩʔ

    ϩάΠϯϢʔβʔ໊  $PHOJUPϢʔβʔϓʔϧͷΫϥΠΞϯτ*%   DPHOJUPBENJO*OJUJBUF"VUI \ "VUI'MPXb"%.*/@64&3@1"44803%@"65)`  6TFS1PPM*E$PHOJUPϢʔβʔϓʔϧͷϢʔβʔϓʔϧ*%  $MJFOU*E$PHOJUPϢʔβʔϓʔϧͷΫϥΠΞϯτ*%  "VUI1BSBNFUFST\ 64&3/".&ϩάΠϯϢʔβʔ໊  1"44803%ύεϫʔυ  4&$3&5@)"4)TFDSFU@IBTI  ^  ^ \ "VUIFOUJDBUJPO3FTVMU\ "DDFTT5PLFOʜ  &YQJSFT*Oʜ  5PLFO5ZQFb#FBSFS`  3FGSFTI5PLFOʜ  *E5PLFOʜ  ^  ʜ  ^ ֤छτʔΫϯ
  21. ۩ମతͳ4&$3&5@)"4)ͷܭࢉํ๏ʢQZUIPOʣ  ʲҾ༻ʳ"NB[PO$PHOJUPͷʮΫϥΠΞϯτͷγʔΫϨοτͷϋογϡΛݕূͰ͖·ͤΜʯͱ͍͏ΤϥʔΛղܾ͢Δ IUUQTBXTBNB[PODPNKQQSFNJVNTVQQPSULOPXMFEHFDFOUFSDPHOJUPVOBCMFUPWFSJGZTFDSFUIBTI import sys import hmac, hashlib, base64

    username = sys.argv[1] app_client_id = sys.argv[2] key = sys.argv[3] message = bytes(sys.argv[1]+sys.argv[2],'utf-8') key = bytes(sys.argv[3],'utf-8') secret_hash = base64.b64encode(hmac.new(key, message, digestmod=hashlib.sha256).digest()).decode() print("SECRET HASH:",secret_hash) python3 secret_hash.py <<ϩάΠϯϢʔβʔ໊>> <<CognitoϢʔβʔϓʔϧͷΫϥΠΞϯτ ID>> <<CognitoϢʔβʔϓʔϧͷΫϥΠΞϯτγʔΫϨοτ>> secret_hash.py
  22. ʲ༨ஊᶄʳ"ENJO"1*ͱඇ"ENJO"1*  w $PHOJUPͷ"1*͸ಛघ w "ENJO"1*͸ଞͷαʔϏεͱಉ༷*".3PMFͷΫϨσϯγϟϧͰ࣮ߦ w ྫɿ"ENJO*OJUJBUF"VUI "ENJO(FU6FTS w

    ඇ"ENJO"1*͸$PHOJUPϢʔβʔͷΞΫηετʔΫϯͰ࣮ߦͯ͠ɺ ͦͷϢʔβʔͷΈૢ࡞Ͱ͖Δ w ৽نϢʔβʔΛ࡞੒͢Δ4JHO6Q΍ɺ 
 ೝূͯ͠τʔΫϯΛऔಘ͢Δ*OJUJBUF"VUI͸ྫ֎ͰΞΫηετʔΫϯෆཁ w ྫɿ(FU6TFS
  23. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶃ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ αʔόʔଆͰϩάΠϯը໘ͷੜ੒ ϩάΠϯը໘ϦμΠϨΫτϘλϯͷදࣔ 
  24. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶄ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUPϢʔβʔϓʔϧ ʢ)PTUFE6*ʣ 0"VUIೝূϑϩʔͷ։࢝ )PTUFE6*΁ϦμΠϨΫτ Ϣʔβʔ*%ύεϫʔυΑΔϩάΠϯޙ ೝՄίʔυͱ͋Θͤͯ$BMMCBDL63-΁ϦμΠϨΫτ
  25. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶅ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ $BMMCBDL63-΁ͷϦμΠϨΫτʹΑΓ ೝՄίʔυΛαʔόʔ΁౉͢ DBMMCBDL
  26. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶆ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ೝՄίʔυΛݩʹ ֤छτʔΫϯΛऔಘ
  27. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶇ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ औಘ֤ͨ͠छτʔΫϯΛ ηογϣϯ৘ใͱඥ෇͚ͯ ηογϣϯ%#΁อଘ
  28. Public subnet ैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶈ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ϩάΠϯޙը໘΁ϦμΠϨΫτͯ͠දࣔ ηογϣϯͰϢʔβʔࣝผ IFMMP
  29. Public subnet ʲ࠶ܝʳैདྷܕ8FCαΠτͷ)PTUFE6*ͷೝূͷྲྀΕᶄ  64&3 VPC Private subnet Private subnet

    "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUPϢʔβʔϓʔϧ ʢ)PTUFE6*ʣ 0"VUIೝূϑϩʔͷ։࢝ )PTUFE6*΁ϦμΠϨΫτ Ϣʔβʔ*%ύεϫʔυΑΔϩάΠϯޙ ೝՄίʔυͱ͋Θͤͯ$BMMCBDL63-΁ϦμΠϨΫτ 41"Ͱ͸BNQMJGZKT͕0"VUIೝূϑϩʔΛ ͍͍ײ͡ʹ࣮ߦͯ͘͠Ε·ͨ͠ɻ ैདྷܕ8FCαΠτͰ͸0"VUIೝূϑϩʔΛཧղ͠ɺ 0"VUIೝূϑϩʔʹԊͬͯࣗ෼Ͱ࣮૷͢Δ ඞཁ͕͋Γ·͢ɻ
  30. $PHOJUPͷ0"VUIೝূϑϩʔ  0"VUIೝূϑϩʔ໊ આ໌ "VUIPSJ[BUJPODPEFHSBOU ʢೝՄίʔυͷڐՄʣ جຊతʹ࢖༻͕ਪ঑͞ΕΔϑϩʔɻ ैདྷܕ8FCαΠτͷΑ͏ʹαʔόʔΛ஥հͯ͠τʔΫϯΛऔಘ͢Δ৔߹͸ɺ ௨ৗΫϥΠΞϯτγʔΫϨοτΛઃఆͯ͠ར༻͢Δɻ 41"ͷΑ͏ʹϢʔβʔ͕τʔΫϯΛ௚઀औಘ͢Δ৔߹͸1,$&Λซ༻͢Δ͜

    ͱ͕ਪ঑͞ΕΔɻ *NQMJDJUHSBOU ʢ҉໧తͳڐՄʣ "VUIPSJ[BUJPODPEFHSBOUͷ࢖༻͕ෆՄೳͳ৔߹બ୒͢Δɻ 
 1,$&Λซ༻ͨ͠"VUIPSJ[BUJPODPEFHSBOUͷ࢖༻͕ਪ঑͞ΕΔɻ $MJFOUDSFEFOUJBMHSBOU ʢΫϥΠΞϯτೝূ৘ใͷڐՄʣ ϚγϯؒͷτʔΫϯަ׵͢Δࡍʹ࢖༻͢Δೝূϑϩʔɻ 
 ࠓճͷΑ͏ͳΤϯυϢʔβʔ͕ೝূʹ࢖͏ϑϩʔͰ͸ͳ͍ɻ
  31. Public subnet ʲ൪֎ʳ"-# $PHOJUPೝূͷ"84ߏ੒ྫ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ೝূ࿈ܞ ηογϣϯ%#
  32. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶃ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ "-#΁ΞΫηε 0"VUIೝূϑϩʔͷ։࢝ )PTUFE6*΁ϦμΠϨΫτ
  33. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶄ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ Ϣʔβʔ*%ύεϫʔυΑΔϩάΠϯޙ ೝՄίʔυͱ͋Θͤͯ "-#ͷ$BMMCBDL63-΁ϦμΠϨΫτ
  34. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶅ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ $BMMCBDL63-΁ͷϦμΠϨΫτʹΑΓ ೝՄίʔυΛ"-#΁౉͢
  35. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶆ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ೝՄίʔυΛݩʹ֤छτʔΫϯΛऔಘ
  36. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶇ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ औಘ֤ͨ͠छτʔΫϯΛ ηογϣϯ৘ใͱඥ෇͚ͯอଘ "-#ͷηογϣϯ%# ͷ༷ͳ΋ͷ
  37. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶈ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ ΞΫηετʔΫϯɺϢʔβʔ৘ใʢTVCΫϨʔϜ౳ʣΛ )551ϔομʔʹ௥Ճͯ͠&$΁ΞΫηε "-#ͷηογϣϯ%# ͷ༷ͳ΋ͷ
  38. Public subnet "-# $PHOJUPೝূͷೝূͷྲྀΕᶉ  64&3 VPC Private subnet Private

    subnet "VSPSB &MBTUJ$BDIF &$ "-# $PHOJUP Ϣʔβʔϓʔϧ αʔόʔ͕ը໘Λੜ੒ ϩάΠϯޙը໘Λදࣔ "-#ͷηογϣϯ%# ͷ༷ͳ΋ͷ