블로그

ViewJSON 소개

핵심 요약

  • API 응답 JSON의 많은 Base64를 트리 안에서 이미지·오디오·비디오·PDF로 인라인 미리보기합니다.
  • 보기/편집은 브라우저에서만 처리합니다. 공유 링크는 클라이언트 AES-GCM 암호화, 서버에는 암호문만, 키는 URL의 해시(#)에 남습니다.
  • CodeMirror 6 기반 편집기. 대용량에 적합하며, 매우 큰 파일(약 100MB)에서는 경고가 뜰 수 있습니다.
  • AI/API 응답 디버깅, 멀티모달 본문 준비, 암호화 짧은 링크로 팀 공유에 유용합니다.

최종 업데이트:

ViewJSON은 무료 온라인 JSON 뷰어 겸 포맷터입니다. 기존 도구들이 모든 문자열 값을 일반 텍스트로 표시하는 것과 달리, ViewJSON은 Base64 인코딩된 콘텐츠를 자동으로 감지하여 이미지, 오디오 플레이어, 동영상 플레이어 또는 PDF 미리보기로 JSON 구조 안에 직접 렌더링합니다. 모든 렌더링은 브라우저에서 로컬로 처리됩니다. 공유 시 데이터는 클라이언트 측에서 AES-GCM으로 암호화되며, 서버에는 암호문만 저장되고 해독 키는 네트워크를 통해 전송되지 않습니다.

이 도구를 만든 이유

멀티모달 AI API(OCR, TTS, 비전 모델, 이미지 생성 등)는 요청과 응답에서 Base64 인코딩을 광범위하게 사용합니다. 개발 및 테스트 중에 다음과 같은 문제가 반복적으로 발생합니다:

번거로운 출력 미리보기

TTS 및 이미지 생성 API는 Base64 인코딩된 오디오와 이미지를 반환합니다. 이를 미리보려면 JSON 응답에서 문자열을 추출하여 온라인 디코더에 붙여넣는 작업을 매 필드마다 반복해야 합니다. AI API 출력을 디버깅하는 개발자를 위해, ViewJSON은 모든 Base64 미디어를 즉시 인라인으로 렌더링하여 수동으로 추출하는 번거로움을 없애줍니다.

오류가 발생하기 쉬운 입력 구성

OCR이나 비전 모델을 호출하려면 먼저 서드파티 사이트에서 이미지를 Base64로 변환한 후 API 도구의 요청 본문에 붙여넣어야 합니다. 이 과정에서 따옴표나 이스케이프 시퀀스가 쉽게 깨지고, 실제 로직 디버깅 대신 JSON 구문 수정에 시간을 낭비하게 됩니다. 비전 API용 입력 데이터를 구성할 때, ViewJSON은 편집기에 붙여넣은 이미지를 자동으로 Base64로 변환하여 올바른 JSON 구문을 안전하게 유지합니다.

확인이 어려운 기록

Postman이나 Fiddler는 요청 기록을 저장하지만, Base64 필드는 긴 인코딩 문자열로만 표시되어 실제 내용을 알 수 없습니다. 당시 전송하거나 수신한 미디어를 확인하려면 Base64 문자열을 하나씩 추출하여 별도로 디코딩해야 합니다. API 기록 검토를 단순화하기 위해, ViewJSON은 Base64 문자열을 시각적 미리보기로 렌더링하여 과거에 송수신된 미디어 페이로드를 언제든 쉽게 확인할 수 있도록 합니다.

그래서 ViewJSON을 만들었습니다. JSON을 붙여넣기만 하면 모든 이미지를 바로 보고, 오디오를 바로 듣고, 동영상을 바로 재생할 수 있습니다. 페이지를 벗어날 필요 없이.

사용 사례

AI API 응답 디버깅

Base64 인코딩 미디어가 포함된 API 응답을 ViewJSON에 붙여넣으세요. 모든 오디오, 이미지, 동영상이 자동으로 감지되어 JSON 구조 안에 인라인으로 렌더링됩니다. 수동 추출이나 외부 디코더가 필요 없습니다.

멀티모달 API 요청 본문 준비

편집기에 이미지를 직접 붙여넣으면 미리보기가 표시되는 동시에 JSON에 Base64 문자열이 저장됩니다. 복사하면 바로 사용할 수 있는 Base64 페이로드를 얻을 수 있습니다. 별도의 파일-Base64 변환 과정이 필요 없습니다.

팀과 JSON 공유

ViewJSON은 로컬에서 AES-GCM을 사용하여 JSON과 변수를 암호화한 후 암호문만 업로드하여 짧은 링크를 생성합니다. 해독 키는 URL 해시(#)에만 남으며 서버로 전송되지 않습니다. 수신자가 링크를 열면 모든 것이 브라우저에서 즉시 복호화됩니다.

일반 도구와의 차이

일반 온라인 JSON 도구, API 클라이언트 워크플로와 ViewJSON 비교 개요
일반 온라인 JSON 뷰어 API 클라이언트(기록 / 미리보기) ViewJSON
JSON 안의 Base64 미디어 주류 온라인 JSON 뷰어는 Base64를 일반 텍스트로만 보여 주며, 트리 안에서 이미지·오디오·비디오·PDF를 인라인 미리보기하지 않습니다. 저장된 기록에서 Base64는 긴 불투명 문자열로 남으며, 맥락에서 실제 미디어를 미리볼 수 없습니다. 매직 바이트(콘텐츠 시그니처)로 형식을 감지하고 트리 안에 이미지·오디오·비디오·PDF를 인라인 표시.
암호화된 팀 공유 클라이언트 AES-GCM 단축 링크처럼 서버에는 암호문만 두고 키는 URL #프래그먼트에만 두는 방식과 대등한 일반적인 대안은 없습니다. JSON은 보통 수동으로 복사합니다—암호문만 한 번에 만드는 단축 링크 워크플로와는 다릅니다. 공유 링크: 브라우저에서 AES-GCM, 서버에는 암호문만, 키는 # 해시에만—우리 서버로 전송되지 않음.
이미지 붙여넣기 → JSON 내 Base64 에디터에서 이미지를 붙여 JSON에 유효한 Base64를 한 단계로 넣는 흐름은 거의 없습니다. HTTP 요청 구성 중심이며, 문서 본문 전체에 붙여넣기로 Base64를 넣는 JSON 작업 공간이 아닙니다. 편집기에 이미지를 붙여넣으면 유효한 JSON을 유지한 채 Base64 삽입.
포맷, 검증, 복구 포맷과 검증은 흔하지만, 같은 화면에서 Base64를 미디어로 인라인 미리보기하는 기능은 사실상 나오지 않습니다. 요청/응답 본문은 텍스트 우선이며, 멀티모달 페이로드의 풍부한 인라인 미리보기는 범위 밖입니다. 포맷·검증·복구와 인라인 미디어 미리보기를 한 작업 공간에서.

기술 및 개인정보 보호

Astro + React 기반

아일랜드 아키텍처로 JavaScript 로딩을 최소화합니다. 인터랙티브 컴포넌트만 클라이언트 코드를 로드합니다. 기록은 localStorage가 아닌 IndexedDB에 저장되므로, 세션 간 데이터가 보존되며 대용량 API 페이로드도 안전하게 처리합니다.

CodeMirror 6 편집기

전문가급 코드 편집기로 구문 하이라이팅, 접기, 검색, 괄호 매칭을 지원합니다. 경고가 표시되기 전까지 최대 100MB의 파일을 처리할 수 있습니다.

CodeMirror 6 공식 프로젝트

Cloudflare Pages

Cloudflare의 글로벌 엣지 네트워크에 배포되어 전 세계에서 빠르게 로드됩니다.

데이터 프라이버시

모든 렌더링은 로컬에서 처리됩니다. 공유 시 데이터는 업로드 전에 클라이언트 측에서 AES-GCM으로 암호화되며, 서버에는 암호문만 저장됩니다. 해독 키는 URL 해시에 남아 우리 서버로 전송되지 않습니다.

MDN: SubtleCrypto (Web Crypto API)

자주 묻는 질문

ViewJSON이란 무엇인가요?

많은 API 응답에 포함된 Base64 미디어를 문서에서 이미지·오디오·비디오·PDF로 인라인 미리보기하는 무료 인브라우저 JSON 뷰어/포맷터입니다.

사이트를 쓰면 원본 JSON이나 복호화 키가 업로드되나요?

일반 보기/편집 시 데이터는 브라우저에 남습니다. 공유 링크는 AES-GCM 암호문만 업로드하며, 키는 URL 해시에 있어 서버로 보내지지 않습니다.

일반 ‘예쁘게 보기’ JSON 도구와 뭐가 다른가요?

흔한 뷰어는 문자열을 텍스트로만 보여 줍니다. ViewJSON은 멀티모달·AI 스타일 API의 긴 Base64를 가능한 한 미디어로 인라인 표시하는 데 중점을 둡니다.

파일이나 페이로드 크기 제한이 있나요?

매우 큰 파일을 처리할 수 있으며, 약 100MB 부근에서 이 페이지 다른 위치에서 안내하는 경고가 나올 수 있습니다.

문의

질문, 피드백 또는 기능 요청은 support@viewjson.net