Mac에서 Chrome DevTools MCP 대신 기존 브라우저 디버그 포트 사용법은? 기존 브라우저에 디버그 포트를 열어 Chrome DevTools MCP의 봇 차단 및 쿠키 유지 문제를 해결하세요. Automator로 Chrome Beta를 디버그 모드로 실행하고, `/Applications`에 저장한 후, codex config.toml에서 `--browser-url`을 설정하여 기존 브라우저에서 테스트를 진행할 수 있습니다.
chrome-devtools mcp 를 설치해서 사용하면 새로운 브라우저가 뜨고, 그러다보면 가끔 봇으로 인식해 차단되거나 또는 개발 단계에서 로그인이 필요한 서비스의 경우 쿠키 유지가 되지 않아서, 로그인 하는 처리까지 복잡해서 제대로 테스트 및 개발을 못하는 경우가 많다.
[mcp_servers.chrome-devtools]
command = "npx"
args = ["-y", "chrome-devtools-mcp@latest"]
startup_timeout_sec = 30.0다른 사이트에서 작성한 글을 보니, 기존 브라우저에서 debug port를 열어서 접속되게 하더라, 그래서 그걸 나도 적용하기로 했다. 하지만 이렇게 하게되면, 보안 상 위험이 있을 수 있지만, 애초에 Chrome Dev.app 을 실행하기 때문에 그나마 괜찮은 것 같기도 하다.
방법에 대해 설명하자면 (Mac OS 기준임)
Automator 앱을 실행한다.#!/bin/bash
open -a "Google Chrome Beta.app" --args \
--ignore-certificate-errors \
--remote-debugging-port=9222 \
--user-data-dir="$HOME/.chrome-debug-profile" \
--no-first-run \
--no-default-browser-checkGoogle Chrome Beta Debug.app 이름으로 앱을 저장하고, /Applications 경로에 넣는다.
이제 debug port 로 여는 브라우저 설정은 완료됬다.
근데, MacOS에서 웃긴게 있는데, --user-data-dir=/tmp/atlas-mcp 를 설정 안하고 default profile 로 실행할 경우에는 죽어도 debug mode 가 활성화 되지 않는다... (이걸 몰라서 몇시간동안 삽질했음, 윈도우에서는 안그랬던것 같은데 ㅡㅡ)
이제 마지막으로 codex config.toml 에서 인자 값을 수정해주면 된다.
[mcp_servers.chrome-devtools]
command = "npx"
args = ["-y", "chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222", "--headless=false", "--acceptInsecureCerts=true"]
startup_timeout_sec = 30.0browser-url 옵션 외에도 몇가지 옵션을 같이 설정해주면 된다.
그 이후에 codex cli 에서 브라우저에서 해당 페이지 접속해줘, 하게 되면 이미 열려있는 debug chrome dev profile 에서 접속하기 때문에, 해당 페이지에서 먼저 작업중인 페이지 로그인 해놓은 상태라면, 로그인 되어 있는 상태로 페이지가 열리기 때문에, 문제 없이 cli 를 통해 문제를 찾고 해결 할 수 있다.
이것은 보안적으로 문제가 있을 수 있지만, 애초에 debug port 는 외부에서 연결이 불가능한거로 알고 있다. 내부 네트워크(로컬)에서만 접속이 가능하다. (윈도우에서는 그랬음)
그래서 크게 문제되지 않을 것 같긴한데, 그래도 혹시 모르니 보안적으로 위험하고 이슈가 있을 수 있다는 사실만은 인지하면 좋을 듯하다. 또는 Chrome Dev 또는 Chrome Beta 를 따로 설치해서, 프로필을 분리해서 켜지게 하면 그나마 괜찮을 수 있을 것 같다.