Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編
-
Upload
kazumi-ohira -
Category
Technology
-
view
1.606 -
download
3
Transcript of Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編
![Page 1: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/1.jpg)
Node.js でサクッと作るAzure AD 連携アプリ !挑戦編 !
Node.js アプリケーションで Azure AD のシングルサインオン
![Page 2: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/2.jpg)
自己紹介Self Introduction
![Page 3: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/3.jpg)
大平かづみ 現職 : アイレット株式会社 cloudpack事業部
クラウドインテグレーターのなかのプログラマ 過去の経歴
SIer でガラケーやカーナビのミドルウェア開発 (C/C++)
Web 系開発 (Ruby on Rails, Phalcon PHP Framework)
お世話になっているコミュニティ Windows 女子部 チームクラウド SoftLayer / Bluemix 女子会 Japan AWS User Group (JAWSUG)
qpstudy 、 DevLOVE 、 PHP 界隈 など
Twitter: dz_Facebook: dzeyelidQiita: dz_
![Page 4: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/4.jpg)
Prologueはじめに
![Page 5: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/5.jpg)
青いクラウドをつなげたい!
![Page 6: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/6.jpg)
きっかけThe beginning
![Page 7: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/7.jpg)
きっかけ アプリケーションに、欠かせないのが ID 管理 とはいえ、 ID 管理や認証処理は意外と大変! ID 管理をより簡単に安全にできないかしら?
![Page 8: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/8.jpg)
ID 管理といえばSpeaking of identity management
![Page 9: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/9.jpg)
Active Directory?
![Page 10: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/10.jpg)
Active Directory?
イタリアン・神引用元 : Episode 86 - Windows Azure Active Directory with Vittorio Bertocci - Microsoft Azure Cloud Cover Show - Channel 9
![Page 11: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/11.jpg)
Active Directory?
ジャパニーズ・神引用元 : ビル・ゲイツ絶賛!Microsoft澤円氏の「結果を出すビジネス会話」6つの極意 - リクナビNEXTジャーナル
![Page 12: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/12.jpg)
失礼いたしました。
![Page 13: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/13.jpg)
そもそも、プログラマが Active Directory を構築したり、 AD FS 連携したりすること自体が難関です…AD FSDirectory
アプリケーション連携させるには、 AD のほかに、 AD FS ( フェデレーションサービス ) が必要
![Page 14: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/14.jpg)
IDaaS という選択Choice of IDaaS
![Page 15: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/15.jpg)
IDaaS とは Identity as a Service の略 サービスとして ID 管理を提供すること 主に ID 情報の管理や、認証機構の提供を行う
![Page 16: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/16.jpg)
IDaaS といえば、
AzureActive Directory
![Page 17: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/17.jpg)
Azure AD のおさらい クラウドベースのフルマーネジドな ID 管理 多くに対応したシングルサインオン 業界標準のプロトコルをサポート 多くのプラットフォームと連携可能 オンプレミスの Active Directory との同期
![Page 18: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/18.jpg)
Azure AD は様々なプラットフォームから利用可能! サポートしているプロトコル
SAML 2.0 、 WS-Federation 、 OpenID Connect など オープン ソースのクライアント ライブラリ
.NET 、 Windows ストア、 iOS 、 Android 向け REST ベースの Graph API OAuth 2.0 サポート
![Page 19: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/19.jpg)
アプリケーションを作ろうLet’s try to make application
![Page 20: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/20.jpg)
Azure AD が簡単便利なら、アプリケーションの開発も簡単便利に作りたいね!
![Page 21: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/21.jpg)
PaaS を使おう!
![Page 22: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/22.jpg)
PaaS といえば、
IBM Bluemix
(WebApps じゃなくてごめんなさい! 完全に個人都合ですw )
![Page 23: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/23.jpg)
だって青いクラウドつなげたいじゃないですかっ!
( 完全に個人都合 )
![Page 24: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/24.jpg)
気を取り直して…That didn't discourage
![Page 25: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/25.jpg)
アプリケーションの構成 実行環境 : IBM Bluemix 言語 : Node.js Node.js モジュール : passport, passport-azure-ad
![Page 26: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/26.jpg)
Node.js の認証ミドルウェア PassportPassport is authentication middleware for Node.js
![Page 27: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/27.jpg)
Passport って?Node.js で認証機能を実装するときに重宝するミドルウェア。Express というウェブアプリケーションフレームワークと相性が良い。Passport は、 Strategy という単位で様々な対象に対する認証機能が提供されている。 Facebook や Twitter などの SNS の認証や、 OpenID などプロトコルの認証など。
![Page 28: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/28.jpg)
Passport で Azure AD をUse Azure AD on Passport
![Page 29: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/29.jpg)
passport-azure-ad って?Passport で Azure AD のシングルサインオンを利用できるミドルウェア!サンプルコードも提供されているので、着手しやすい。
![Page 30: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/30.jpg)
だが、しかぁし!!私のシルバーウィークはこの子との壮絶な戦いに明け暮れる日々でしたw
![Page 31: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/31.jpg)
見えざる罠Invisible traps
![Page 32: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/32.jpg)
見えざる罠サインインから抜け出せない罠アクセストークンが取得できない罠サインイン成功してるのに、ログインできない罠
![Page 33: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/33.jpg)
勝ったよ!Invisible traps
![Page 34: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/34.jpg)
この手につかんだ勝利!サインインから抜け出せない罠
→ マルチテナントを設定しよう!
![Page 35: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/35.jpg)
この手につかんだ勝利!アクセストークンが取得できない罠
→ Microsoft アカウントを使ってサインインしようとした場合に発生する。共通のエンドポイントでなく、ディレクトリ(テナント)固有のエンドポイントを指定する。
![Page 36: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/36.jpg)
この手につかんだ勝利!サインイン成功してるのに、ログインできない罠
→ https のアプリケーションの場合は、セッションクッキーの設定を有効にし、 https でもデータが保持されるようにする。
![Page 37: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/37.jpg)
トラブルシューティング詳細Check! Node.js で Azure AD を! ~ passport-azure-ad の導入とトラブルシューティング
![Page 38: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/38.jpg)
次に挑戦したいことNext Challenge?
![Page 39: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/39.jpg)
Azure AD B2C Previewを試したい!
![Page 40: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/40.jpg)
謝辞Thanks a lot !
![Page 41: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/41.jpg)
謝辞Microsoft 系アイコンは、福岡の松本さんが作られたベクター形式のアイコンセットを拝借いたしました!便利です!ありがとうございます!Microsoft系のアイコン(Microsoft CloudnEnterprise Symbols)をベクター形式にしてみた話。 | nrjlog
![Page 42: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/42.jpg)
謝辞作業を進めるうえで困ったときにアドバイスを下さった、デプロイ王子、こと廣瀬さんありがとうございます!
![Page 43: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/43.jpg)
謝辞今日、この素晴らしい機会をくださった、 Windows 女子部 3代目部長の木下未来さんありがとうございます!!
![Page 44: Node.js でサクッと作る Azure AD 連携アプリ! ~ 挑戦編](https://reader036.fdocuments.net/reader036/viewer/2022081502/58eff3f71a28abda0f8b45b5/html5/thumbnails/44.jpg)
最後までお付き合いくださった会場の皆さま、ありがとうございました!