Chrome ExtensionでSelf-Issued OpenID Provider
•Download as PPTX, PDF•
1 like•614 views
ChromeのExtensionを作ったことない奴が OpenID ConnectのSelf-Issued OPを実装しようとするも 無理なんじゃないかな？って思うに至るまでのスライド
More Related Content
Similar to Chrome ExtensionでSelf-Issued OpenID Provider
Similar to Chrome ExtensionでSelf-Issued OpenID Provider (9)
More from Takeru Ujinawa
More from Takeru Ujinawa (8)
Recently uploaded
Recently uploaded (16)
Chrome ExtensionでSelf-Issued OpenID Provider
- 1. Chrome Extensionで Self-Issued OpenID Providerを 作るやで(Day1) uji52
- 2. uji52 自己紹介 • uji52 • 好きなOIDCのフロー • Code Flow • 好きなExtension • wasavi • Advanced REST Client • JSON Formatter 2
- 4. uji52 OpenID Connect 4 ユーザ 2.認証要求 4.認証情報・ID情報 すっごいザックリした説明 ID Token eyJxxx.eyJxxx.xxxxxx RP OP
- 10. uji52 My Favorite Chrome Extension 10 ブラウザで出てるコンテンツを書き換える wasavi
- 12. uji52 やる必要のあること • 指定のページで使える • openid://でキックされる • RS256の署名ができる • 署名鍵を安全に保管できる • リクエストが送れる 12
- 14. uji52 Google Extensionの構成要素 • manifest.json • Extensionの名前 • バージョン • どんな動きするか • どんなファイルを使うか • htmlとかjsのファイル • アイコン画像 14
- 15. uji52 サンプル実装1 15 { "manifest_version": 2, "name": "SIOP52", "description": "Self-Issued OpenID Provider", "version": "0.1", "icons": { "128": "128.png" }, "browser_action": { "default_title": "SIOP52", "default_icon": "16.png", "default_popup": "first.html" } } manifest.json <!DOCTYPE html> <html> <head> </head> <body> <p>SIOPを作るで</p> </body> </html> first.html 128.png 16.png
- 17. uji52 サンプル実装1 17
- 18. uji52 サンプル実装1 18
- 19. uji52 Extensionの種類 • browser action • 右上に出てくるやつ • どこのページでも出てくる • page action • アドレスバーの右端に出る(俺やったとき出んかったけど情報古いんかな) • 特定のURLで使う等の利用 19
- 20. uji52 Extensionの種類 • Background • ブラウザ起動時からずっと裏で開いてるページ • Content Scripts • 該当ページが開いたら走ってくれる • DOMでページをいじれる • Context Menu • 右クリックで出てくるようなやつ • TOEIC320点マンがGoogle翻訳で重宝してるやつ 20
- 21. uji52 サンプル実装2 21 "128": "128.png" }, "background": { "scripts": [ "background.js" ] }, "permissions": [ "tabs" ], "page_action": { "default_title": "SIOP52", manifest.json function validUri(tabId, changeInfo, tab) { if (tab.url.indexOf("https://www") >= 0) { chrome.pageAction.show(tabId); } }; chrome.tabs.onUpdated.addListener(validUri); background.js
- 22. uji52 やる必要のあること • 指定のページで使える • openid://でキックされる • RS256の署名ができる • 署名鍵を安全に保管できる • リクエストが送れる 22
- 23. uji52 今回のまとめ • 案外簡単にできる • マニフェストファイルって名前の割に分かりやすい • 用語理解が苦しいが動かすのは簡単 • 残りのやりたいことできるかな？ • opened://でキックするのはbackgroundで行けそう • 鍵の保管先とか無理じゃないか • 公開に5$かかるらしい • G社「5$かけて悪いもん公開する奴おらんやろ(楽観)」 23