Better view request body and response body of LLM API (openai completion) in mitmproxy

中文文档

Quick Start

This project provides two tools (You can use both of them):

1. mitmproxy addon scripts, which can be added when executing mitmproxy/mitmweb
2. (mitmweb only) Tampermonkey script

Method 1: mitmproxy addon scripts

git clone https://github.com/sky-bro/mitmproxy-llm-better-view.git

Add persistent configuration in ~/.mitmproxy/config.yaml:

# ... your other configs
scripts:
  - <dir path>\addon\openai_req.py
  - <dir path>\addon\openai_res.py
  - <dir path>\addon\openai_res_sse.py

You can also specify the scripts at launch using the -s parameter: mitmweb -s .\openai_req.py -s .\openai_res.py -s .\openai_res_sse.py

Method 2: Tampermonkey script

1. make sure you have tampermonkey extension installed in your browser
2. install the tampermonkey script by opening mitmweb-llm-better-view.user.js

Development

Prerequisites

• Node.js (v18+)
• npm

Setup

git clone https://github.com/sky-bro/mitmproxy-llm-better-view.git
cd mitmproxy-llm-better-view/tampermonkey-script
npm install

Dev Mode

Start the dev server (uses vite-plugin-monkey):

npm run dev

This launches a local dev server. Visit the printed URL in your browser — Tampermonkey will prompt you to install a development version of the script that auto-reloads on code changes.

The script targets http://localhost:8081/* (default mitmweb port). Make sure mitmweb is running before testing.

Build

npm run build

The compiled userscript is output to dist/mitmweb-llm-better-view.user.js.

Project Structure

tampermonkey-script/
├── src/
│   ├── main.tsx                     # entry point
│   └── components/
│       ├── openai/                  # OpenAI API visualizers
│       └── anthropic/               # Anthropic API visualizers
├── dist/
│   └── mitmweb-llm-better-view.user.js  # built userscript
└── vite.config.ts                   # build config (vite-plugin-monkey)

How It Works

Method 1: mitmproxy addon scripts

This uses mitmproxy's contentviews to convert the request body and response content of OpenAI API into Markdown format for better viewing.

Method 2: Tampermonkey script

Uses JS to fetch data on the page and directly render it within the mitmweb interface for better viewing of LLM API requests and responses.