COLUMN
コラム
2023年05月25日
フロントエンド開発に関わる認証・認可技術用語
カテゴリー:システム開発
タグ:フロントエンド, 基本用語
フロントエンドアプリケーションを開発する際、多くのケースにおいて外部システムとデータの送受信が発生します。この際、必要になるのが認証・認可です。
認証は正しいユーザー(ID・パスワードが一致しているなど)であることを保証するもので、認可はどのデータに対してアクセスできるか、どの機能を利用できるかをユーザーが許可する仕組みになります。
この記事では、この認証と認可に関する技術用語について解説します。
必要になるケース
自社サーバーと自社アプリという組み合わせであれば、認証・認可の仕組みはもっと簡単です、セッションIDを設けて、Cookieやセッションとしてサーバーと送受信すれば良いでしょう。
認証・認可についてきちんと考えるべきなのは、以下のようなケースです。
- ドメインを超える
- スマートフォンやデスクトップアプリなどから利用する
- 第三者の開発したアプリケーションから利用する
第三者の作ったUIに、外部サービスのIDやパスワードを入力するのは危険です。そのため、認証機能を提供するサービス(サービス本体)に一度遷移し、そこで認証を行います。
また、認証したからと言って全データへのアクセスを許可するのは乱暴です。ユーザー自身がどのデータへアクセスできるのかを許可できる仕組みが必要です。これが認可になります。
技術ワード
OICD
OICDはOpenID Connectの略になります。元々OpenIDと言えば認証の仕組みを提供するものでした。その最新の規約がOICDです。単にOpenIDということもあります。
プロトコルにはOAuthを利用しています。また、OICDは認可部分については関係しておらず、ID Tokenの発行に特化しています。
OAuth
OAuthは認可に関する仕組みになります。現在はOAuth 2.0(単にOAuth2と呼ばれます)が最新版です。アプリケーション開発者が指定したスコープ(どの機能を利用するか、どう操作するかなど)に応じて、データ利用を許可するかをユーザーに確認します。
ユーザーが許可すると、Access Token(以下アクセストークン)が発行されます。アプリケーションは、そのアクセストークンを使ってユーザーデータへアクセスします。
多くの場合、ユーザーはアプリケーションの利用許可を任意のタイミングで削除できます。また、アクセストークンには有効期限があり、有効期限が切れると再度認可する必要があります。
Access Token(アクセストークン)
アクセストークンはサーバーが発行する任意の文字列です。完全にランダムな場合もありますし、JWT(JSON Web Token)になっていることもあります。
アプリケーションはこのアクセストークンをHTTPリクエストのAuthenticationヘッダーに付与して、リクエストを行います。
Refresh Token(リフレッシュトークン)
アクセストークンには有効期限が決まっていることが多く、その有効期限を延ばすのに利用するのがリフレッシュトークンです。
Bearer認証
アクセストークンを用いた認証を指します。これは Authentication: Bearer (アクセストークン) というHTTPリクエストヘッダーで示されます。他にBasic認証やDigest認証があります。
ID Token
ID TokenはOICDでの認証結果として取得されるトークンです。これはJWTフォーマットになります。
JWT
JSON Web Tokenの略です。3つの文字列がドット(.)でつながった形になっており、前から順番にヘッダー、ペイロード、署名となっています。
ヘッダー
ヘッダーはJWTのアルゴリズムやフォーマットに関する情報などが入っています。
ペイロード
ユーザー情報などが含まれます。
署名
ペイロードに関する署名です。この署名文字列を使うことで、ペイロードが改変されていないかを検証できます。
JWTのメリット
JWTはサーバー側で生成でき、セッションのようにデータベースに保存することなく使えるのがメリットです。ペイロードにはユーザー情報などを含めておけ、内容を確認すること自体は誰でもできます。
ただし、JWTをサーバーに送信した際にはサーバー側で検証を行い、そのペイロードが改変されていないかを確認できます。これによってユーザーIDが正しいものであるかを確認できます。
JWTのデメリット
JWT自体には、有効期限が設けられていません。ペイロードに含めることもできますが、サーバー側で仕組みを考える必要があります。
また、データベースなどに保存されていないため、JWTは削除できません。一度発行してしまって、有効期限の仕組みもないままに利用するのはセキュリティ上の課題があるでしょう。
HttpOnly Cookie
WebアプリケーションではセッションデータをCookieなどに保存することがありますが、その際に知っておきたいのがHttpOnly Cookieです。HttpOnly CookieはJavaScriptから操作できないCookieになります。
HttpOnly Cookieはサーバー側からのみ指定できるもので、クライアントアプリケーションで悪意を持った人がいても、盗み取られることがない情報になります。
まとめ
認証・認可の仕組みはWebアプリケーションやスマートフォンアプリの基本とも言えます。利用する機会が多いので、用語なども確実に押さえておきましょう。
HexabaseではID、パスワードを使った認証の他、Auth0を利用した認証にも対応しています。各種ソーシャルサービスや、自社SSOと連携したアプリケーションが開発できますので、ぜひご利用ください。
- カテゴリー
- タグ
- システム運用 (16)
- TypeScript (1)
- WebAssembly (2)
- ウォーターフォール開発 (2)
- 業務システム (28)
- CSS (2)
- GraphQL (1)
- プログラミング (31)
- スタートアップ (11)
- Nexaweb (1)
- BaaS (10)
- データベース (5)
- SPA (2)
- 基本用語 (26)
- Case study (5)
- Keyword (10)
- FaaS (1)
- システム開発 (69)
- スクラム (1)
- フロントエンド (38)
- AI (26)
- アジャイル開発 (18)
- Supabase (1)
- イノベーション (5)
- Database (2)
- 月額制 (1)
- PaaS (3)
- ACF (1)
- BookReview (3)
- サービス開発 (5)
- React (3)
- Firebase (1)
- クラウドサービス (12)
- low-code (2)
- バックエンド (8)
- ナレッジマネジメント (1)
- ChatGPT (1)
- Vue.js (2)
- Tailwind CSS (1)
- DBaas (2)
- プロジェクト管理 (13)
- セミナー (2)
- Web (21)
- 失敗事例 (2)
- Hexabase_health (1)
- 生成AI (7)
- 受託開発 (1)
- Kubernetes (3)
- WebComponents (1)
- 通知 (1)
- API (6)
- Next.js (1)
- フレームワーク (3)
- ローコード開発 (4)
- ノーコード開発 (1)
- JavaScript (2)
- Hexabase (12)
- LLM (3)
- 画像生成 (1)
- DX (34)