원문 캡처 · blog.danielbrain.ai
원문 캡처 · blog.danielbrain.ai

개발자 모드의 ChatGPT가 웹페이지 안에 있는 WebMCP 도구를 호출하도록 연결하는 실험이 공개됐다. 브라우저에서 동작하는 플러그인 프레임과 MCP 서버를 이용한 우회 방식으로, 현재는 개발자 모드와 Chrome 플래그 설정 등이 필요하다.

WebMCP는 웹페이지가 registerTool()로 도구 이름과 설명, 입력 형식, 실행 함수를 제공하면 브라우저의 에이전트가 이를 호출하는 방식이다. 별도 서버를 만들지 않아도 되고, 이미 로그인한 세션이나 화면의 상태를 활용할 수 있다는 장점이 있다. 다만 Chrome의 초기 구현은 플래그 뒤에 있으며, ChatGPT는 기본적으로 서버의 도구만 호출해 두 환경을 바로 연결할 수 없다.

실험에서는 ChatGPT 안에 웹페이지를 보여주는 프레임을 띄운 뒤, 페이지가 제공하는 도구 목록을 채팅 메시지로 모델에 전달한다. 모델이 도구를 호출하면 플러그인 MCP 서버가 요청을 브라우저로 전달하고, 페이지에서 실행된 결과도 다시 채팅 메시지로 보낸다. 따라서 MCP 서버는 웹페이지나 도구 실행 결과를 직접 보지 않는다. 데모 쇼핑몰은 장바구니 도구를 실행하기 전에 페이지 안에서 사용자에게 허용 여부를 묻는다.

웹페이지와 프레임 사이의 도구 전달에는 postMessage를 기반으로 한 라이브러리 glottis를 쓸 수 있다. 실험은 브라우저의 네이티브 WebMCP도 지원하지만, ChatGPT 프레임에 필요한 권한이 없으므로 현재는 플래그를 켜고 프레임에 권한을 부여하는 별도 Chrome 실행기가 필요하다.

이 방식은 실험적이며 제약이 있다. 도구 실행 결과가 정식 도구 응답이 아닌 채팅 메시지로 전달돼 간혹 오류가 나타날 수 있고, 도구를 호출할 때마다 새 플러그인 프레임이 열려 메모리에 상태를 저장하는 웹사이트에는 적합하지 않을 수 있다. 서버에 미리 등록한 정확한 출처의 웹사이트만 열 수 있고, 해당 사이트도 ChatGPT의 프레임 삽입을 허용해야 한다. 앱 디렉터리 등록이 아닌 개발자 모드에서만 사용할 수 있다.

사용하려면 ChatGPT에서 개발자 모드를 켜고 사용자 지정 MCP 서버를 인증 없이 추가한다. 서버 주소는 https://webmcp.danielbrain.ai/chatgpt-webmcp-bridge/mcp다. 채팅에서 플러그인을 @로 호출해 브라우저를 열고, 데모 쇼핑몰에서 허용을 누른 뒤 장바구니에 물건을 추가해 볼 수 있다. 다른 웹사이트를 연결하려면 직접 MCP 서버를 운영하고 해당 사이트의 출처를 등록해야 한다.

프로젝트는 GitHub와 npm에 공개돼 있으며, MIT 라이선스를 적용한 버전 0.1이다. 제작자는 이를 정식 연결이 마련되기 전까지 이용할 수 있는 실험이라고 설명한다.