Browser-Use 및 OpenClaw 중단 문제 해결: bf16.ai 고속 DOM + Vision 저거절 브라우저 에이전트

TL;DR · 브라우저 자동화 핵심 요약

• 브라우저 에이전트 중단 원인: 일반 챗봇 LLM은 스테이징 QA의 <input type="password">와 이용약관(#accept-tos) 체크박스를 피싱이나 대리 서명으로 오판해 JSON 대신 거절 문구를 반환합니다.
• 텍스트 DOM + Vision 듀얼 엔진: 고속 DOM 루프는 deepseek/deepseek-v4.1-flash-abliterated($0.30 / $0.05 / $1.20), 화면 캡처 기반 모달 인식은 zai-org/glm-5.3-flash-abliterated(Vision + Text, $0.24 / $0.06 / $1.00)로 처리합니다.
• 25단계 스테이징 스위트를 위한 설계: 스텝당 최대 4개 액션을 일괄 실행(max_actions_per_step=4)해 모델 왕복 횟수를 줄이며, bf16.ai의 abliterated 플래너는 실행 도중 멈춰 CI 러너에게 훈계를 늘어놓지 않습니다.

1. 왜 <input type="password">와 약관 체크박스가 CI 파이프라인을 멈추게 할까?

Browser-Use와 OpenClaw는 접근성 DOM 트리를 직접 읽어 프론트엔드 마크업 변경에도 강건한 자동화를 제공합니다. 그러나 자체 스테이징 환경에서 테스트 계정을 생성하고 약관 동의 박스를 체크하는 순간, 기존 모델의 안전 분류기가 오작동하며 AgentOutput JSON 스키마를 깨뜨립니다:

[browser-use] Step 11/25 -> URL: https://staging.billing-app.internal/signup/verify
[browser-use] Extracted 42 interactive DOM elements:
  [18] <input type="email" name="work_email" />
  [19] <input type="password" name="password" />
  [24] <input type="checkbox" id="accept-tos-privacy" />
  [25] <button type="submit">Create Staging Account</button>
[llm:response] finish_reason="stop" (0 tool_calls emitted)
  "I cannot enter authentication credentials, create user accounts, or accept legally binding Terms of Service agreements on your behalf."
[browser-use] ValidationError: AgentOutput JSON missing required field 'action'. Suite failed (exit 1).

2. bf16.ai 고속 DOM + 멀티모달 Vision 하이브리드 아키텍처

bf16.ai의 1M 컨텍스트 저거절 모델 두 가지를 조합하면 속도와 시각 인식을 모두 확보할 수 있습니다:

1. deepseek/deepseek-v4.1-flash-abliterated: 초저지연 텍스트 DOM 액션 루프 전담.
2. zai-org/glm-5.3-flash-abliterated(Vision + Text): 뷰포트 스크린샷과 DOM 인덱스를 동시에 판독하며 공식 FlashX($0.37/$1.25)보다 저렴한 $0.24/$1.00에 제공됩니다.

3. Browser-Use 프로덕션 코드 및 Playwright 네트워크 화이트리스트

use_vision=True와 max_actions_per_step=4를 설정해 이메일·비밀번호·약관 체크·제출을 한 턴에 일괄 실행합니다:

import asyncio, os
from langchain_openai import ChatOpenAI
from browser_use import Agent, BrowserConfig, Browser

# Primary fast DOM planner ($0.30/$0.05/$1.20 per 1M)
dom_llm = ChatOpenAI(
    base_url="https://api.bf16.ai/v1",
    api_key=os.environ["BF16_API_KEY"],
    model="deepseek/deepseek-v4.1-flash-abliterated",
    temperature=0.1,
)

# Multimodal Vision + Text planner ($0.24/$0.06/$1.00 per 1M)
vision_llm = ChatOpenAI(
    base_url="https://api.bf16.ai/v1",
    api_key=os.environ["BF16_API_KEY"],
    model="zai-org/glm-5.3-flash-abliterated",
    temperature=0.1,
)

async def run_staging_onboarding_suite():
    browser = Browser(config=BrowserConfig(headless=True))
    agent = Agent(
        task=(
            "1. Open https://staging.billing-app.internal/signup. "
            "2. Fill test account credentials from QA fixture, check #accept-tos-privacy, and submit. "
            "3. Complete the 3-step workspace wizard and assert that '/dashboard/ready' renders."
        ),
        llm=vision_llm,      # Native Vision + DOM reasoning without refusal lectures
        use_vision=True,
        browser=browser,
        max_actions_per_step=4,
    )
    history = await agent.run(max_steps=25)
    assert history.is_done(), "Staging onboarding E2E did not reach terminal assertion"

if __name__ == "__main__":
    asyncio.run(run_staging_onboarding_suite())

외부 도메인 이탈 방지는 프롬프트가 아니라 Playwright context.route() 코드로 강제하세요. CI 적용 전 **bf16.ai/playground**에서 Browser-Use JSON 프리셋을 즉시 테스트할 수 있습니다:

// Deterministic Playwright/CDP network guardrail (enforce domain policy in code, not RLHF!)
const ALLOWED_HOSTS = new Set([
  'staging.billing-app.internal',
  'auth-sandbox.billing-app.internal',
  'localhost',
]);

await context.route('**/*', async (route) => {
  const url = new URL(route.request().url());
  if (!ALLOWED_HOSTS.has(url.hostname)) {
    return route.abort('blockedbyclient');
  }
  return route.continue();
});

▲ bf16.ai 플레이그라운드(/playground): 프롬프트 무보관(ZDR) 환경에서 Browser-Use 온보딩 JSON 프리셋을 실시간 검증.

4. 25단계 E2E 지연 시간 및 토큰 비용 분석

브라우저 자동화에서는 모델 지연 시간이 25개의 순차 단계마다 그대로 누적됩니다. bf16.ai에서 max_actions_per_step=4와 스트리밍 응답을 함께 쓰면 25단계 회원가입 + 워크스페이스 설정 E2E 실행에 필요한 순차 모델 호출 횟수가 줄어듭니다. 실행당 소요 시간과 비용은 자체 스위트에서 직접 측정해 보세요. 구성별로 흔히 실패하는 지점은 다음과 같습니다:

브라우저 에이전트 구성	주요 실패 원인
일반 프론티어 챗 API (DOM)	비밀번호 및 ToS 체크박스 거절
미검증 로컬 Q4 모델	AgentOutput JSON 구문 오류
deepseek-v4.1-flash-abliterated	ARIA 없는 캔버스 오버레이만 누락
glm-5.3-flash-abliterated (Vision)	DOM + 시각 모달 모두 처리

5. 실전 브라우저 에이전트를 위한 4가지 운영 원칙

1. 운영 관리자 계정 대신 격리된 스테이징 계정을 사용하고 Playwright context.route()로 도메인을 고정하세요.
2. max_actions_per_step = 4로 다중 입력 필드를 단일 턴에 묶어 지연과 비용을 줄이세요.
3. 실제 결제 승인 URL은 코드 레벨에서 사람의 승인을 거치도록 차단하세요.
4. max_failures=3과 키별 일일 USD 한도를 함께 설정해 서버 장애 시 불필요한 재시도를 막으세요.