ConsoleSpy: 커서용 MCP 서버

브라우저 콘솔 로그를 캡처하여 Model Context Protocol(MCP)을 통해 Cursor IDE에서 사용할 수 있도록 해주는 도구입니다.

개요

이 도구는 다음으로 구성됩니다.

1. 브라우저에서 콘솔 로그를 캡처하는 서버
2. 이러한 로그를 Cursor에 제공하는 MCP 서버
3. 콘솔 로그를 서버로 보내는 브라우저 확장 프로그램

설치

서버 설정

1. 이 저장소를 복제하세요:지엑스피1
2. 종속성 설치:
   npm install
3. 커서에 대한 MCP 연결을 구성하려면 설정 스크립트를 실행하세요.
   ./setup.sh

브라우저 확장 프로그램 설치

1. Chrome 웹 스토어 에서 확장 프로그램을 설치하세요또는개발자 모드에서 확장 프로그램을 로드합니다.
   • Chrome을 열고 chrome://extensions/ 로 이동하세요.
   • "개발자 모드"를 활성화하세요(오른쪽 상단 모서리에서 토글)
   • "압축 해제된 항목 로드"를 클릭하고 이 저장소에서 extension 폴더를 선택하세요.

용법

서버 시작

1. 콘솔 로그 서버를 시작합니다.
   node mcp-server.js
2. 별도의 터미널에서 MCP 서버를 시작합니다.
   npx supergateway --port 8766 --stdio "node console-spy-mcp.js"

또는 시작 스크립트를 사용하여 두 서버를 동시에 시작할 수 있습니다.

커서 구성

설치 스크립트를 실행한 후에도 Cursor에 MCP 서버를 수동으로 추가해야 합니다.

1. 설정 > 기능 > 커서의 MCP로 이동하세요.
2. 다음을 사용하여 새로운 MCP 서버를 추가합니다.
   • 이름: ConsoleSpy
   • 유형: sse
   • URL: http://localhost:8766/sse

확장 기능 사용

1. 브라우저에서 확장 프로그램 아이콘을 클릭하여 켜기/끄기를 전환하세요.
2. 활성화하면 현재 탭의 모든 콘솔 로그가 서버로 전송됩니다.
3. 커서에서 이제 MCP 인터페이스를 통해 이러한 로그에 액세스할 수 있습니다.

사용자 정의

콘솔 로그 서버 포트 변경

콘솔 로그 서버에 다른 포트(기본값은 3333)를 사용해야 하는 경우 여러 곳에서 포트를 업데이트해야 합니다.

1. mcp-server.js 에서 port 변수를 변경합니다.
   const port = 3333; // Change to your desired port
2. console-spy-mcp.js 에서 URL을 새 포트와 일치하도록 업데이트합니다.
   const CONSOLE_SERVER_URL = 'http://localhost:3333/mcp'; // Change 3333 to your port
3. 브라우저 확장 프로그램의 content.js 에서 서버 URL을 업데이트합니다.
   const serverUrl = 'http://localhost:3333/console-logs'; // Change 3333 to your port
4. start-servers.sh 사용하는 경우 해당 포트 참조도 업데이트합니다.

중요: 모든 위치에서 동일한 포트 번호를 사용해야 합니다. 일관성을 유지하려면 프로젝트 파일에서 "3333"을 검색하여 모든 인스턴스를 원하는 포트 번호로 바꾸는 것이 좋습니다.

이미 포트 3333을 사용하는 다른 애플리케이션으로 로컬에서 테스트하는 경우 도구가 올바르게 작동하려면 이 포트를 변경하는 것이 필수입니다.

문제 해결

• 두 서버가 모두 실행 중인지 확인하세요.
• 디버깅 중인 탭에 대해 브라우저 확장 프로그램이 활성화되어 있는지 확인하세요.
• 커서 설정에 MCP 서버를 추가했는지 확인하세요.
• 로그가 나타나지 않으면 페이지를 새로 고치거나 서버를 다시 시작해 보세요.

특허

MIT 라이센스