SERPINFO

SERPINFO는 uBlacklist가 Google, Bing, DuckDuckGo와 같은 검색 엔진에서 작동할 수 있도록 하는 메커니즘입니다. 각 SERPINFO는 특정 검색 엔진의 결과 페이지에서 검색 결과를 찾는 방법을 설명하는 YAML 파일로, uBlacklist가 이를 통해 결과를 차단, 강조하거나 버튼을 첨부할 수 있게 합니다.

uBlacklist는 지원하는 검색 엔진에 대한 기본 내장 SERPINFO 정의를 함께 제공합니다. 다른 사람이 배포한 SERPINFO를 구독하거나, 아직 지원되지 않는 검색 엔진을 지원하기 위해 직접 작성할 수도 있습니다.

SERPINFO 옵션 페이지는 확장 프로그램 옵션 페이지의 기타 검색 엔진에서 열 수 있습니다. 여기에서 개별 SERPINFO를 활성화하거나 비활성화하고, 다른 사람이 배포한 것을 구독하며, 내 SERPINFO에서 직접 작성할 수 있습니다.

파일 형식

SERPINFO 파일은 다음 구조의 YAML 형식을 사용합니다:

name: SearchEngineName
version: 1.0.0
homepage: https://example.com/
lastModified: 2023-09-01T00:00:00Z

pages:
  - name: PageType
    matches:
      - https://search.example.com/search?*
    results:
      - root: .result-selector
        url: a.link
        props:
          title: .title
    commonProps:
      $site: example
      $category: web

최상위 속성

페이지 정의

pages 배열의 각 항목은 특정 유형의 검색 결과 페이지(웹, 이미지, 뉴스 등)를 나타냅니다:

결과 정의

results 배열의 각 항목은 단일 검색 결과에서 데이터를 추출하는 방법을 정의합니다:

명령

SERPINFO는 복잡한 추출 시나리오를 위한 다양한 명령을 지원하며, 세 가지 범주로 분류됩니다:

루트 명령

• <css-selector> 또는 [selector, <css-selector>]: CSS 선택자와 일치하는 요소 찾기
• [upward, <level>, <root-command>]: 루트 명령으로 찾은 각 요소에서 DOM 트리를 따라 <level>단계 상위로 이동

요소 명령

• <css-selector> 또는 [selector, <css-selector>, <element-command>?]: CSS 선택자로 요소 가져오기
• [upward, <level>, <element-command>?]: DOM 트리에서 <level>단계 상위로 이동

참고: 위 명령 중 어느 것에서든 <element-command>이 생략되면 현재 루트 요소가 암시적으로 사용됩니다.

속성 명령

• <css-selector>: CSS 선택자와 일치하는 요소에서 textContent 프로퍼티(기본값) 또는 href 속성(URL 추출에 사용될 때) 가져오기
• [attribute, <name>, <element-command>?]: 어트리뷰트(attribute) 값 가져오기
• [property, <name>, <element-command>?]: 프로퍼티(property) 값 가져오기
• [const, <value>]: 상수 문자열 반환
• [domainToURL, <property-command>]: 도메인을 URL로 변환
• [regexInclude, <pattern>, <property-command>]: 정규식과 일치하는 경우에만 포함
• [regexExclude, <pattern>, <property-command>]: 정규식과 일치하는 경우 제외
• [regexSubstitute, <pattern>, <replacement>, <property-command>]: 정규식으로 치환
• [or, [<property-command>*], <element-command>?]: 여러 명령을 순차적으로 시도

참고: 위 명령 중 어느 것에서든 <element-command>이 생략되면 현재 루트 요소가 암시적으로 사용됩니다.

버튼 명령

• [icon, <options>?, <element-command>?]: 특정 스타일의 아이콘 버튼 추가. 옵션:

  • style: 인라인 스타일 (예: "top: 16px; right: 32px; --ub-icon-size: 16px;")

• [text, <options>?, <element-command>?]: 특정 위치 및 스타일의 텍스트 버튼 추가. 옵션:

  • position: "beforebegin", "afterbegin", "beforeend" 또는 "afterend" (기본값: "beforeend")
  • style: 인라인 스타일 (예: "color: var(--fg-color); font-size: 14px;")

• [inset, <options>?, <element-command>?]: 요소 내 특정 위치에 버튼 추가. 옵션:

  • top: CSS 길이 단위 또는 백분율
  • right: CSS 길이 단위 또는 백분율
  • bottom: CSS 길이 단위 또는 백분율
  • left: CSS 길이 단위 또는 백분율
  • zIndex: z-index 값 (기본값: 1)

참고: <element-command>이 생략되면 현재 루트 요소가 사용됩니다.

예시

다음은 Bing 이미지 검색의 예시입니다:

name: Bing
version: 0.1.0
homepage: https://github.com/ublacklist/builtin#readme
license: MIT
lastModified: 2023-04-05T11:11:20Z

pages:
  - name: Images (desktop)
    matches:
      - https://www.bing.com/images/search?*
    userAgent: desktop
    results:
      - root: [upward, 1, ".iuscp"]
        url:
          - regexSubstitute
          - '"purl":"([^"]+)'
          - "\\1"
          - [attribute, "m", ".iusc"]
        props:
          title: [attribute, "title", "li > a"]
        button: [inset, { top: "32px", right: 0 }, ".iuscp"]
    commonProps:
      $site: bing
      $category: images

구독

SERPINFO 배포하기

YAML 파일을 호스팅하고 구독 링크를 제공하여 SERPINFO 정의를 다른 사람들과 공유할 수 있습니다.

1. 위에서 설명한 형식에 따라 SERPINFO YAML 파일을 생성합니다
2. 공개적으로 접근 가능한 URL(예: GitHub, 개인 웹사이트)에 파일을 호스팅합니다
3. 다음 형식을 사용하여 사용자에게 구독 링크를 공유합니다:

https://ublacklist.github.io/serpinfo/subscribe?url=<url-encoded-url>

여기서 <url-encoded-url>은 URL 인코딩된 호스팅된 YAML 파일의 URL입니다.

SERPINFO 구독하기

SERPINFO 정의를 구독하려면:

1. 배포자가 제공한 구독 링크를 클릭합니다
2. 확장 프로그램의 옵션 페이지가 열리고 구독 추가 여부를 묻는 메시지가 표시됩니다
3. 확인을 눌러 확장 프로그램에 SERPINFO를 추가합니다