🌟

【JWT】クライアントPCからシステムサーバに対して、JWTを送信する方法

2023/02/22に公開

概要

実際のコードを見せながら、どのようにクライアントPCからシステムサーバに対して、JWTを送信するか解説する。下記図のFrontendとAPI Serverのやり取りが、本記事の解説に該当する。

Authorization Header

まず、ユーザ側のFrontendからAPI Serverに対して、何を送信しているかおさらいする。送信している内容は、Authorization headerである。これは、クライアントからサーバに向けて、「認証のためのユーザ名とパスワード」を送信している。具体的にどのような平文かというと、下記の通り。

上記の"認証"にはさまざまな手法があるが、今回はBearer認証を用いて行なっている。そしてその次に、Bearer認証で使用するJWTが記載されている。

APIサーバを立ち上げる

クライアントからJWTを受け取るため、APIサーバを立ち上げる。まずは任意フォルダに下記コードをペーストする。

from flask import Flask, request

app = Flask(__name__)

@app.route('/headers')
def headers():
    auth_header = request.headers['Authorization']
    header_parts = auth_header.split(' ')[1]
    print(header_parts)
    return 'not implemented'

そして、任意のフォルダで下記コマンドを実行する。

export FLASK_=app.py;
flask run --reload

クライアント側からJWTを送信する

次に、クライアント側からAPIサーバに対して、JWTを送信する。まずはPostmanを立ち上げる。立ち上げたら、GETメソッドで、http://127.0.0.1:5000/headers と指定する。そして、Authorizationタブで、Bearer Tokenと指定して、Token名をourwonderfultokenと記載して、送信をクリックする。

そうすると、立ち上げたターミナル側で、JWTを受け取っていることを確認できる。

コードの解説

# まずはAuthorizationを取得するため、request内のAuthorizationを指定する
auth_header = request.headers['Authorization']

# Bearer xxxJWTxxxという形で情報取得するので、二つ目の情報取得できるようにindexを指定している。
header_parts = auth_header.split(' ')[1]

引用

https://atmarkit.itmedia.co.jp/ait/articles/1608/10/news021.html
https://qiita.com/h_tyokinuhata/items/ab8e0337085997be04b1
https://www.udacity.com/course/full-stack-web-developer-nanodegree--nd0044

次回ToDo

https://learn.udacity.com/nanodegrees/nd0044/parts/cd0039/lessons/d266ef96-8da1-4dc0-b5b1-d6c3e4af9923/concepts/c9957a38-a6eb-40e0-addc-c794f2023ffb
Validating Auth Header Formats and Defining our Decorator動画よりスタート
https://knowledge.udacity.com/questions/960098

Discussion