OAuth2.0完全に理解した

OAuth 2.0 完全に理解した。

OAuth 2.0とは？ OAuth（オー・オース）は、Open Authorization の略。 OAuth 2.0 は、異なる2つのサービス間でユーザー情報などのリソースを共有することを可能にする、ユーザー権限の認可をおこ
なうためのスタンダードです。ユーザーがユーザー名（IDやメールアドレス等）とパスワードをクライアントに提供することなく、ユーザ情報の開示ができることがメリット。

OAuth 1.0とOAuth 2.0の違い • OAuth 1.0では、署名プロセスのみの認証しかサポートしていない。 • OAuth 2.0は、より多くの認証フローをサポートしている。
（認証コードフロー、暗黙のフロー、リソース所有者パスワード資格情報フロー、クライアント資格情報フローなど）

OAuth 2.0のインフラ構成図

OAuth 2.0のシーケンス図今回のサンプルは認証コードフロー

今回作ったアプリのUI 詳しくはこちら↓ https://github.com/ryomeblog/google-oauth

環境構築説明プロジェクト作成 • GCP： https://console.cloud.google.com/welcome

環境構築説明クライアントIDとクライアントシークレット発行

環境構築説明バックエンド（Lambda）デプロイ

環境構築説明 Reactアプリ起動

react-google-loginに悩まされる • 認証が通っても「popup_closed_by_user」エラーになるバグがあります。 • 2017年から直ってません。 • 「@react-oauth/google」を使いましょう。詳しくはこちら↓ https://github.com/anthonyjgrove/react-google-login/issues/132

GitHub 今回解説した「 OAuth 2.0 」のサンプルコードは GitHubに格納しています。 GitHub URL https://github.com/ryomeblog/google-oauth

参考文献 • https://github.com/ryomeblog/google-oauth • https://github.com/anthonyjgrove/react-google- login/issues/132 • https://developers.google.com/identity/protocols/oauth 2?hl=ja

OAuth2.0完全に理解した

OAuth2.0完全に理解した

ryome

More Decks by ryome

Other Decks in Technology

Featured

Transcript