핵심 요약
기존의 자바스크립트 기반 분석 도구는 스크립트를 실행하지 않는 AI 크롤러의 방문을 감지하지 못하는 '블라인드 스팟'이 존재한다. 이를 해결하기 위해 Cloudflare Pages의 에지 미들웨어를 사용하여 모든 유입 요청의 User-Agent를 검사하고 AI 봇을 식별하는 시스템을 구축했다. 식별된 데이터는 Umami API를 통해 서버사이드에서 비동기적으로 기록되며, 이를 통해 어떤 AI 모델이 어떤 콘텐츠를 수집하는지 시각화할 수 있다. 이 방식은 클라이언트 성능에 영향을 주지 않으면서도 보이지 않는 봇 트래픽에 대한 완전한 가시성을 제공한다.
배경
TypeScript 기본 지식, Cloudflare Pages/Workers 환경 이해, HTTP Header (User-Agent) 구조 이해, 정규표현식 활용 능력
대상 독자
웹 개발자, MLOps 엔지니어, 기술 블로그 운영자, 데이터 수집 가시성을 확보하려는 콘텐츠 제작자
의미 / 영향
AI 모델 학습을 위한 데이터 크롤링이 급증하는 상황에서, 콘텐츠 소유자가 자신의 데이터가 어떤 AI 기업에 의해 소비되는지 정확히 파악하고 대응할 수 있는 기술적 토대를 제공한다.
섹션별 상세
export async function onRequest(context: EventContext): Promise<Response> {
const userAgent = context.request.headers.get('user-agent') || '';
const botName = detectAiBot(userAgent);
if (!botName) {
return context.next();
}
const url = new URL(context.request.url);
console.log(`[AI Bot] ${botName} → ${url.pathname} (${context.request.method})`);
const websiteId = context.env.PUBLIC_UMAMI_WEBSITE_ID;
if (websiteId) {
context.waitUntil(sendToUmami(websiteId, botName, context.request));
}
return context.next();
}Cloudflare Pages 미들웨어에서 AI 봇을 감지하고 비동기적으로 분석 데이터를 전송하는 핵심 핸들러 로직이다.
const AI_BOT_PATTERNS: ReadonlyArray<{ pattern: RegExp; name: string }> = [
{ pattern: /GPTBot/i, name: 'GPTBot' },
{ pattern: /ChatGPT-User/i, name: 'ChatGPT-User' },
{ pattern: /ClaudeBot/i, name: 'ClaudeBot' },
{ pattern: /PerplexityBot/i, name: 'PerplexityBot' },
// ...(중략)
];추적 대상이 되는 주요 AI 크롤러들의 정규표현식 패턴과 식별 이름 목록이다.



실무 Takeaway
- AI 크롤러 추적을 위해 클라이언트 사이드 스크립트 대신 에지 미들웨어 기반의 서버사이드 로직을 사용하면 100%의 감지율을 확보할 수 있다.
- 외부 API 호출 시 await 대신 waitUntil()을 사용하면 분석 데이터 전송 작업이 사용자 응답 속도에 영향을 주지 않도록 성능을 최적화할 수 있다.
- 정규표현식 기반의 단순한 봇 리스트 관리만으로도 외부 라이브러리 의존성 없이 가볍고 효율적인 탐지 시스템을 유지할 수 있다.
AI 요약 · 북마크 · 개인 피드 설정 — 무료
출처 · 인용 안내
인용 시 "요약 출처: AI Trends (aitrends.kr)"를 표기하고, 사실 확인은 원문 보기 기준으로 진행해 주세요. 자세한 기준은 운영 정책을 참고해 주세요.