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

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

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

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Ͱݴ͏ͱ͜Ζͷ4XJUDI
   3PMFͱಉ͡Α͏ʹ
 ෳ਺ͷςφϯτΛ੾Γସ͑ͯ؅ཧ͢Δ 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"ͱ͸ʁ
   ʜ
   4JOHMF
   1BHF
   "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
    $PEF
    XJUI
    1,$&
    'MPX͕ਪ঑ 10
11. "VUIPSJ[BUJPO
    $PEF
    'MPX
    XJUI
    1SPPG
    ,FZ
    GPS
    $PEF
    &YDIBOHF
    1,$& w0"VUI
    ͷػೳ֦ு
    w3'$
    
    ೥ൃߦ 
 IUUQTUPPMTJFUGPSHIUNMSGD
    w1VCMJD
    $MJFOUͷηΩϡϦςΟϦεΫΛղফ͢ΔͨΊʹ ੜΈग़͞Εͨϑϩʔ
    wͽ͘͠ʔ 11
12. 12 ϦμΠϨΫτઌΛͳΓ͢·͠ Ҏ߱ͷॲཧΛԣऔΓͰ͖Δ
14. 14 ԣऔΓͯ͠΋Code Verifier͕ ෼͔Βͳ͍ʂ
15. 41"ͷೝূΛࢼ͢ w%BTICPBSE͔Β৽ن"QQMJDBUJPOΛ࡞੒
    w"QQMJDBUJPO
    5ZQFͰ
 ʮ4JOHMF
    1BHF
    8FC
    "QQMJDBUJPOTʯΛબ୒
    w2VJDL
    4UBSUͰʮ+BWB4DSJQUʯΛબ୒
    wϩʔΧϧͰಈ͔ͨ͢Ίʹ"QQMJDBUJPOͷઃఆΛมߋ
    wαϯϓϧΞϓϦέʔγϣϯΛμ΢ϯϩʔυ࣮ͯ͠ߦ 15
17. "MMPXFE
    $BMMCBDL
    63-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
     1BTTXPSEMFTT
    4ZTUFN 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ͦͷͨΊϩάΠϯը໘ʹʮ4JHO
    JO
    XJUI
    (PPHMFʯ͕ දࣔ͞Ε͍ͯΔ
    w"QQMJDBUJPOT
    
    4BNQMF"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
    -PHJO
    WT
    "VUI
    -PDL w6OJWFSTBM
    -PHJO͸ݱࡏछྨͷ༻ҙ͕͋Δ
     $MBTTJD
    
    /FX
    &YQFSJFODF
    w/FX
    &YQFSJFODF͸ମݧࣗମ͸ྑ͍͕ɺ
 $MBTTJDͱൺ΂Δͱػೳ͕ෆे෼ͳͱ͜Ζ͕͋Δ
    w6OJWFSTBM
    -PHJOͷΧελϚΠζ͸$MBTTJDͷΈରԠ
    w$MBTTJD͸"VUI
    -PDLΛ࢖࣮ͬͨ૷ʹͳ͍ͬͯΔ 25
26. 6OJWFSTBM
    -PHJOͷΧελϚΠζ w6OJWFSTBM
    -PHJO
    
    4FUUJOHT
    Ͱ
 ʮ$MBTTJDʯΛબ୒
    w6OJWFSTBM
    -PHJO
    
    -PHJO
    Ͱ
 ʮ$VTUPNJ[F
    -PHJO
    1BHFʯΛ0/
    wιʔείʔυΛΧελϚΠζɺ1SFWJFXͰදࣔΛ֬ೝ
    wαϯϓϧ͸4MBDLʹͯ 26 https://auth0.com/docs/libraries/lock/v11/configuration
27. બఆϩδοΫ w·ͣ͸/FX
    &YQFSJFODFͰཁ͕݅ຬͨͤΔ͔ࢼ͢
    wཁ͕݅ຬͨͤͳ͍৔߹͸$MBTTJD
    PS
    "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
31. ಛఆυϝΠϯͷΈϩάΠϯڐՄ w3VMFT
    
    $3&"5&
    36-&
    wʮ"DDFTT
    $POUSPMʯ಺ͷ
 ʮ&NBJM
    EPNBJO
    XIJUFMJTUʯΛબ୒
    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
    "DDPVOUT
    XJUI
    4BNF
    &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ʯͷʮ&OBCMF
    3#"$ʯͱ
 ʮ"EE
    1FSNJTTJPO
    JO
    UIF
    "DDFTT
    5PLFOʯΛ0/
    wʮ1FSNJTTJPOTʯͰ1FSNJTTJPOΛఆٛ
    w6TFS
    
    3PMFT
    
    3PMFT
    Ͱ
    3PMF
    Λ࡞੒
    w6TFS
    
    3PMFT
    
    6TFST
    ͰϢʔβʔʹ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&OUFSQSJTF
    1MBOͷΈӡ༻Մೳ 42 8
43. $VTUPN
    %#ͷઃఆ w$POOFDUJPOT
    
    %BUBCBTF
    Ͱ
 ʮ$3&"5&
    %#
    $0//&$5*0/ʯΛΫϦοΫ
    w$VTUPN
    %BUBCBTFͷʮ6TF
    NZ
    PXO
    EBUBCBTFʯΛ 0/ʹ͢Δ
    wʮ%BUBCBTF
    "DUJPO
    4DSJQUTʯΛमਖ਼͢Δ 43
44. $POOFDUJPOͷมߋ w"QQMJDBUJPOT
    
    4BNQMF
    "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
    *%
    ͱ
    $MJFOU
    4FDSFU
    Λऔಘ 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