1
1

Bearer認証の追加方法

Posted at

Bearer認証とは?

(読み方:ベアラーにんしょう・ベアラにんしょう)

ログイン・パスワードでユーザー認証を行った際に、認可サーバーから発行されるアクセストークンを使って、APIのリクエスト時にAuthorizationヘッダにアクセストークンを含めて送信します。

(個人的にセッションの考えに似ている気がします🤔)

パソコン.png

《概要》

①クライアントがログイン時にサーバーはアクセストークンを発行
②発行されたトークンをクライアントのブラウザ内のsessionStrageかlocalStrageに保存
③ページへのアクセス時にAuthorizationヘッダにトークンセットし、サーバーにRequest送信
④サーバーはトークンを確認し、有効ならリクエストされたページをレスポンス

SwaggerのBearer認証

(準備)Swagger EditorにBearerトークンの明記をしないといけない。
書き方はコチラ💁
Bearer Authentication(公式ドキュメント参照)
Authentication and Authorization(公式ドキュメント参照)

1、Swagger EditorにBearer認証を定義する

11.png

2、Swagger UIで「Authorize🔓」「🔓」(南京錠)アイコンが表示される

12.png

3、「Authorize🔓」または「🔓」アイコンをクリック

13.png

4、Value:の中に(例)sample_tokenを入力する

14.png

5、これでよければClose、もう一回やり直したいならLogout

15.png

6、Swagger UIのテスト実行(省略)

詳しくは、コチラ💁Swaggerでテストする方法
「Try it out」をクリック ⇒ 「Execute」をクリック

7、テスト結果の表示

16.png

レスポンスの中に「'Authorization: Bearer sample_token'」があります。動作確認完了です。

★開発ツールのネットワークタブの中の「Request Headers」からBearerトークンの確認ができるらしい(Swagger UIのページで開発ツールを確認したが、どこにもBearerトークンがなかった。これは実装しながら確認したいと思う)

トークンとか認証の通信(ネットワーク)は、実際のWEBアプリから目に見えるものではなく、イメージがつきにくいものです。

参考記事:
様々な認証方式について(Bearer,Basic,Digest,Form,OAuth)
HTTP 認証
Bearer認証について
Bearer Authentication
OpenAPI (Swagger) 3.0 で Bearer トークンの使用を定義する

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1