Brower MCP, 내 브라우저를 자동화 할 수 있도록

만약 Claude 가 내가 보고있는 웹 페이지를 탐색하고, 데이터를 추출할 수 있도록 하고싶다면 어떻게 해야할까요?

방법을 알아보겠습니다.

 

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

https://chromewebstore.google.com/detail/browser-mcp-automate-your/bjfgambnhccakkhmkepdoekmckoijdlc?pli=1

Browser MCP - Automate your browser using VS Code, Cursor, Claude, and more - Chrome 웹 스토어

위 크롬 웹스토어에서 Brower MCP 확장 프로그램을 설치합니다.

Claude Desktop 에 MCP 서버 추가

Claude 데스크탑의 설정 파일인 claude_desktop_config.json 에 다음과 같이 MCP 서버를 추가합니다.

파일의 위치는 일반적으로 ~/Library/Application Support/Claude/claude_desktop_config.json입니다.

{
  "mcpServers": {
    "browser-mcp": {
      "command": "npx",
      "args": ["-y", "@browsermcp/mcp"]
    }
  }
}

위와 같이 작성하면 추가가 된 것입니다.

Claude 재시작 및 연동 확인하기

Claude 데스크탑 앱을 재시작하고, 설정 > 개발자에 들어가봅니다.

brower-mcp 가 잘 적용된 것을 볼 수 있네요.

확장 프로그램 활성화하기

오른쪽 상단의 크롬 확장 프로그램(퍼즐 아이콘)을 클릭하여, Browser MCP 를 클릭합니다.

'연결' 버튼을 클릭하면 아래와 같이 확장 프로그램이 브라우저에 대한 디버깅을 시작한다는 안내창이 뜨게 됩니다.

 

Brower MCP는 사용자의 로컬 브라우저에서 실행되어서, 모든 브라우저 활동은 로컬에서 처리되므로

개인정보가 외부로 유출되지 않는다고 해요.

 

정말 MCP 의 세계가 무궁무진한 것 같네요! 이것저것 연동해보면서 재미를 붙여나가는 중입니다 :)

---

ref:

https://docs.browsermcp.io/welcome