🐯
FastAPIでJWT認証付きREST APIを構築してみた【初心者向け+図解あり】
FastAPIでJWT認証付きREST APIを構築してみた【初心者向け+図解あり】
個人的なぼやき(フロントエンド出身のぼやき)
こんにちは、Takaです。
実はこれまで、フロントエンドの立場からAPIの裏側を深く意識したことがなかったんです。
fetchで叩けばJSONが返ってくる。それが当たり前だと思ってました。
でも、今回FastAPIで認証付きのAPIを自作してみて感じたのは、
「裏でこれだけ丁寧に設計されてるから、フロントは安心して使えるんだな」
ってことでした。
認証ロジック、トークンの安全性、データの扱い方……。
サーバー側の気持ちがちょっとわかって、これからのUI設計にも優しさが加わりそうです。
前回のZenn投稿「UUIDを使ったREST API設計で初心者がつまずいた3つのポイント」では、FastAPIでのCRUD API実装に挑戦しました。
今回はその続編として、JWT(JSON Web Token)を用いた認証付きのAPIを構築してみたので、つまずきポイントや構成含めてわかりやすくまとめていきます ✅
✅ やりたかったこと
-
/token
でユーザー認証 → トークン発行 -
Authorization: Bearer
でトークン付きリクエスト -
/items/
CRUD APIを認証必須に
📁 ディレクトリ構成
uuid_api/
├── main.py # アプリのエントリーポイント
├── auth.py # JWT認証関連の処理
├── crud.py # アイテムのCRUD処理
├── models.py # Pydanticモデル定義
├── database.py # ダミーDB定義
└── __init__.py # パッケージ初期化(空でOK)
🔑 JWT認証のフロー(図解)
graph LR
A[Login: /token POST] -->|username/password| B[認証 & トークン発行]
B --> C[アクセストークン返却]
C --> D[Authorize ボタンでUIにトークンセット]
D --> E[/items/ にGETやPOST]
E -->|トークン付き| F[認証チェックOK]
🧪 動作確認手順
-
/token
にusername=taka
,password=password123
でPOST - トークンをSwagger UI右上の「Authorize」に貼る
-
/items/
にGETリクエスト → 成功 🎉
※エラー例、bcryptバージョン不一致、インポートエラーなども経験 → bcrypt==3.2.0
で安定
✅ まとめ
- FastAPI + JWT + UUIDの構成は小規模アプリにちょうどよい
- ファイル分割して責務を明確に
- Swagger UIで認証テストも完結
次回はSupabaseやMySQL連携でデータの永続化+可視化ダッシュボード構築に挑戦予定です🔥
📦 GitHubリポジトリ(コード全文)
▶️ https://github.com/TKNRFJK1208/fastapi-uuid
応援 & フォロー励みになります!
Discussion