# ViewJSON - Full Documentation

> ViewJSON (viewjson.net) is a free, privacy-first online JSON viewer and formatter. It formats, validates, repairs, and minifies JSON, and instantly previews Base64-encoded images, audio, video, and PDF files embedded in JSON data. All processing happens entirely in the browser - no server upload, no registration, no data collection. It also includes an API Request Builder, a variable substitution system, and lossless URL-based sharing.

## About

ViewJSON was built to solve a common pain point for developers: inspecting JSON responses that contain Base64-encoded media (images, audio, video, PDF). Traditional JSON viewers display these as raw strings, forcing developers to manually decode and open them in separate tools. ViewJSON detects Base64 content automatically and renders inline previews - images display visually, audio and video become playable, and PDFs render natively.

Beyond media preview, ViewJSON provides a complete JSON workspace: formatting, validation, intelligent repair (fixing trailing commas, missing quotes, etc.), minification, and a persistent history system. The API Request Builder lets developers compose HTTP requests and export them as cURL or HTTP format. The variable system allows parameterizing JSON with named placeholders for tokens, URLs, or test data.

## Features

### JSON Formatting & Validation
- Paste or type JSON and get instant syntax highlighting and formatting
- Validation with clear error messages for malformed JSON
- One-click minification for compact output

### JSON Repair
- Intelligent repair powered by json-repair library
- Fixes common issues: trailing commas, missing quotes, unquoted keys, single quotes, comments
- Keyboard shortcut: Alt+Shift+R

### Live Media Preview
- Automatically detects Base64-encoded media in JSON values
- Supports both Base64 data URIs and plain URLs
- Toggle preview with the eye icon on any detected media field
- Supported formats:
  - Images: PNG, JPEG, GIF, WebP, BMP, ICO
  - Audio: MP3, WAV, OGG, M4A, FLAC
  - Video: MP4, WebM, AVI, MOV
  - Documents: PDF

### File to Base64 Conversion
- Paste any image or file directly into the editor
- The file is automatically converted to Base64 and inserted into the JSON
- Copy the Base64 string for use elsewhere
- Lossless clipboard restoration: copying truncated Base64 values restores the full original content

### API Request Builder
- Compose HTTP requests with custom URL, method (GET, POST, PUT, DELETE, PATCH), headers, and body
- Export as cURL command or HTTP format
- Variables can be used in URL, headers, and body for parameterized requests

### Variable System
- Insert named placeholders (variables) into JSON values
- Variables are color-coded by type: red for strings, green for numbers, blue for booleans, gray for null
- Define variable values once; they are substituted throughout the JSON when exporting or sharing
- Useful for parameterizing API tokens, environment URLs, or test data

### One-Click Sharing
- Compress JSON content into a shareable URL using pako compression
- No server upload - the entire payload is encoded in the URL
- Recipients open the link to instantly view the shared JSON with all formatting and media previews

### History & Auto-Save
- Automatically saves JSON content to browser-local IndexedDB storage
- Sidebar with full history list, sorted by last modified time
- Pin important records to prevent them from being deleted
- Configurable history limit (default: 50 unpinned records)
- Rename history entries for easy identification

## Frequently Asked Questions

**Is my data safe?**
Absolutely. ViewJSON processes everything locally in your browser. Your JSON data never leaves your device or gets uploaded to any server.

**How does sharing work?**
When you share, your JSON content is compressed and encoded directly into the URL - nothing is uploaded to any server. Recipients open the link to instantly view your data.

**How do I save my work?**
ViewJSON automatically saves your JSON to browser history. Click the sidebar icon to view and restore previous versions anytime.

**What are variables?**
Variables let you insert named placeholders for dynamic values. Perfect for parameterizing API tokens, environment URLs, or test data.

**What do variable colors mean?**
Variable badges are color-coded by type: red for strings, green for numbers, blue for booleans, and gray for null. This helps you spot types at a glance.

**How does the API Request Builder work?**
Enter a URL and customize HTTP method, headers, and body. Copy your request as cURL or HTTP format for use in terminal or other tools.

## Supported Languages

ViewJSON is fully localized in 10 languages. The default language (English) uses the root path; all other languages use a path prefix.

| Language | Code | URL Prefix |
|---|---|---|
| English | en | / (default) |
| 简体中文 (Simplified Chinese) | zh-hans | /zh-hans/ |
| 繁體中文 (Traditional Chinese) | zh-hant | /zh-hant/ |
| 日本語 (Japanese) | ja | /ja/ |
| 한국어 (Korean) | ko | /ko/ |
| Español (Spanish) | es | /es/ |
| Deutsch (German) | de | /de/ |
| Français (French) | fr | /fr/ |
| Português (Portuguese) | pt-br | /pt-br/ |
| Русский (Russian) | ru | /ru/ |

## Technical Specifications

- **Frontend framework**: Astro + React
- **Editor**: CodeMirror 6 with JSON language support
- **JSON repair**: @toolsycc/json-repair library
- **Compression**: pako (for URL sharing)
- **Storage**: IndexedDB (browser-local, for history)
- **Hosting**: Cloudflare Workers
- **Privacy**: Zero server-side processing; no cookies or tracking for core tool functionality
- **Open source**: https://viewjson.net

## Tutorials

- [How to Debug Base64 Images in JSON API Responses](https://viewjson.net/blog/how-to-debug-base64-images-in-json): Step-by-step guide to inspecting Base64-encoded images, audio, and video inside JSON API responses using ViewJSON's auto-detection and inline preview.
- [How to Convert Images to Base64 for Vision API Requests](https://viewjson.net/blog/how-to-convert-images-to-base64-for-api-requests): Tutorial on converting local images to Base64 strings for OpenAI GPT-4o Vision, Google Cloud Vision, and other AI APIs - entirely in the browser with no upload required.