URL 언급을 사용하면 웹 콘텐츠를 Cline과의 대화에 직접 가져올 수 있습니다. @ 다음에 URL을 입력하기만 하면 Cline이 해당 웹페이지의 콘텐츠를 복사하여 붙여넣을 필요 없이 볼 수 있습니다. 채팅에서 @ 다음에 URL(예: @https://example.com)을 입력하면 Cline이 해당 웹페이지의 콘텐츠를 가져와 컨텍스트에 포함합니다. 이는 설명서 페이지, GitHub 문제, Stack Overflow 질문 또는 참조하려는 기타 모든 웹 콘텐츠에 적용됩니다. 외부 API 또는 라이브러리로 작업할 때 URL 언급을 지속적으로 사용합니다. API 작동 방식을 설명하거나 설명서 스니펫을 복사하는 대신 문서를 직접 참조합니다.
이 API로 인증을 구현하려고 합니다: @https://api.example.com/docs/auth

이 문서를 기반으로 액세스 토큰을 가져오는 코드를 작성하는 데 도움을 주시겠어요?
이렇게 하면 전체 설명서 페이지가 Cline에 제공되므로 모든 인증 요구 사항, 엔드포인트, 매개변수 및 예제를 볼 수 있습니다. 그러면 Cline은 공식 문서를 기반으로 더 정확하고 포괄적인 도움을 제공할 수 있습니다. URL 언급은 GitHub 문제 또는 토론을 참조하는 데 특히 유용합니다.
프로젝트에서 이 문제를 해결하려고 합니다: @https://github.com/our-org/our-repo/issues/123

현재 구현은 다음과 같습니다: @/src/components/Feature.jsx

문제를 해결하려면 어떤 변경을 해야 하나요?
이렇게 하면 설명, 댓글 및 코드 스니펫이나 스크린샷을 포함한 전체 GitHub 문제가 Cline에 표시됩니다. 그러면 Cline은 보고된 문제를 직접 해결하는 솔루션을 구현하는 데 도움을 줄 수 있습니다. 다음에 외부 설명서나 온라인 리소스로 작업할 때는 콘텐츠를 복사하여 붙여넣는 대신 URL 언급을 사용해 보십시오. Cline이 서식, 코드 예제 및 주변 정보를 포함한 웹페이지의 전체 컨텍스트를 볼 수 있으므로 더 정확한 도움을 받을 수 있습니다.

내부 작동 방식

메시지에서 URL 언급을 사용하면 내부적으로 다음과 같은 일이 발생합니다.
  1. 메시지를 보내면 Cline이 텍스트에서 @http://... 또는 @https://... 패턴을 감지합니다.
  2. 확장이 백그라운드에서 헤드리스 브라우저(Puppeteer)를 시작합니다.
  3. URL로 이동하여 페이지가 완전히 로드될 때까지 기다립니다.
  4. 브라우저가 텍스트, 서식 및 코드 예제를 포함한 페이지 콘텐츠를 캡처합니다.
  5. 콘텐츠가 구조를 유지하는 Markdown 형식으로 변환됩니다.
  6. 이 콘텐츠는 다음과 같은 구조화된 형식으로 메시지에 추가됩니다.
    <url_content url="https://example.com/docs">
    # 예제 API 설명서
    
    ## 인증
    
    API로 인증하려면 다음을 수행해야 합니다...
    
    const token = await api.authenticate({
      username: 'user',
      password: 'pass'
    });
    
    [Markdown 형식의 전체 웹페이지 콘텐츠]
    </url_content>
    
  7. 그런 다음 리소스를 확보하기 위해 브라우저가 닫힙니다.
  8. 포함된 웹페이지 콘텐츠가 포함된 이 향상된 메시지가 AI로 전송됩니다.
이 프로세스는 URL 언급을 사용할 때마다 자동으로 발생하므로 복사하여 붙여넣을 필요 없이 AI에게 웹페이지의 전체 콘텐츠에 대한 액세스 권한을 부여합니다.