APIテストクライアント

1. アプリ概要

URL・メソッド・ヘッダー・ボディを設定してHTTPリクエストを送信しレスポンスを整形表示するツール。

このアプリはnetworkカテゴリの実践的なPythonアプリです。使用ライブラリは tkinter（標準ライブラリ）、難易度は ★★☆ です。

このアプリは「ネットワーク」カテゴリです。ネットワーク連携は Python の代表的な活用領域で、I/O 待ちと UI 更新の関係や非同期処理の考え方が他の Web API 連携にも直接活きます。tkinter（標準ライブラリ） を活かして実装するこの構造は、他のアプリにも応用が効きます。

動かしながら読むことが理解の最短経路です。まずはコードをコピーして実行し、想定どおりに動くことを確認したうえで解説と照らし合わせてください。

カスタマイズでは「機能追加」「UI 改善」「エラー耐性」の三方向で考えると視野が広がります。練習問題にもそれぞれの方向の具体例を用意しています。

2. 機能一覧

• 「▶ 送信」ボタン（_send()）・「⏹ キャンセル」ボタン（_cancel()）で操作
• マウス操作 <Double-1> から _load_history() を実行
• tk.Listbox による一覧表示（スクロールバー付き）
• messagebox.showwarning() によるダイアログ通知
• ウィンドウはタイトル「APIテストクライアント」・サイズ 1285x720 で起動

3. 事前準備・環境

Windows 11（実機）で起動と基本操作を確認しています（全機能の網羅テストではありません）。Linux Mint 22.3（仮想マシン）では起動と画面表示を確認しました。macOS は標準ライブラリの範囲で動作する想定ですが、未検証です。

• Python 3.10 以上
• OS: Windows 11（実機で起動・基本操作を確認）・Linux Mint 22.3（仮想マシンで起動・画面表示を確認）

4. 完全なソースコード

import tkinter as tk
from tkinter import ttk, messagebox
import urllib.request
import urllib.parse
import json
import threading
import time
from datetime import datetime


class App064:
    """APIテストクライアント"""

    def __init__(self, root):
        self.root = root
        self.root.title("APIテストクライアント")
        self.root.geometry("1285x720")
        self.root.minsize(1285, 720)
        self.root.configure(bg="#1e1e1e")
        self._history = []
        self._build_ui()

    def _build_ui(self):
        header = tk.Frame(self.root, bg="#252526", pady=6)
        header.pack(fill=tk.X)
        tk.Label(header, text="🔌 APIテストクライアント",
                 font=("Noto Sans JP", 12, "bold"),
                 bg="#252526", fg="#4fc3f7").pack(side=tk.LEFT, padx=12)

        # リクエスト行
        req_f = tk.Frame(self.root, bg="#2d2d2d", pady=6)
        req_f.pack(fill=tk.X, padx=8, pady=4)

        self.method_var = tk.StringVar(value="GET")
        ttk.Combobox(req_f, textvariable=self.method_var,
                     values=["GET", "POST", "PUT", "PATCH", "DELETE", "HEAD"],
                     state="readonly", width=8).pack(side=tk.LEFT, padx=4)

        self.url_var = tk.StringVar(
            value="https://jsonplaceholder.typicode.com/posts/1")
        ttk.Entry(req_f, textvariable=self.url_var,
                  width=55).pack(side=tk.LEFT, padx=4)
        ttk.Button(req_f, text="▶ 送信",
                   command=self._send).pack(side=tk.LEFT, padx=4)
        ttk.Button(req_f, text="⏹ キャンセル",
                   command=self._cancel).pack(side=tk.LEFT)
        self._thread = None
        self._cancelled = False

        main = ttk.PanedWindow(self.root, orient=tk.HORIZONTAL)
        main.pack(fill=tk.BOTH, expand=True, padx=4, pady=4)

        # 左: リクエスト設定
        left = tk.Frame(main, bg="#1e1e1e", width=400)
        main.add(left, weight=1)
        req_nb = ttk.Notebook(left)
        req_nb.pack(fill=tk.BOTH, expand=True)

        # ヘッダータブ
        hdr_tab = tk.Frame(req_nb, bg="#1e1e1e")
        req_nb.add(hdr_tab, text="ヘッダー")
        self._headers_text = self._make_editor(
            hdr_tab,
            "Content-Type: application/json\n"
            "Accept: application/json\n")

        # ボディタブ
        body_tab = tk.Frame(req_nb, bg="#1e1e1e")
        req_nb.add(body_tab, text="ボディ")
        body_type_f = tk.Frame(body_tab, bg="#252526")
        body_type_f.pack(fill=tk.X)
        self.body_type_var = tk.StringVar(value="JSON")
        for bt in ["JSON", "フォーム", "生テキスト"]:
            tk.Radiobutton(body_type_f, text=bt, variable=self.body_type_var,
                           value=bt, bg="#252526", fg="#ccc",
                           selectcolor="#3c3c3c",
                           activebackground="#252526").pack(side=tk.LEFT, padx=4)
        self._body_text = self._make_editor(
            body_tab,
            '{\n  "title": "テストpost",\n  "body": "内容",\n  "userId": 1\n}')

        # 認証タブ
        auth_tab = tk.Frame(req_nb, bg="#1e1e1e")
        req_nb.add(auth_tab, text="認証")
        self.auth_type_var = tk.StringVar(value="None")
        for at in ["None", "Bearer Token", "Basic Auth"]:
            tk.Radiobutton(auth_tab, text=at, variable=self.auth_type_var,
                           value=at, bg="#1e1e1e", fg="#ccc",
                           selectcolor="#3c3c3c",
                           activebackground="#1e1e1e").pack(anchor="w", padx=8, pady=2)
        tk.Label(auth_tab, text="値:", bg="#1e1e1e", fg="#ccc",
                 font=("Arial", 9)).pack(anchor="w", padx=8)
        self.auth_val_var = tk.StringVar()
        ttk.Entry(auth_tab, textvariable=self.auth_val_var,
                  width=36).pack(anchor="w", padx=8)

        # 履歴タブ
        hist_tab = tk.Frame(req_nb, bg="#1e1e1e")
        req_nb.add(hist_tab, text="履歴")
        self.history_list = tk.Listbox(hist_tab, bg="#0d1117", fg="#ccc",
                                        selectbackground="#1f6feb",
                                        font=("Courier New", 8),
                                        relief=tk.FLAT)
        self.history_list.pack(fill=tk.BOTH, expand=True)
        self.history_list.bind("<Double-1>", self._load_history)

        # 右: レスポンス
        right = tk.Frame(main, bg="#1e1e1e")
        main.add(right, weight=1)
        res_nb = ttk.Notebook(right)
        res_nb.pack(fill=tk.BOTH, expand=True)

        # レスポンスボディ
        body_res_tab = tk.Frame(res_nb, bg="#1e1e1e")
        res_nb.add(body_res_tab, text="レスポンス")
        self._response_text = self._make_editor(body_res_tab, "")

        # ヘッダー
        hdr_res_tab = tk.Frame(res_nb, bg="#1e1e1e")
        res_nb.add(hdr_res_tab, text="レスポンスヘッダー")
        self._res_header_text = self._make_editor(hdr_res_tab, "")

        # ステータスバー
        status_f = tk.Frame(self.root, bg="#007acc", pady=2)
        status_f.pack(fill=tk.X, side=tk.BOTTOM)
        self.status_lbl = tk.Label(status_f, text="準備完了",
                                    bg="#007acc", fg="#fff", font=("Arial", 9),
                                    anchor="w", padx=8)
        self.status_lbl.pack(side=tk.LEFT)
        self.time_lbl = tk.Label(status_f, text="",
                                  bg="#007acc", fg="#fff", font=("Arial", 9))
        self.time_lbl.pack(side=tk.RIGHT, padx=8)

    def _make_editor(self, parent, default=""):
        f = tk.Frame(parent, bg="#1e1e1e")
        f.pack(fill=tk.BOTH, expand=True)
        t = tk.Text(f, bg="#0d1117", fg="#d4d4d4",
                     font=("Courier New", 9), relief=tk.FLAT,
                     insertbackground="#fff", wrap=tk.NONE, undo=True)
        ysb = ttk.Scrollbar(f, command=t.yview)
        xsb = ttk.Scrollbar(f, orient=tk.HORIZONTAL, command=t.xview)
        t.configure(yscrollcommand=ysb.set, xscrollcommand=xsb.set)
        ysb.pack(side=tk.RIGHT, fill=tk.Y)
        t.pack(side=tk.LEFT, fill=tk.BOTH, expand=True)
        xsb.pack(fill=tk.X)
        if default:
            t.insert("1.0", default)
        return t

    def _send(self):
        url = self.url_var.get().strip()
        if not url:
            messagebox.showwarning("警告", "URLを入力してください")
            return
        method = self.method_var.get()
        self._cancelled = False
        self.status_lbl.config(text="送信中...")
        self._thread = threading.Thread(
            target=self._do_send, args=(method, url), daemon=True)
        self._thread.start()

    def _cancel(self):
        self._cancelled = True
        self.status_lbl.config(text="キャンセル")

    def _parse_headers(self):
        headers = {}
        for line in self._headers_text.get("1.0", tk.END).splitlines():
            if ":" in line:
                k, _, v = line.partition(":")
                headers[k.strip()] = v.strip()
        return headers

    def _do_send(self, method, url):
        start = time.time()
        try:
            headers = self._parse_headers()
            auth_type = self.auth_type_var.get()
            if auth_type == "Bearer Token":
                headers["Authorization"] = f"Bearer {self.auth_val_var.get()}"
            elif auth_type == "Basic Auth":
                import base64
                headers["Authorization"] = (
                    "Basic " + base64.b64encode(
                        self.auth_val_var.get().encode()).decode())

            body_str = self._body_text.get("1.0", tk.END).strip()
            data = body_str.encode("utf-8") if body_str and method != "GET" else None

            req = urllib.request.Request(url, data=data, method=method)
            for k, v in headers.items():
                req.add_header(k, v)

            with urllib.request.urlopen(req, timeout=15) as resp:
                if self._cancelled:
                    return
                status = resp.status
                reason = resp.reason
                resp_headers = dict(resp.getheaders())
                body = resp.read().decode("utf-8", errors="replace")

            elapsed = time.time() - start
            # JSON整形
            try:
                obj = json.loads(body)
                body = json.dumps(obj, ensure_ascii=False, indent=2)
            except Exception:
                pass

            self.root.after(0, self._show_response,
                             status, reason, resp_headers, body, elapsed,
                             method, url)
        except urllib.error.HTTPError as e:
            elapsed = time.time() - start
            try:
                body = e.read().decode("utf-8", errors="replace")
                try:
                    body = json.dumps(json.loads(body), ensure_ascii=False, indent=2)
                except Exception:
                    pass
            except Exception:
                body = str(e)
            self.root.after(0, self._show_response,
                             e.code, e.reason, {}, body, elapsed, method, url)
        except Exception as e:
            elapsed = time.time() - start
            self.root.after(0, self._show_response,
                             0, str(e), {}, str(e), elapsed, method, url)

    def _show_response(self, status, reason, headers, body, elapsed,
                        method, url):
        color = ("#4ec9b0" if 200 <= status < 300
                 else "#f48771" if status >= 400
                 else "#ffd700")
        self.status_lbl.config(
            text=f"HTTP {status} {reason}", fg=color)
        self.time_lbl.config(text=f"{elapsed*1000:.0f}ms")

        self._response_text.delete("1.0", tk.END)
        self._response_text.insert("1.0", body)

        hdr_str = "\n".join(f"{k}: {v}" for k, v in headers.items())
        self._res_header_text.delete("1.0", tk.END)
        self._res_header_text.insert("1.0", hdr_str)

        # 履歴に追加
        entry = f"[{datetime.now().strftime('%H:%M:%S')}] {method} {status} {url}"
        self._history.insert(0, (entry, method, url))
        self.history_list.insert(0, entry)

    def _load_history(self, event=None):
        sel = self.history_list.curselection()
        if not sel:
            return
        _, method, url = self._history[sel[0]]
        self.method_var.set(method)
        self.url_var.set(url)


if __name__ == "__main__":
    root = tk.Tk()
    app = App064(root)
    root.mainloop()

5. コード解説

APIテストクライアントのコードを、実際に書かれている実装に沿って解説します。

6. ステップバイステップガイド

このアプリをゼロから自分で作る手順を解説します。コードをコピーするだけでなく、実際に手順を追って自分で書いてみましょう。

1. 1
   ファイルを作成する

   新しいファイルを作成して app064.py と保存します。使うのは base64・datetime・json・threading・time・tkinter・urllib だけなので、追加インストールは不要です。

2. 2
   クラスの骨格を作る

   App064 クラスを定義し、__init__ と、末尾の root = tk.Tk() ～ mainloop() の最小構成を書いて、まず空のウィンドウが出ることを確認します。

3. 3
   ウィンドウを設定する

   title("APIテストクライアント")・geometry("1285x720")・configure(bg="#1e1e1e")・minsize(1285, 720) をコンストラクタで設定します。

4. 4
   画面部品を並べる

   _build_ui() の中で、tk.Frame×13・tk.Label×4・ttk.Combobox・ttk.Entry×2・ttk.Button×2・ttk.PanedWindow・ttk.Notebook×2・tk.Radiobutton（ループで生成）・tk.Listbox・tk.Text・ttk.Scrollbar×2 を作って配置します（掲載コードと同じ並び順で書くとレイアウトが一致します）。まず表示だけ確認しましょう。

5. 5
   イベントを接続する

   「2. 機能一覧」で挙げた各ボタンを command= で対応するメソッド（_send()・_cancel()）につなぎます。bind("<Double-1>", ...) の登録も忘れずに。

6. 6
   中心になるメソッドを実装する

   アプリの本体である _show_response()（20行）・_send()（11行）・_load_history()（7行）・_cancel()（3行） を実装します。

7. 7
   動作確認する

   python app064.py で起動し、各ボタンが反応すること・マウス操作（クリック・ホイールなど）が効くことを確認します。

7. カスタマイズアイデア

基本機能を習得したら、以下のカスタマイズに挑戦してみましょう。

8. よくある問題と解決法

9. 練習問題

アプリの理解を深めるための練習問題です。気になるものから挑戦してみてください（課題3は定型の発展課題です）。どちらの課題も、実際に HTTP リクエストを送って確かめます。送信先は、自分のパソコンで動かしたテスト用のサーバーだけにしてください。適当な空フォルダで python -m http.server 8000 を実行し、http://127.0.0.1:8000/ を指定します。他人のサイトや会社のシステムへ試し打ちをしないでください。POST・PUT・DELETE は相手のデータを変える操作です。認証タブに入れた値はファイルに保存されませんが、Basic 認証は Base64 に変換するだけで暗号化ではありません（183-185行）。トークンやパスワードは、スクリーンショットにも残さないでください。通信に使うのは標準ライブラリの urllib.request なので、追加のインストールは要りません。

1. 課題1：履歴から呼び出しても、送ったボディが戻らない

   送信すると履歴タブに1行増えます。この行をダブルクリックすると、メソッドと URL は戻ります。ですがヘッダーとボディは戻らないので、同じリクエストをもう一度送れません。

   期待結果：空フォルダで python -m http.server 8000 を起動する。メソッドを POST、URL を http://127.0.0.1:8000/ にして送信する。ステータスバーは HTTP 501 Unsupported method ('POST') になり、履歴に1行増える。ここでボディタブの中身を全部消してから履歴の行をダブルクリックすると、URL とメソッドだけが戻り、ボディは空のまま。直したあとは、送信したときのボディとヘッダーも一緒に戻る。

   合格条件

   • 履歴の行をダブルクリックすると、そのとき送ったボディとヘッダーが戻る
   • 履歴に残す文字（[時刻] メソッド ステータス URL）の形は変えない
   • 認証タブの値（トークンやパスワード）は履歴に残さない

   ヒント①（どこを触るか）: 触るのは2か所です。_show_response() の履歴へ足す部分（247-249行）と、_load_history()（251-257行）。
   ヒント②（使うもの）: self._history には (entry, method, url) の3つ組が入っています（248行）。ここへボディとヘッダーの文字列を足し、_load_history() の _, method, url = ...（255行）も同じ数で受け取ります。テキスト欄へ戻すときは delete("1.0", tk.END) のあとに insert("1.0", 文字列) です（239-240行が手本）。
   つまずきやすい点: self._history と self.history_list は、どちらも insert(0, ...) で先頭に足します（248-249行）。そのため番号のずれは起きません。認証タブの値まで履歴へ入れると、画面に出ないところに秘密の文字列が溜まります。種類（None・Bearer Token・Basic Auth）だけを戻し、値は毎回入れ直す作りが安全です。履歴はメモリの中だけにあり、アプリを閉じると消えます（保存する処理はありません）。

2. 課題2：つながらなかったときに HTTP 0 と表示される

   接続に失敗すると、ステータスバーが HTTP 0 ... になります。0 という HTTP のステータスコードはありません。サーバーが返した番号のように見えて紛らわしい表示です。

   期待結果：何も動いていないポート（例: http://127.0.0.1:9/）へ送信する。ステータスバーが黄色の HTTP 0 <urlopen error ...> になる。履歴にも GET 0 http://127.0.0.1:9/ の行が残る。直したあとは 通信エラー: ... のように、サーバーの応答ではないと分かる。

   合格条件

   • サーバーが返した 200・404・501 などの表示は今までどおり
   • つながらなかったときは HTTP 0 と出さず、通信のエラーだと分かる文にする
   • 経過時間とレスポンス欄の表示は今までどおり出る

   ヒント①（どこを触るか）: 触るのは2か所です。_do_send() の最後の except Exception as e:（225-228行）と、_show_response() の色を決める部分（232-236行）。
   ヒント②（使うもの）: _show_response() は status をそのまま文面に入れています（235-236行の f"HTTP {status} {reason}"）。status が 0 のときだけ別の文面と色にする分岐を足すのが最小の直し方です。エラー用の色は、同じ関数にある "#f48771" を使い回せます。
   つまずきやすい点: 404 や 501 のようにサーバーが応答を返した場合は urllib.error.HTTPError です。213行の分岐が受け持ちます。つながらない場合は urllib.error.URLError になり、225行へ落ちます。HTTPError は URLError の子クラスなので、except URLError を足すときは HTTPError よりあとに書いてください。先に書くと 404 まで通信エラー扱いになります。URL に http:// を書き忘れたときに出る例外は、ポートの有無で変わる点に注意してください。127.0.0.1:8000/ のようにポートがあると194行の urlopen() で URLError: <urlopen error unknown url type: 127.0.0.1>、example.com/api のようにポートが無いと190行の Request() で ValueError: unknown url type: ... になり、どちらも225行へ落ちます。

3. 課題3：新しいボタンを追加する

   既存のボタンと同じ書き方で新しいボタンを1つ足し、押されたときに動くメソッドを自作してみましょう。ボタンの作成と command= の接続がセットで身に付きます。