<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Chrome Extension on monkshark.dev</title><link>https://monkshark.github.io/tags/chrome-extension/</link><description>Recent content in Chrome Extension on monkshark.dev</description><generator>Hugo -- gohugo.io</generator><language>ko</language><lastBuildDate>Mon, 08 Jun 2026 00:00:00 +0000</lastBuildDate><atom:link href="https://monkshark.github.io/tags/chrome-extension/index.xml" rel="self" type="application/rss+xml"/><item><title>#1 - Copy as cURL이 토큰을 그대로 흘린다</title><link>https://monkshark.github.io/p/api-inspector-problem/</link><pubDate>Mon, 08 Jun 2026 00:00:00 +0000</pubDate><guid>https://monkshark.github.io/p/api-inspector-problem/</guid><description>&lt;p&gt;API Inspector는 브라우저 DevTools 안에 탭 하나로 들어가, 페이지가 주고받는 API 요청을 잡아 보여주고, 검색·마스킹·변환하고, 필요하면 그대로 다시 쏘는 확장이다. 한 줄로 줄이면 DevTools의 &amp;ldquo;Copy as cURL&amp;quot;을 검색·마스킹·변환·재현까지 끌어올린 도구다.&lt;/p&gt;
&lt;h2 id="network-탭은-보여주기만-잘한다"&gt;&lt;a href="#network-%ed%83%ad%ec%9d%80-%eb%b3%b4%ec%97%ac%ec%a3%bc%ea%b8%b0%eb%a7%8c-%ec%9e%98%ed%95%9c%eb%8b%a4" class="header-anchor"&gt;&lt;/a&gt;Network 탭은 보여주기만 잘한다
&lt;/h2&gt;&lt;p&gt;브라우저 기본 Network 탭은 요청을 잘 보여준다. 그런데 막상 개발하면서 하는 일은 보는 데서 끝나지 않는다. 정리하고, 검색하고, 다른 포맷으로 바꾸고, 남에게 넘기고, 그대로 재현하고, 문서로 남긴다.&lt;/p&gt;
&lt;p&gt;그리고 결정적으로, &amp;ldquo;Copy as cURL&amp;quot;은 &lt;code&gt;Authorization: Bearer ...&lt;/code&gt; 토큰을 한 글자도 빼지 않고 그대로 복사한다. 그걸 슬랙이나 지라에 붙이는 순간 자격증명이 영영 새어 나간다. 그래서 시작할 때 목표를 한 문장으로 박아 뒀다 — API 요청을 안전하게 공유하고, 받는 사람이 그대로 재현하게 한다.&lt;/p&gt;
&lt;h2 id="이름까지-철학에-맞췄다"&gt;&lt;a href="#%ec%9d%b4%eb%a6%84%ea%b9%8c%ec%a7%80-%ec%b2%a0%ed%95%99%ec%97%90-%eb%a7%9e%ec%b7%84%eb%8b%a4" class="header-anchor"&gt;&lt;/a&gt;이름까지 철학에 맞췄다
&lt;/h2&gt;&lt;p&gt;처음 이름은 API Sniffer였다. 직관적이긴 한데, sniffer(도청)라는 말이 &amp;ldquo;네트워크를 가로채지 않는다&amp;quot;는 이 도구의 핵심과 정면으로 부딪혔다. 그래서 API Inspector로 바꿨다. 이름 하나가 제품이 내세우는 약속을 배신하면 안 된다고 봤다.&lt;/p&gt;
&lt;h2 id="첫날-박은-한-줄-최소권한"&gt;&lt;a href="#%ec%b2%ab%eb%82%a0-%eb%b0%95%ec%9d%80-%ed%95%9c-%ec%a4%84-%ec%b5%9c%ec%86%8c%ea%b6%8c%ed%95%9c" class="header-anchor"&gt;&lt;/a&gt;첫날 박은 한 줄: 최소권한
&lt;/h2&gt;&lt;p&gt;가장 중요한 결정은 첫날 내렸다. webRequest도, host 권한도 쓰지 않는다. chrome.devtools API만 쓰고, storage 하나만 요청한다.&lt;/p&gt;
&lt;p&gt;이건 그냥 제약이 아니라 정체성에 가까웠다. 네트워크를 가로채는 확장은 사용자 신뢰를 깎고 웹스토어 심사도 까다롭다. 반대로 &amp;ldquo;DevTools API로만 동작한다 = 가로채지 않는다&amp;quot;는 그 자체가 팔 거리가 된다. 그리고 이 한 줄이 나중에 재전송 기능을 어떻게 만들지까지 전부 결정짓게 되는데, 그 고생은 3부에 적었다.&lt;/p&gt;
&lt;h2 id="돌아보면"&gt;&lt;a href="#%eb%8f%8c%ec%95%84%eb%b3%b4%eb%a9%b4" class="header-anchor"&gt;&lt;/a&gt;돌아보면
&lt;/h2&gt;&lt;p&gt;결국 방향은 &amp;ldquo;더 나은 Network 탭&amp;quot;이 아니었다. 안전하게 공유하고 그대로 재현하는 도구로 좁혔고, 이름까지 거기에 맞췄으며, 최소권한을 정체성으로 삼았다. 이 세 가지가 이후 모든 선택의 기준이 됐다.&lt;/p&gt;</description></item></channel></rss>