웹페이지에서 링크 추출하기

Bun 의 HTMLRewriter API 는 HTML 콘텐츠에서 링크를 효율적으로 추출하는 데 사용할 수 있습니다. CSS 선택자를 연결하여 처리하려는 요소 텍스트 및 속성과 일치하도록 작동합니다. 이것은 웹페이지에서 링크를 추출하는 간단한 예입니다. .transform 에 Response Blob 또는 string 을 전달할 수 있습니다.

async function extractLinks(url: string) {
  const links = new Set<string>();
  const response = await fetch(url);

  const rewriter = new HTMLRewriter().on("a[href]", {
    element(el) {
      const href = el.getAttribute("href");
      if (href) {
        links.add(href);
      }
    },
  });

  // 응답이 처리될 때까지 대기
  await rewriter.transform(response).blob();
  console.log([...links]); // ["https://bun.com", "/docs", ...]
}

// Bun 웹사이트에서 모든 링크 추출
await extractLinks("https://bun.com");

---

상대 URL 을 절대 URL 로 변환하기

웹사이트를 스크래핑할 때 상대 URL(/docs 등) 을 절대 URL 로 변환해야 하는 경우가 많습니다. URL 해결을 처리하는 방법은 다음과 같습니다.

async function extractLinksFromURL(url: string) {
  const response = await fetch(url);
  const links = new Set<string>();

  const rewriter = new HTMLRewriter().on("a[href]", {
    element(el) {
      const href = el.getAttribute("href");
      if (href) {
        // 상대 URL 을 절대 URL 로 변환
        try { 
          const absoluteURL = new URL(href, url).href; 
          links.add(absoluteURL);
        } catch { 
          links.add(href); 
        } 
      }
    },
  });

  // 응답이 처리될 때까지 대기
  await rewriter.transform(response).blob();
  return [...links];
}

const websiteLinks = await extractLinksFromURL("https://example.com");

---

Bun 을 사용한 HTML 변환에 대한 전체 문서는 문서 > API > HTMLRewriter 를 참조하세요.