본문으로 건너뛰기

© 2026 Molayo

Zenn헤드라인2026. 05. 25. 22:49

인증된 웹 페이지를 AI 지식화하기 위해 Chrome 확장 프로그램으로 PDF를 저장하는 이야기

요약

인증이 필요한 웹 페이지의 정보를 AI 지식화하기 위해 Chrome 확장 프로그램을 제작한 사례를 소개합니다. 단순 Markdown 변환 대신 레이아웃과 증거력을 유지할 수 있는 PDF 저장 방식을 채택하여 메타데이터와 함께 관리하는 워크플로우를 제안합니다.

핵심 포인트

  • 인증된 웹 페이지의 정보를 AI 참조용 지식으로 변환
  • 레이아웃 보존과 증적 활용을 위해 PDF 형식 선택
  • URL, 제목, 일시 등 메타데이터 자동 기록 기능
  • 반복적인 수동 저장 작업을 자동화하는 확장 프로그램 설계

서론

AI에게 참조시키고 싶은 정보일수록 인증(Authentication)의 내부에 있다.

예를 들어, SaaS의 관리 화면, 클라우드 서비스의 설정 화면, 사내용 포털, 계약 중인 서비스의 문서, 관리자만 볼 수 있는 도움말 페이지 등이 그렇다. 이러한 정보들은 일상적인 운영이나 설계 판단에는 중요하지만, 검색 엔진에는 보이지 않으며 AI에게도 그대로 전달하기 어려운 정보이다.

최근 나는 "채팅으로 얻은 지견", "운영 중에 조사한 내용", "검증을 통해 알게 된 것"을 Notion이나 파일로 남겨, AI의 지식(Knowledge)으로서 재사용하는 흐름을 만들고자 생각하고 있다. 한편으로는, 인증이 필요한 웹 페이지의 내용을 어떻게 안전하게 가져올 것인가가 과제였다.

그래서 최소한으로 동작하는 Chrome 확장 프로그램을 직접 제작했다.

현시점에서는 개인 이용을 전제로 한 시제품이며, 리포지토리(Repository) 이름도 공개하지 않았다. 아직 일반 공개를 할 단계는 아니지만, 만든 배경과 설계 방침은 같은 고민을 가진 사람들에게 참고가 될 것이라 생각하여 이 글에 정리한다.

해결하고 싶었던 과제

하고 싶었던 것은 단순하다.

브라우저에서 열려 있는 인증된 페이지를, 나중에 AI가 참조하기 쉬운 형태로 저장하고 싶다.

단, 단순히 HTML을 통째로 저장하고 싶은 것은 아니다. 목적은 웹 페이지를 그 시점의 모습에 가깝게 PDF로 변환하여, 나중에 AI나 사람이 참조할 수 있는 지식(Knowledge)으로 남기는 것이다.

구체적으로는 다음과 같은 형태를 목표로 하고 있다.

  • 표시 중인 페이지를 PDF로 저장한다
  • URL, 제목, 취득 일시 등의 메타 정보(Meta information)를 남긴다
  • 인증이 필요한 화면의 상태를 나중에 참조할 수 있는 형태로 유지한다
  • Notion, Google Drive, 로컬 폴더 등에 정리하기 쉽게 만든다
  • 장래에는 PDF를 AI로 요약하거나 태그(Tag)를 달 수 있도록 한다

한편, 인증된 페이지를 다루는 이상, 무엇이든 자동으로 수집하는 식의 설계는 하고 싶지 않았다.

왜 Markdown이 아니라 PDF인가

처음에는 AI에게 전달한다면 Markdown화가 좋아 보일 수도 있다.

하지만 인증된 웹 페이지나 관리 화면에서는 Markdown화만으로는 다루기 어려운 상황이 있다.

화면의 상태를 남기고 싶다

관리 화면에서는 본문뿐만 아니라 설정값, 표, 상태(Status), 버튼 배치, 경고 표시, 접기 영역 등이 중요한 경우가 있다.

Markdown으로 변환하면 화면상의 문맥이나 레이아웃이 손실될 수 있다. PDF라면 표시 시점의 상태를 비교적 그대로 남길 수 있다.

증적(Evidence)으로서 다루기 쉽다

운영이나 검증에서는 "이 시점에 이렇게 표시되어 있었다"라는 기록이 필요할 때가 있다.

PDF는 Markdown보다 증적으로 다루기 쉬우며, 메일 첨부, Google Drive 저장, Notion 첨부, 사내 공유에도 적합하다.

AI가 PDF를 읽을 수 있는 상황이 늘어나고 있다

최근에는 PDF를 AI에 읽히게 하여 요약하거나 Q&A를 하는 방식이 일반화되고 있다.

따라서 처음부터 Markdown으로 구조화하기보다, 우선 PDF로 안전하게 저장하고 필요에 따라 후속 단계에서 AI가 해석하게 하는 것이 운용에 맞을 수 있다.

기존 도구에서 만족스럽지 않았던 점

웹 페이지를 PDF로 만드는 방법 자체는 브라우저의 인쇄 기능을 사용하면 가능하다.

다만, 나의 용도에서는 다음과 같은 점이 마음에 걸렸다.

매번 반복되는 조작이 은근히 번거롭다

브라우저 표준 인쇄 기능으로도 PDF 저장은 가능하다. 하지만 저장 위치나 파일명, 페이지 제목, URL 기록 등을 매번 수동으로 정리하는 것은 번거롭다.

운영 작업이나 조사 도중에 몇 번이고 저장해야 하는 경우, 몇 번의 클릭이라는 수고도 지속하기 어렵게 만든다.

메타 정보를 남기기 어렵다

PDF 자체만으로는 나중에 보았을 때 "어떤 URL을, 언제, 어떤 목적으로 저장했는지" 알기 어려울 때가 있다.

AI 지식(Knowledge)으로 사용하려면 페이지 제목, URL, 취득 일시, 메모, 분류 태그와 같은 정보도 함께 남기고 싶어진다.

인증된 페이지를 외부 서비스에 맡기기 어렵다

공개된 웹 페이지라면 URL을 외부 서비스에 전달하여 PDF화하는 방법도 있다. 하지만 로그인 후의 페이지에서는 그렇게 할 수 없다.

인증 정보를 외부 서비스에 전달할 수는 없으며, Cookie나 토큰(Token)을 다루는 설계는 피하고 싶은 부분이다.

따라서 "브라우저에서 내가 지금 보고 있는 페이지만을 명시적인 조작으로 PDF화한다"는 형태가 자연스럽다고 생각했다.

왜 Chrome 확장 프로그램으로 만들었는가

인증된 페이지를 안전하게 다루기 위해서는 브라우저의 현재 탭에서 사용자 조작을 트리거(Trigger)로 PDF화를 하는 것이 이해하기 쉽다.

Chrome 확장 프로그램이라면 다음과 같은 구성으로 만들 수 있습니다.

  • 사용자가 확장 버튼을 누른다
  • 현재 표시 중인 탭만을 대상으로 한다
  • 페이지 제목이나 URL을 취득한다
  • 인쇄·PDF 저장 흐름을 따른다
  • 저장 시의 파일명이나 메타 정보(Meta information)를 정리하기 쉽게 한다
  • 필요에 따라 Notion이나 Google Drive로의 등록으로 연결한다

이러한 형태라면 상시 모니터링이나 자동 순회를 피할 수 있습니다.

특히 중요한 것은, "인증 정보(Authentication information)를 다루는" 것이 아니라, "사용자가 이미 브라우저에서 표시하고 있는 내용을 사용자 조작에 의해 PDF로 저장한다"는 사고방식입니다.

초기 버전에서 할 수 있는 것

현재 시점의 구현은 아직 최소한의 수준입니다.

다만, 다음과 같은 흐름은 동작하도록 되어 있습니다.

  • Chrome에서 대상 페이지를 연다
  • 확장 프로그램을 실행한다
  • 페이지 제목이나 URL을 취득한다
  • 표시 중인 페이지를 PDF로 저장한다
  • 저장한 PDF를 나중에 AI 지식(AI Knowledge)으로 이용한다

아직 구현의 완성도를 높이는 단계는 이제부터이지만, 실제로 사용해 보니 "이 방향은 가능성이 있겠다"라고 느꼈습니다.

특히 관리 화면이나 SaaS의 설정 페이지를 조사한 뒤, 그 자리에서 바로 PDF로 남길 수 있는 점은 편리합니다.

설계 시 주의해야 할 점

이러한 종류의 도구는 편리하지만 신중하게 다룰 필요가 있습니다.

Chrome 확장 프로그램은 권한을 부여하는 방식에 따라 매우 강력한 액세스 권한을 가집니다. 인증된 페이지를 대상으로 한다면 더욱 그렇습니다.

개인용 도구라 할지라도 다음과 같은 방침은 명확히 해두고 싶습니다.

1. 자동 수집하지 않기

백그라운드(Background)에서 멋대로 페이지를 수집하는 것이 아니라, 사용자가 명시적으로 조작했을 때만 PDF화하는 설계로 합니다.

AI 지식화에서는 수집하는 양을 늘리는 것보다, 의도적으로 선택한 정보를 남기는 것이 더 중요합니다.

2. 대상 탭을 한정하기

가능한 한 현재 활성화된(Active) 탭만을 대상으로 합니다.

모든 웹사이트에 상시 액세스할 수 있는 권한은 편리하지만 리스크도 커집니다. Chrome 확장 프로그램에서는 activeTab과 같은 개념을 활용하여, 필요한 때에만 일시적으로 대상 탭에 액세스하는 설계를 하고 싶습니다.

3. 외부 전송을 명시하기

장래에 Notion API, Google Drive API, AI API와 연동하는 경우에도, 어떤 내용을 어디로 보내는지는 명시해야 합니다.

적어도 다음 정보는 README나 화면상에서 알 수 있도록 하고 싶습니다.

  • 취득하는 정보
  • 취득하지 않는 정보
  • PDF 저장 위치
  • 외부 전송 여부
  • 전송 전 사용자 확인 여부

4. 비밀 정보를 의도치 않게 저장하지 않기

PDF화하는 페이지에는 개인 정보, 사내 정보, 액세스 토큰(Access token), 이메일 주소, 계약 정보 등이 포함될 가능성이 있습니다.

PDF는 화면 상태를 남기기 쉬운 반면, 불필요한 정보까지 남겨버릴 가능성이 있습니다. 따라서 저장 전에 대상 페이지를 확인하고, 필요하다면 표시 내용을 조정하는 운용이 필요합니다.

또한 폼(Form)의 값, hidden field, Cookie, localStorage, Authorization 헤더 등은 원칙적으로 취득·저장 대상에서 제외하는 것이 안전합니다.

5. 공개 버전과 개인 이용 버전을 분리하기

개인용으로 편리한 기능과 일반 공개해도 좋은 기능은 다릅니다.

특정 업무 환경이나 인증이 필요한 서비스에 의존하는 처리를 포함하는 경우, 그대로 OSS(Open Source Software)로 공개하는 것은 피하는 것이 좋습니다.

공개한다면 우선 기밀 요소를 포함하지 않는 샘플 버전으로 분리하는 것이 좋아 보입니다.

공개 여부

이번 확장 프로그램은 현재 시점에서는 private 상태로 유지하고 있습니다.

이유는 기능이 미완성이라서라기보다, 다루는 영역이 신중함을 요구하기 때문입니다.

인증된 페이지를 PDF화하여 AI 지식화하는 도구는 편리함과 리스크가 공존합니다. 개인용으로는 충분하더라도 타인이 사용하게 하려면 권한 설명, 개인정보 처리방침(Privacy policy), 저장 위치 명시, 샘플 데이터를 통한 검증, README 정비가 필요합니다.

따라서 현재의 판단은 다음과 같습니다.

  • Chrome Web Store 공개는 아직 하지 않음
  • GitHub를 통한 일반 공개도 아직 하지 않음
  • 리포지토리(Repository) 이름도 현시점에서는 공개하지 않음
  • 우선은 private로 사용하면서 개선함
  • 기술 블로그로서 배경과 설계 방침을 공개함
  • 장래에 샘플 버전을 별도의 리포지토리로 공개함

이 순서가 안전하다고 생각합니다.

향후 하고 싶은 것

앞으로는 다음과 같은 개선을 생각하고 있습니다.

PDF 저장 흐름 개선

첫 번째 과제는 저장 시의 번거로움을 줄이는 것입니다.

파일명, 제목, URL, 취득 일시, 대상 서비스명 등을 정리하기 쉽게 만들어, 나중에 다시 봐도 알 수 있는 PDF로 만들고 싶습니다.

예를 들어, 다음과 같은 명명 규칙 (Naming Convention)을 생각할 수 있습니다.

YYYYMMDD_service_title.pdf

또한, PDF의 첫 페이지나 별도의 파일에 메타 정보 (Meta Information)를 남길 수 있다면 나중에 검색하기가 더 쉬워질 것입니다.

저장 위치의 선택

저장 위치는 여러 가지를 고려할 수 있습니다.

  • 로컬 폴더 (Local Folder)
  • Google Drive
  • Notion Knowledge Hub
  • Obsidian Vault의 첨부 파일
  • GitHub 리포지토리 (Repository) 관리 대상 외 스토리지

제 용도에서는 Notion Knowledge Hub와 Google Drive의 조합에서 가능성을 느끼고 있습니다.

Notion은 검색, 정리, 외부 기억으로서 편리합니다. 한편으로, PDF 파일 자체는 Google Drive 등에 두고, Notion에는 메타 정보와 링크를 두는 구성도 좋을 것 같습니다.

AI 요약 및 태깅 (Tagging)

PDF를 저장할 뿐만 아니라, AI를 통해 다음과 같은 메타 정보를 붙이고 싶습니다.

  • 요약
  • 키워드
  • 관련 시스템
  • 중요도
  • 참조 URL
  • 작업 메모
  • 다음에 확인해야 할 사항

이것이 가능해지면 단순한 PDF 보관이 아니라, 운용 지식 (Operational Knowledge)으로서 재사용하기가 쉬워집니다.

지식 생성 플로우 (Knowledge Creation Flow)와의 통합

최종적으로는 다음과 같은 흐름으로 만들고 싶습니다.

  • 인증된 페이지를 연다
  • Chrome 확장 프로그램으로 PDF화 한다
  • PDF를 저장한다
  • AI로 요약 및 태깅을 한다
  • Notion Knowledge Hub에 메타 정보와 링크를 등록한다
  • 추후 ChatGPT나 다른 AI에서 참조한다

이것은 단순한 PDF 저장 도구가 아니라, AI 시대의 개인 및 팀을 위한 지식 수집 파이프라인 (Knowledge Collection Pipeline)에 가깝습니다.

요약

인증된 웹 페이지를 AI 지식화하기 위해, Chrome 확장 프로그램으로 PDF를 저장하는 메커니즘을 시작해 보았습니다.

현시점에서는 최소한으로 동작하는 단계이지만, 실제로 사용해 보니 다음과 같은 가치가 있을 것이라고 느끼고 있습니다.

  • AI에게 전달하기 어려운 인증된 정보를 자신의 관리하에 저장할 수 있다
  • 브라우저에서 보고 있는 페이지를 그 자리에서 PDF로 남길 수 있다
  • 화면 상태나 레이아웃을 증적 (Evidence)으로서 남기기 쉽다
  • Notion이나 Google Drive와 조합함으로써 외부 기억으로서 활용할 수 있다
  • 운용, 검증, 설계의 지견을 축적하기 쉬워진다

한편으로, 인증된 페이지를 다루는 이상, 안이한 일반 공개는 피해야 한다고도 느낍니다.

우선은 Private하게 키워 나가면서, 이 기사와 같이 배경이나 설계 방침을 공개한다. 그 후, 기밀 요소를 포함하지 않는 샘플 버전을 분리하여 OSS (Open Source Software)화 한다.

이 순서로 진행하는 것이 현재로서는 가장 좋아 보입니다.

AI에게 읽히고 싶은 정보가 반드시 인터넷상에 공개되어 있는 것은 아닙니다.

오히려 정말로 도움이 되는 정보일수록 인증의 안쪽이나 일상적인 작업 속에 있습니다.

그 정보를 안전하게, 자신의 관리하에, PDF로서 저장하고, AI가 다루기 쉬운 지식으로 변환해 나가는 것은 앞으로 점점 더 중요해질 것이라고 생각합니다.

Discussion

AI 자동 생성 콘텐츠

본 콘텐츠는 Zenn AI의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.

원문 바로가기
0

댓글

0