? 웹 상호 작용 에이전트를위한 비전 유틸리티?
? 메인 사이트 • ? 트위터 • ? 불화
웹 상호 작용을 자동화하기 위해 LLM을 사용해 보았을 때 다음과 같은 질문이 발생할 수 있습니다.
Reworkd에서, 우리는 웹 에이전트를위한 강력한 지각 시스템을 구축하기 위해 수만 개의 실제 웹 작업에 걸쳐 이러한 모든 문제를 반복했습니다. 아래 비디오에서는 Tarsier를 사용하여 최소한의 GPT-4 Langchain 웹 에이전트에 대한 웹 페이지 인식을 제공합니다.
Tarsier는 괄호를 통해 페이지에 상호 작용 가능한 요소를 시각적으로 태그 + 예를 들어 [23] . 이를 수행 할 때 LLM이 조치를 취할 수있는 요소와 ID간에 매핑을 제공합니다 (예 : CLICK [23] ). 상호 작용 가능한 요소를 페이지에서 볼 수있는 버튼, 링크 또는 입력 필드로 정의합니다. TARSIER는 tag_text_elements=True 통과하면 모든 텍스트 요소를 태그 할 수 있습니다.
또한 Page Screenshot을 비전이없는 LLM이 이해할 수있는 공백 구조화 문자열 (거의 ASCII 아트)으로 변환하기위한 OCR 알고리즘을 개발했습니다. 현재 비전 언어 모델에는 여전히 웹 상호 작용 작업에 필요한 세밀한 표현이 부족하기 때문에 이는 중요합니다. 우리의 내부 벤치 마크에서 Unimodal GPT-4 + Tarsier-Text는 GPT-4V + Tarsier-Screenshot을 10-20%로 이겼습니다!
| 태그 스크린 샷 | 태그 된 텍스트 표현 |
|---|---|
![]() | ![]() |
pip install tarsierTarsier를 사용한 에이전트 예제 요리 책을 방문하십시오.
우리는 현재 Google Vision 및 Microsoft Azure의 2 개 OCR 엔진을 지원합니다. Google의 서비스 계정 자격 증명을 만들려면 이에 대한 지침을 따르십시오. 답변 https://stackoverflow.com/a/46290808/1780891
Microsoft Azure의 자격 증명은 API 키와 엔드 포인트로 구성된 간단한 JSON으로 저장됩니다.
{
"key" : " <enter_your_api_key> " ,
"endpoint" : " <enter_your_api_endpoint> "
}이 값은 컴퓨터 비전 리소스의 키와 엔드 포인트 섹션에서 찾을 수 있습니다. https://learn.microsoft.com/en-us/answers/questions/854952/dont-find-find-your-key-endpoint의 지침을 참조하십시오
그렇지 않으면 기본적인 타르 시어 사용량이 다음과 같습니다.
import asyncio
from playwright . async_api import async_playwright
from tarsier import Tarsier , GoogleVisionOCRService , MicrosoftAzureOCRService
import json
def load_ocr_credentials ( json_file_path ):
with open ( json_file_path ) as f :
credentials = json . load ( f )
return credentials
async def main ():
# To create the service account key, follow the instructions on this SO answer https://stackoverflow.com/a/46290808/1780891
google_cloud_credentials = load_ocr_credentials ( './google_service_acc_key.json' )
#microsoft_azure_credentials = load_ocr_credentials('./microsoft_azure_credentials.json')
ocr_service = GoogleVisionOCRService ( google_cloud_credentials )
#ocr_service = MicrosoftAzureOCRService(microsoft_azure_credentials)
tarsier = Tarsier ( ocr_service )
async with async_playwright () as p :
browser = await p . chromium . launch ( headless = False )
page = await browser . new_page ()
await page . goto ( "https://news.ycombinator.com" )
page_text , tag_to_xpath = await tarsier . page_to_text ( page )
print ( tag_to_xpath ) # Mapping of tags to x_paths
print ( page_text ) # My Text representation of the page
if __name__ == '__main__' :
asyncio . run ( main ())Tarsier는 LLM이 각 요소에서 수행 할 수있는 작업을 식별 할 수 있도록 다양한 유형의 요소를 다르게 태그합니다. 구체적으로:
[#ID] : 텍스트 삽입 가능한 필드 (예 : textarea , 텍스트 유형의 input )[@ID] : 하이퍼 링크 ( <a> 태그)[$ID] : 기타 상호 작용 가능한 요소 (예 : button , select )[ID] : 일반 텍스트 ( tag_text_elements=True ) 우리는 Tarsier Development를 통해 당신을 일으키고 실행할 수있는 편리한 설정 스크립트를 제공했습니다.
./script/setup.shTarsier에서 사용하는 TypeScript 파일을 수정하면 다음 명령을 실행해야합니다. 이렇게하면 TypeScript를 JavaScript로 컴파일 한 다음 Python 패키지에 사용될 수 있습니다.
npm run build테스트에 Pytest를 사용합니다. 테스트를 실행하려면 간단히 실행하십시오.
poetry run pytest .잠재적 인 PR을 제출하기 전에 다음을 실행하여 코드를 형식화하십시오.
./script/format.sh bibtex
@misc{reworkd2023tarsier,
title = {Tarsier},
author = {Rohan Pandey and Adam Watkins and Asim Shrestha and Srijan Subedi},
year = {2023},
howpublished = {GitHub},
url = {https://github.com/reworkd/tarsier}
}