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

Auth0ハンズオンウェビナー資料

suwa yuki
March 04, 2020

 Auth0ハンズオンウェビナー資料

2020年3月に、認証認可プラットフォーム「Auth0」のハンズオンウェビナーを開催しました。そのウェビナーの資料です。

ブログとあわせてご覧ください。
https://dev.classmethod.jp/server-side/auth0/auth0-hands-on-webinar-basic/

suwa yuki

March 04, 2020
Tweet

More Decks by suwa yuki

Other Decks in Technology

Transcript

  1. Auth0ϋϯζΦϯ΢ΣϏφʔ ೝূج൫αʔϏε

  2. εέδϡʔϧ wςφϯτͷ࡞੒ w41"ͷೝূ w$POOFDUJPO w6OJWFSTBM-PHJO w3VMFT 2 Part1 جຊฤ 60min

    Part2 ൃలฤ 60min w6TFS-JOL w3#"$ w$VTUPN%# w:".-*NQPSU&YQPSU w"%࿈ܞ %FNPͷΈ 1 2 3 4 5 6 7 8 9 10
  3. Part1 جຊฤ 60min

  4. ςφϯτͷ࡞੒ w"VUIΞΧ΢ϯτͷ৽ن࡞੒࣌ʹͭ࡞Δ wςφϯτ͸ԿݸͰ΋࡞੒Ͱ͖Δ w"84Ͱݴ͏ͱ͜Ζͷ4XJUDI3PMFͱಉ͡Α͏ʹ
 ෳ਺ͷςφϯτΛ੾Γସ͑ͯ؅ཧ͢Δ 4 1

  5. جຊߏ੒ 5 https://dev.classmethod.jp/server-side/auth0/auth0-architecture/ Auth0 Tenant Application Connection User Account

  6. جຊߏ੒ 6 Auth0 Tenant A Account Tenant B Switch Tenant

  7. ΞΧ΢ϯτ࡞੒͸ͪ͜Β͔Β 7 https://auth0.com/signup

  8. 41"ͷೝূ w41"ͱ͸ʁʜ4JOHMF1BHF"QQMJDBUJPO w࣮ଶͱͯ͠͸୯Ұͷϖʔδ )5.-$44+4 ͕ͩɺ
 +BWB4DSJQUʹΑͬͯΞϓϦͷΑ͏ͳৼΔ෣͍Λ͢Δ wϖʔδભҠͷ੾Γସ͕͑ૣ͍ͳͲͷϝϦοτ͕͋Γ
 ݱ୅ͷ8FCΞϓϦͷओྲྀ 8 2

  9. 41"ͷೝূͷ࢓૊Έ 9 Web App
 (SPA) Auth0 ( IdP ) ᶄAuth0ͷϩάΠϯϖʔδʹ


    ϦμΠϨΫτ ᶃϩάΠϯϘλϯΛ
 ԡ͢ ᶅϩάΠϯॲཧ ᶆݩͷϖʔδʹࣗಈϦμΠϨΫτͯ͠
 ID Token / Access TokenΛऔಘ
  10. ೝূϑϩʔ w͍Ζ͍Ζ͋Δ͕ɺ41"ͷ৔߹͸
 "VUIPSJ[BUJPO$PEFXJUI1,$&'MPX͕ਪ঑ 10

  11. "VUIPSJ[BUJPO$PEF'MPXXJUI1SPPG,FZ GPS$PEF&YDIBOHF 1,$& w0"VUIͷػೳ֦ு w3'$ ೥ൃߦ 
 IUUQTUPPMTJFUGPSHIUNMSGD w1VCMJD$MJFOUͷηΩϡϦςΟϦεΫΛղফ͢ΔͨΊʹ ੜΈग़͞Εͨϑϩʔ

    wͽ͘͠ʔ 11
  12. 12 ϦμΠϨΫτઌΛͳΓ͢·͠ Ҏ߱ͷॲཧΛԣऔΓͰ͖Δ

  13. 13

  14. 14 ԣऔΓͯ͠΋Code Verifier͕ ෼͔Βͳ͍ʂ

  15. 41"ͷೝূΛࢼ͢ w%BTICPBSE͔Β৽ن"QQMJDBUJPOΛ࡞੒ w"QQMJDBUJPO5ZQFͰ
 ʮ4JOHMF1BHF8FC"QQMJDBUJPOTʯΛબ୒ w2VJDL4UBSUͰʮ+BWB4DSJQUʯΛબ୒ wϩʔΧϧͰಈ͔ͨ͢Ίʹ"QQMJDBUJPOͷઃఆΛมߋ wαϯϓϧΞϓϦέʔγϣϯΛμ΢ϯϩʔυ࣮ͯ͠ߦ 15

  16. None
  17. "MMPXFE$BMMCBDL63-Tͱ͸ 17 Web App
 (SPA) Auth0 ( IdP ) ᶆݩͷϖʔδʹࣗಈϦμΠϨΫτͯ͠


    ID Token / Access TokenΛऔಘ Auth0͔ΒϦμΠϨΫτ͢ΔURL͸ϗϫΠτϦετͰ؅ཧɻ ·ͨAuth0ͷAPIΛ࣮ߦ͢Δ৔߹͸Cross-Origin͕ൃੜ͢ΔͨΊ
 OriginΛϗϫΠτϦετͰ؅ཧ (Allowed Origins)ɻ
  18. ϞδϡʔϧͷΠϯετʔϧˍىಈ # ϞδϡʔϧͷΠϯετʔϧ $ npm install # αϯϓϧΞϓϦέʔγϣϯͷىಈ $ npm

    start
  19. $POOFDUJPOͱ͸ʁ w"VUI͔ΒϩάΠϯ࣌ʹ઀ଓ͢Δઌ w͍͔ͭ͘ͷ઀ଓํࣜͷछྨ͕͋Δ  %BUBCBTF$POOFDUJPO  4PDJBM-PHJO  &OUFSQSJTF%JSFDUPSZ 

    1BTTXPSEMFTT4ZTUFN 19 3
  20. Desktop App Web App Mobile App Auth0 ( IdP )

    LINE Facebook Google Database User User User User User User User User User User
  21. Desktop App Web App Mobile App Auth0 ( IdP )

    LINE Facebook Google Database User User User User User User User User User User
  22. $POOFDUJPOͷ0/0'' wσϑΥϧτͰ͸(PPHMF$POOFDUJPO ͓ࢼ͠ ͕0/ wͦͷͨΊϩάΠϯը໘ʹʮ4JHOJOXJUI(PPHMFʯ͕ දࣔ͞Ε͍ͯΔ w"QQMJDBUJPOT4BNQMF"QQ$POOFDUJPOTͰ
 HPPHMFPBVUIͷϑϦοϓΛΦϑʹͯ͠ΈΔ wϩάΠϯը໘͔Βදࣔ͞Εͳ͘ͳΕ͹੒ޭ 22

  23. 6OJWFSTBM-PHJO w"VUI͕ϗεςΟϯά͢Δ ϩάΠϯϖʔδ͕ར༻Մೳ w)5.-ϕʔεͰͷΧελϚ Πζ΋ॊೈʹߦ͑Δ wϩάΠϯϖʔδΛ࡞ΓࠐΉ ඞཁ͕ͳ͍ 23 4

  24. "VUI-PDL w૊ΈࠐΈ༻ͷ6*ϥΠϒϥϦ w೚ҙͷ8FCϖʔδʹϩάΠ ϯ΢ΟδΣοτΛຒΊࠐΈ wݟͨ໨Λࣗ༝ʹมߋՄೳ 24 https://auth0.com/lock

  25. 6OJWFSTBM-PHJOWT"VUI-PDL w6OJWFSTBM-PHJO͸ݱࡏछྨͷ༻ҙ͕͋Δ  $MBTTJD/FX&YQFSJFODF w/FX&YQFSJFODF͸ମݧࣗମ͸ྑ͍͕ɺ
 $MBTTJDͱൺ΂Δͱػೳ͕ෆे෼ͳͱ͜Ζ͕͋Δ w6OJWFSTBM-PHJOͷΧελϚΠζ͸$MBTTJDͷΈରԠ w$MBTTJD͸"VUI-PDLΛ࢖࣮ͬͨ૷ʹͳ͍ͬͯΔ 25

  26. 6OJWFSTBM-PHJOͷΧελϚΠζ w6OJWFSTBM-PHJO4FUUJOHTͰ
 ʮ$MBTTJDʯΛબ୒ w6OJWFSTBM-PHJO-PHJOͰ
 ʮ$VTUPNJ[F-PHJO1BHFʯΛ0/ wιʔείʔυΛΧελϚΠζɺ1SFWJFXͰදࣔΛ֬ೝ wαϯϓϧ͸4MBDLʹͯ 26 https://auth0.com/docs/libraries/lock/v11/configuration

  27. બఆϩδοΫ w·ͣ͸/FX&YQFSJFODFͰཁ͕݅ຬͨͤΔ͔ࢼ͢ wཁ͕݅ຬͨͤͳ͍৔߹͸$MBTTJDPS"VUI-PDL wΞϓϦϖʔδʹϩάΠϯϑΥʔϜΛຒΊࠐΈ͍ͨ৔߹ ͸"VUI-PDLΛ࢖͏ w6OJWFSTBM-PHJOʹͨ͠ํ͕ख཭Ε͕ྑ͍ͷͰɺ
 ຒΊࠐΈ͕ຊ౰ʹඞཁ͔Ͳ͏͔୳Δ 27

  28. 3VMFT w"VUIͷ֦ுੑͷίΞͱͳΔػೳ wϩάΠϯ࣌ʢτʔΫϯϦϑϨογϡ࣌ʣʹؔ਺Λ࣮ߦ wෳ਺ઃఆՄೳʢॱ൪ʹ࣮ߦ͞ΕΔʣ wҎ্ͷςϯϓϨʔτ͔Β࡞Γ࢝ΊΒΕΔ 28 5

  29. https://auth0.com/docs/best-practices/rules

  30. None
  31. ಛఆυϝΠϯͷΈϩάΠϯڐՄ w3VMFT$3&"5&36-& wʮ"DDFTT$POUSPMʯ಺ͷ
 ʮ&NBJMEPNBJOXIJUFMJTUʯΛબ୒ wίʔυ಺ͷʮXIJUFMJTUʯͷ഑ྻΛमਖ਼
 ྫ'classmethod.jp' 31 *%18Ͱొ࿥ͨ͠ޙʹϝʔϧ͕ಧ͍͍ͯΔͷͰɺ ঝೝ͓ͯ͘͜͠ͱ ஫ҙ

  32. 3VMFͷ࢖͍ಓ wςϯϓϨʔτΛҰ௨ΓݟΔͱେମΘ͔Δ wҰ෦ػೳ͸3VMFͷซ༻Ͱ࣮ݱ͞Ε͍ͯΔ  ଟཁૉೝূʢ.'"ʣ  6TFS-JOL w"VUIͷ֦ுੑ͸3VMFͰ࣮ݱ͞Ε͍ͯΔͷͰ
 ׆͔͢ιϦϡʔγϣϯΛߟ͍͑ͯ͘ 32

  33. Part2 ൃలฤ 60min

  34. 6TFS-JOL w$POOFDUJPOͷҟͳΔϢʔβʔΛϦϯΫͤͯ͞
 ·ͱΊΔػೳ w"VUI"1*Λ࢖ͬͯϦϯΫ͢Δखஈ͕ࣗ༝ʹऔΕΔ  Ϣʔβʔࣗ਎ʹ࿈ܞΛઃఆͯ͠΋Β͏  3VMFΛ࢖ͬͯϝʔϧΞυϨεͰࣗಈ໊دͤ  ؅ཧऀଆ·ͨ͸γεςϜͰಠࣗʹ໊دͤ

    34 6 https://dev.classmethod.jp/server-side/auth0/auth0-user-account-link/
  35. ࣗಈ໊دͤ w3VMFT$3&"5&36-& wʮ"DDFTT$POUSPMʯͷ
 ʮ-JOL"DDPVOUTXJUI4BNF&NBJM"EESFTTʯΛબ୒ wαϯϓϧΞϓϦέʔγϣϯͰ࠶ϩάΠϯ
 ʢ(PPHMFͰͷϩάΠϯɺ*%18ͰϩάΠϯͦΕͧΕߦ͏ʣ 35 *%18Ͱొ࿥ͨ͠ޙʹϝʔϧ͕ಧ͍͍ͯΔͷͰɺ ঝೝ͓ͯ͘͜͠ͱ ஫ҙ

  36. ϩʔϧ͝ͱͷΞΫηε੍ޚ 3#"$ w͋Β͔͡Ίઃఆ͞Εͨ3PMFͱ1FSNJTTJPOʹج͖ͮ
 ϢʔβʔʹϦιʔεͷΞΫηεݖݶΛ༩͑Δ Roles Permissions Resource Users User Manager

    Admin ਃ੥ऀ ਃ੥ঝೝऀ ؅ཧऀ Roleͷ෇༩ ਃ੥ͷ࡞੒ ਃ੥ͷऔΓԼ͛ ਃ੥ͷঝೝ ਃ੥API ؅ཧAPI 7
  37. 3#"$ͷઃఆ w"1*Tͷʮ$3&"5&"1*ʯͰ৽ن"1*Λ࡞੒ wʮ3#"$4FUUJOHTʯͷʮ&OBCMF3#"$ʯͱ
 ʮ"EE1FSNJTTJPOJOUIF"DDFTT5PLFOʯΛ0/ wʮ1FSNJTTJPOTʯͰ1FSNJTTJPOΛఆٛ w6TFS3PMFT3PMFTͰ3PMFΛ࡞੒ w6TFS3PMFT6TFSTͰϢʔβʔʹ3PMFΛઃఆ 37

  38. αϯϓϧΞϓϦέʔγϣϯͷमਖ਼खॱ w·ͣϩάΞ΢τ͓ͯ͘͠˞ॏཁ w4BNQMF"QQMJDBUJPOͷιʔείʔυΛՕॴमਖ਼ wϩάΠϯ͠௚͢ 38

  39. αϯϓϧΞϓϦέʔγϣϯͷमਖ਼ 39 public/js/app.js 11 const options = { 12 redirect_uri:

    window.location.origin, 13 audience: 'https://example.jp' 14 });
  40. αϯϓϧΞϓϦέʔγϣϯͷमਖ਼ 40 public/js/app.js 103 const token = await auth0.getTokenSilently({ 104

    audience: 'https://example.jp' 105 }); 106 console.log(token); 107 return;
  41. KXUJP

  42. $VTUPN%BUBCBTF wϩάΠϯͳͲͷॲཧΛεΫϦϓτʢؔ਺ʣͰ
 ࣗ༝ʹॻ͚Δػೳ wಠࣗͷ"1*Λୟ͘͜ͱ΋σʔλϕʔεʹ௚઀઀ଓ͢Δ ͜ͱ΋Ͱ͖Δʢ"VUIͷ*1ΛڐՄ͢Δඞཁ͕͋Δʣ w&OUFSQSJTF1MBOͷΈӡ༻Մೳ 42 8

  43. $VTUPN%#ͷઃఆ w$POOFDUJPOT%BUBCBTFͰ
 ʮ$3&"5&%#$0//&$5*0/ʯΛΫϦοΫ w$VTUPN%BUBCBTFͷʮ6TFNZPXOEBUBCBTFʯΛ 0/ʹ͢Δ wʮ%BUBCBTF"DUJPO4DSJQUTʯΛमਖ਼͢Δ 43

  44. $POOFDUJPOͷมߋ w"QQMJDBUJPOT4BNQMF"QQΛબ୒ w$POOFDUJPOTͷ
 ʮ6TFSOBNF1BTTXPSE"VUIFOUJDBUJPOTʯΛΦϑ ʹͯ͠ʮ$VTUPN%#ʯΛΦϯʹ͢Δ wαϯϓϧΞϓϦέʔγϣϯͰ࠶ϩάΠϯ͢Δ 44

  45. :".-*NQPSU&YQPSU w"84$MPVE'PSNBUJPOͷΑ͏ʹ"VUIͷςφϯτͷ ઃఆΛ:".-ϑΝΠϧ͔ΒσϓϩΠͰ͖Δ wϩʔΧϧʹग़ྗ΋Ͱ͖Δ w$*πʔϧͳͲͱ૊Έ߹Θͤͯ࢖͏͜ͱͰ
 $*$%͕࣮ݱͰ͖Δ 45 9

  46. "VUIͷςφϯτ৘ใΛ&YQPSU͢Δ wࣄલ४උͱͯ͠"VUI"1*ͷೝূ৘ใΛऔಘ͢Δ w"1*T"VUI.BOBHFNFOU"1*"1*&YQMPSFSͰ ʮ$3&"5&"65)03*;&5&45"11-*$"5*0/ʯ ΛΫϦοΫ w"QQMJDBUJPOT"VUI.BOBHFNFOU"1* 5FTU "QQMJDBUJPO Ͱ$MJFOU*%ͱ$MJFOU4FDSFUΛऔಘ 46

  47. ؀ڥߏங 47 # ϞδϡʔϧͷΠϯετʔϧ $ mkdir ~/auth0-tenant && cd ~/auth0-tenant

    $ npm i -g auth0-deploy-cli # Help $ a0deploy -h
  48. 48 # config.json { "AUTH0_DOMAIN": "", "AUTH0_CLIENT_SECRET": "", "AUTH0_CLIENT_ID": "",

    "AUTH0_ALLOW_DELETE": true }
  49. ςφϯτ৘ใΛ*NQPSU&YQPSU͢Δ 49 # Export $ a0deploy export \ -c config.json

    -f yaml -o . # Import (Deploy) $ a0deploy import \ -c config.json -i tenant.yaml
  50. :".-ͷߏ੒ 50 https://dev.classmethod.jp/server-side/auth0/auth0-inport-config/ https://dev.classmethod.jp/server-side/auth0/auth0-export-config/

  51. "%-%"1$POOFDUPS %FNPͷΈ w"DUJWF%JSFDUPSZʹొ࿥͞Ε͍ͯΔϢʔβʔΛ
 ೝূͤ͞ΔͨΊͷػೳ w"%-%"1$POOFDUPSͱ͍͏"HFOUΛΠϯετʔϧ ͢Δ͜ͱͰར༻Մೳ 51 10

  52. "%-%"1$POOFDUPS wߏஙʹ͕͔͔࣌ؒΔͷͰσϞ wڵຯ͕͋Δํ͸ҎԼΛࢀߟʹߏஙͯ͠Έ͍ͯͩ͘͞ 52 https://qiita.com/hisashiyamaguchi/items/44890d436a2b3d76e7d9 https://qiita.com/omaenimutyuu/items/4b6359b0968fb14288f7

  53. None
  54. None