Dynamic Business‑Trip Form Automation with Model‑Context‑Protocol (MCP)
trip_mcp.py는 브라우저 상의 출장발의(여행 신청) 폼을 자동으로 탐색·입력·제출하는 MCP 서버입니다.
FastMCP 툴 인터페이스를 통해 대화형 AI가 폼을 채우는 과정을 세밀하게 통제할 수 있으며, trip_form.html 예제의 단순한 HTML 페이지에 적용할 수 있습니다.
- 완전 자동화 : 브라우저(Chromium/Chrome)를 실행하여 입력 필드 탐색 → 값 자동 입력 → "Submit" 버튼 클릭까지 전 과정을 수행합니다.
- 폼 구조 추상화 :
inspect_form()툴이<input>,<textarea>,<select>요소를 스캔해 JSON 스키마를 반환합니다. → AI 에이전트는 스키마를 기반으로 필요한 값을 동적으로 결정하고, 누락된 정보만 사용자에게 질문하도록 설계할 수 있습니다. - MCP 호환 : FastMCP 런타임을 사용하여 Model‑Context‑Protocol 대화형 환경에 쉽게 통합됩니다.
- 확장성 :
FORM_URL환경 변수만 바꾸면 조직 내 다른 출장/휴가/구매 요청 폼에도 재사용 가능합니다.
project-root/
├─ trip_mcp.py # MCP 서버 (Python)
├─ trip_form.html # 샘플 출장발의 폼 (정적 HTML)
├─ mcp.json # 여러 MCP 서버를 한 번에 구동하기 위한 설정
└─ README.md # (현재 문서)
| 구분 | 최소 버전 | 비고 |
|---|---|---|
| Python | 3.10 | pyppeteer, fastmcp 사용 |
| Node.js | 18 LTS | Filesystem MCP, PDF Reader MCP 예제 |
| OS | Windows / macOS / Linux | Chrome / Chromium 설치 권장 |
# 1) uv 설치
$ pip install uv
# 2) pnpm 설치
$ Invoke-WebRequest https://get.pnpm.io/install.ps1 -UseBasicParsing | Invoke-Expression # Windows Powershell
$ curl -fsSL https://get.pnpm.io/install.sh | sh - # POSIX systems
$ wget -qO- https://get.pnpm.io/install.sh | sh - # POSIX systems, curl이 없는 경우
# 3) 소스 다운로드
$ git clone https://github.com/your-org/trip-automation-mcp.git
$ cd trip-automation-mcp
# 4) 가상환경 설정
$ uv venv .venv && source .venv/bin/activate # Windows: .venv\Scripts\activate
# 5) 모듈 설치
$ cd pdf-reader-mcp && pnpm install
$ pnpm run build
# 6) chromium 설치
$ uv pip install pyppeteer
$ $env:PYPPETEER_CHROMIUM_REVISION="1474721"; pyppeteer-install.exe # Windows Powershell
# 최초 uv run 할 때에 필요한 패키지를 자동으로 설치해줌
$ uv run trip_mcp.py
# 출력: Starting dynamic trip MCP server…또는 MCP 클라이언트 앱에서 MCP.json 등의 파일에 아래 내용 추가
{
"mcpServers": {
"tripAutomation": {
"command": "uv",
"args": [
"--directory",
"C:\\PATH\\TO\\DIR\\brower-form-control",
"run",
"trip_mcp.py"
],
"env": {
"FORM_URL": "file:///C:\\PATH\\TO\\DIR\\brower-form-control\\trip_form.html"
}
}
}
}사용자 : 나는 학술대회를 출장으로 다녀왔어. 다운로드 폴더에 학술대회 관련된 파일이 있을건데, 그걸 기반으로 출장발의를 웹브라우저로 올려줘. 빠진 정보가 있다면 나에게 요청해줘. 모든 과정에서 tool 기능을 적극적으로 활용해.
에이전트는 다음 순서로 MCP 툴을 호출하여 출장 신청을 완성합니다:
- list_allowed_directories() → 접근 가능한 디렉터리 목록 획득
- list_directory(path) → 다운로드 폴더 내 파일 목록 확인
- read_pdf(path) → PDF 파일 내용 파싱 (참가증, 영수증 등)
- ensure_browser() → 브라우저 초기화 및 출장 폼 페이지 접속
- inspect_form() → 폼 구조 JSON 획득
- 사용자에게 누락 정보 질문 (예: 출장 목적, 기간 등)
- submit_form(fields) → 폼 필드 자동 입력 및 제출
| 함수 | 설명 | 주의 사항 |
|---|---|---|
ensure_browser() |
브라우저(Chromium)와 새 탭을 띄우고 FORM_URL로 이동 |
headless=False 로 설정되어 화면을 직접 확인 가능 |
inspect_form() |
페이지 내 폼 요소를 스캔해 [ {id, label, tag, type, required}, … ] 리스트 반환 |
반환값을 그대로 LLM 컨텍스트에 넣어 필드‑값 매핑 생성 |
submit_form(fields) |
{ field_id: value } 딕셔너리를 받아 자동 입력 후 Submit 클릭 |
날짜 타입은 ISO(YYYY-MM-DD)로 자동 변환 |
툴 선언부 예시 (발췌):
@mcp.tool()
async def inspect_form() -> List[Dict[str, Any]]: # 폼 구조 조사
...mcp.json은 여러 MCP 서버를 하나의 프런트엔드에서 실행하기 위한 설정 파일입니다. 주요 항목:
- filesystem : 로컬 파일 시스템 탐색/읽기를 담당
- tripAutomation : 본 프로젝트의 MCP 서버 인스턴스
- pdf-reader-mcp : pdf 파일의 읽기를 담당
- 사용자는 “출장 자동화” 템플릿/명령을 선택해 대화를 시작합니다.
- 에이전트는
inspect_form()결과를 바탕으로 필수 필드를 파악합니다. - Filesystem MCP로 다운로드 폴더 내 학술대회 관련 파일(프로그램, 영수증 등)을 열람하여 자동으로 목적·도시·날짜 후보를 추출합니다.
- 부족한 정보(예: 출장 목적 상세, 동행자 여부)는 사용자에게 추가 질의합니다.
- 모든 값이 준비되면
submit_form()을 호출하여 브라우저에서 폼을 자동 제출합니다. - 최종적으로 “✅ Trip request submitted.” 메시지가 반환되면 완료!
prompt:
나는 학술대회를 출장으로 다녀왔어. 다운로드 폴더에 학술대회 관련된 파일이 있을건데, 그걸 기반으로 출장발의를 웹브라우저로 올려줘. 빠진 정보가 있다면 나에게 요청해줘. 모든 과정에서 tool 기능을 적극적으로 활용해.
{ "mcpServers": { "filesystem": { "command": "npx", "args": [ "-y", "@modelcontextprotocol/server-filesystem", "C:\\Users\\user\\Desktop", "C:\\Users\\user\\Downloads", "C:\\Users\\user\\Downloads\\mcp-study\\brower-form-control" ] }, "tripAutomation": { "command": "uv", "args": [ "--directory", "C:\\Users\\user\\Downloads\\mcp-study\\brower-form-control", "run", "trip_mcp.py" ], "env": { "FORM_URL": "file:///C:\\Users\\user\\Downloads\\mcp-study\\brower-form-control\\trip_form.html" } }, "pdf-reader-mcp": { "command": "node", "args": ["C:\\Users\\user\\Downloads\\mcp-study\\brower-form-control\\pdf-reader-mcp\\dist\\index.js"], "name": "PDF Reader (Local Build)", "env":{ "MCP_EXTRA_ROOTS": "C:\\Users\\user\\Downloads" } } } }