CDP ve MCP: AI browser kontrolünde hangisini ne zaman kullanmalı — Clawbrowser makale kapak görseli

CDP ve MCP: AI browser kontrolünde hangisini ne zaman kullanmalı

Clawbrowser Teamai-agentlericdpmcprehber

AI browser kontrolünde iki protokol öne çıkar: CDP (Chrome DevTools Protocol) ve MCP (Model Context Protocol). Farklı katmanlarda farklı sorunları çözerler ama browser agent geliştiren yazılımcılar sıklıkla ikisini karıştırır veya kullanım senaryosuna yanlış olanı seçer. Bu rehber her protokolün ne yaptığını, hangisini ne zaman kullanacağınızı ve production agent mimarisinde nasıl birlikte çalıştıklarını açıklar.

Özet: CDP, agent'a WebSocket bağlantısı üzerinden browsera doğrudan düşük seviyeli kontrol verir. MCP, LLM'e standart bir tool-use arayüzü üzerinden yüksek seviyeli browser araçları verir. CDP motordur; MCP direksiyondur. Çoğu production AI agent'ı ikisine de ihtiyaç duyar: LLM'in eylemlere karar vermesi için MCP, browserın gerçekten çalışması için altta CDP. Clawbrowser her ikisini de yerel olarak destekler.

Not: Bu makalede "CDP", browser kontrol standardı olan Chrome DevTools Protocol anlamında kullanılmaktadır.


CDP ve MCP gerçekte nedir

CDP: Chrome DevTools Protocol

CDP, Chromium browserları programatik olarak kontrol etmek için WebSocket tabanlı bir protokoldür. Google bunu Chrome DevTools (F12 ile açtığınız denetleyici) için geliştirdi ama browser otomasyonunun standardı haline geldi. Playwright, Puppeteer ve tüm büyük otomasyon kütüphaneleri CDP'yi dahili olarak kullanır.

Playwright'ta page.goto() çağırdığınızda WebSocket üzerinden browsera bir CDP komutu gönderilir. CDP size ayrıntılı kontrol verir: sayfalar arası gezinme, JavaScript çalıştırma, ağ isteklerini yakalama, cookies ile çalışma ve screenshot alma.

# CDP: your code controls the browser directly
from playwright.async_api import async_playwright

async with async_playwright() as p:
    browser = await p.chromium.connect_over_cdp("http://127.0.0.1:9222")

CDP'yi derinlemesine incelemek için AI agent'lar için CDP browser geliştirici rehberi yazısına bakın.

MCP: Model Context Protocol

MCP, LLM'lerin harici araçlara nasıl bağlandığını standartlaştıran bir protokoldür. Her araç için özel function-call tanımları yazmak yerine, LLM mevcut araçları bir MCP server üzerinden keşfeder ve standart bir arayüzle çağırır.

Browser kontrolü için bir MCP server; navigate, click, type, screenshot ve extract gibi eylemleri LLM'in çağırabileceği araçlar olarak sunar. LLM göreve göre hangi aracı çağıracağına karar verir. Playwright kodu yok, CSS selectors yok, agent'ta özel tool tanımları yok.

{
  "mcpServers": {
    "clawbrowser": {
      "command": "clawctl",
      "args": ["mcp", "serve"]

Bu yapılandırmayı Claude Code, Cursor, Gemini CLI veya MCP uyumlu herhangi bir agent'a ekleyin. LLM anında browser araçlarına kavuşur.

Neden karıştırılıyorlar

Her iki protokol de bir AI agent'ı browsera bağlar. İkisi de "protocol" kelimesini kullanır. İkisi de AI agent altyapısıyla ilgili aynı konuşmalarda geçer. Ama farklı katmanlarda çalışırlar:

  • CDP browser seviyesinde bir protokoldür. Chromium ile konuşur.
  • MCP uygulama seviyesinde bir protokoldür. LLM'lerle konuşur.

Bir MCP browser server, browserı kontrol etmek için dahili olarak CDP kullanır. Alternatif değillerdir. Aynı mimarideki katmanlardır.


Yan yana karşılaştırma

CDP (Chrome DevTools Protocol) MCP (Model Context Protocol)
Geliştiren Google (Chrome ekibi) Anthropic
Protokol türü Browser kontrolü (WebSocket) Araç kullanımı (stdio/SSE)
Kim çağırır Kodunuz (Playwright, Puppeteer, ham WebSocket) Bir LLM (Claude, GPT, Gemini)
Kontrol seviyesi Düşük: DOM, ağ, JavaScript çalıştırma, cookies Yüksek: navigate, click, type, screenshot, extract
Kurulum Browserın debugging portuna bağlanma Agent'ta MCP server yapılandırma
Esneklik Tam: browserın yapabildiği her şey Sunucunun açtığı araçlarla sınırlı
Eylem başına hız Milisaniye (inference yok) 0.5-3 saniye (LLM her adımda karar verir)
Hata yönetimi Kodunuz hataları yönetir LLM hatalar hakkında akıl yürütür
Algılama önleme Dahili değil (browsera bağlı) Dahili değil (browsera bağlı)
En uygun kullanım Betikli otomasyon, hassas kontrol, framework geliştirme LLM yönlendirmeli gezinme, açık uçlu görevler, hızlı prototipleme

İki protokolden hiçbiri algılama önleme sağlamaz. Bu browser seviyesinde bir sorundur, protokol sorunu değil. CDP üzerinden veya MCP server aracılığıyla bağlanan standart Chrome, aynı otomasyon sinyallerini sızdırır. Algılama önleme, Clawbrowser gibi motor seviyesinde bir çözüm gerektirir: 20'den fazla yüzeyde yönetilen fingerprint, dahili proxy routing ve Chromium kaynak kodunda CDP sinyal bastırma.


CDP'yi ne zaman kullanmalı

Browsera hassas programatik kontrol gerektiğinde ve adımları önceden bildiğinizde CDP kullanın.

CDP'nin kazandığı senaryolar:

  • Yapılandırılmış veri toplama. Hangi selectors'ı hedefleyeceğinizi, hangi veriyi çıkaracağınızı ve pagination'ı nasıl yöneteceğinizi biliyorsunuz. Kodunuz her seferinde aynı adımları çalıştırır.
  • Ağ yakalama. Kaynakları engellemeniz, request headers'ı değiştirmeniz, API yanıtlarını yakalamanız veya sayfa yüklenmeden önce JavaScript enjekte etmeniz gerekiyor.
  • Karmaşık bekleme koşulları. Belirli DOM öğelerinin görünmesini, network idle durumlarını veya JavaScript değişken değişikliklerini beklemeniz gerekiyor.
  • Performans kritik otomasyon. CDP komutları milisaniyede çalışır. Eylem başına LLM inference gecikmesi yok. CDP üzerinden saniyeler süren 50 adımlık bir veri toplama işi, her adımda LLM akıl yürütmesiyle dakikalar alır.
  • Framework geliştirme. Başkalarının kullanacağı bir agent framework, test ortamı veya otomasyon kütüphanesi geliştiriyorsunuz.
# CDP: full control, full responsibility
await page.wait_for_selector("#login-form")
await page.fill("#email", "[email protected]")
await page.fill("#password", credentials)
await page.click("#submit")

Takas: tüm browser bağlantı kodunu siz yazıp bakımını yaparsınız. Her selector, her bekleme koşulu, her hata yöneticisi. Hedef sayfanın yapısı değiştiğinde kodunuz bozulur.


MCP'yi ne zaman kullanmalı

LLM'in sayfada gördüklerine göre bir sonraki adıma karar vermesi gerektiğinde MCP kullanın.

MCP'nin kazandığı senaryolar:

  • Açık uçlu gezinme. "Fiyatlandırma sayfasını bul ve plan detaylarını çıkar." Agent gezinir, sayfayı okur ve sabit selector olmadan neye tıklayacağına karar verir.
  • Yargı gerektiren çok adımlı iş akışları. "Giriş yap, yeni fatura var mı kontrol et, tutar 500 doların üstündeyse indir." LLM her adımda sayfa içeriğini okuyarak koşullu mantığı yönetir.
  • Hızlı prototipleme. Playwright kodu yazmadan beş dakikada browser agent istiyorsunuz. MCP yapılandırmasını ekleyin, görevi tanımlayın, bitti.
  • Geliştirici olmayan kullanıcılar. Agent operatörü görevleri doğal dilde tanımlar. Kod gerekmez.
  • Agent-native ortamlar. Claude Code, Cursor ve Gemini CLI zaten MCP konuşur. Browser eklemek tek bir yapılandırma bloğudur.
# MCP: the LLM decides what to do
User prompt: "Go to example.com and tell me the page title"

LLM calls: navigate(url="https://example.com")
LLM calls: screenshot()

Takas: daha az hassasiyet. LLM yanlış öğeye tıklayabilir, fazladan adım atabilir veya sayfa içeriğini yanlış okuyabilir. Her eylem LLM inference gecikmesi taşır. Standart MCP browser araçları üzerinden ağ isteklerini yakalayamaz veya JavaScript enjekte edemezsiniz.


İkisini birlikte ne zaman kullanmalı

Çoğu production AI agent'ı buraya varır. MCP, LLM-agent arayüzünü yönetir. CDP, agent-browser arayüzünü yönetir. MCP server ikisi arasında oturur ve yüksek seviyeli araç çağrılarını düşük seviyeli browser komutlarına çevirir.

LLM  ←  MCP  →  MCP Server  ←  CDP  →  Browser
                 (clawctl)               (Clawbrowser)

LLM, MCP araç çağrıları gönderir ("bu URL'ye git," "giriş düğmesine tıkla"). MCP server bunları CDP komutlarına çevirip browsera gönderir. Sonuçlar aynı zincirden geri akar.

Browser katmanı neden önemli

Çoğu MCP browser server, standart bir Chrome instance'a CDP ile bağlanır. Browserda fingerprint yönetimi, proxy routing ve algılama önleme yoktur. Agent'ınız demo sitelerde çalışır ama Cloudflare, DataDome veya Akamai arkasındaki production web sitelerinde engellenir.

Clawbrowser'ın dahili MCP server'ı kendi Chromium motoruna bağlanır. LLM navigate çağırdığında MCP server, zaten yönetilen fingerprints, coğrafi olarak hizalanmış proxy routing ve motor seviyesinde CDP sinyal bastırma özelliğine sahip bir browsera CDP komutu gönderir. Stealth eklentisi, proxy ara yazılımı veya fingerprint rotasyon kodu gerekmez.

MCP yolu (LLM yönlendirmeli, sıfır bağlantı kodu):

{
  "mcpServers": {
    "clawbrowser": {
      "command": "clawctl",
      "args": ["mcp", "serve"]

CDP yolu (betikli, tam kontrol):

browser = await playwright.chromium.connect_over_cdp(
    "http://127.0.0.1:9222"
)

Her iki yol da aynı fingerprints, proxy routing ve algılama önleme ile aynı Clawbrowser instance'a bağlanır. Kullanım senaryonuza uyan arayüzü seçin. İş akışının farklı bölümleri farklı kontrol seviyeleri gerektirdiğinde aynı projede ikisini birden kullanın.

Her iki protokolle agent oluşturma adım adım rehberi için Web'de gezinen AI agent nasıl oluşturulur yazısına bakın.


Karar çerçevesi

Soru CDP MCP
Adımları önceden biliyor musunuz? Evet CDP kullanın
LLM neye tıklayacağına karar vermeli mi? MCP kullanın Evet
Ağ yakalamaya ihtiyacınız var mı? Evet Mevcut değil
Saniye altı eylem hızına ihtiyacınız var mı? Evet Hayır (LLM gecikmesi)
Geliştirici olmayanlar için mi oluşturuyorsunuz? Hayır Evet
Claude Code veya Cursor kullanıyor musunuz? Mevcut Yerel entegrasyon
Sıfır browser kodu mu istiyorsunuz? Hayır Evet

Her iki tarafta da "evet" yanıtınız varsa ikisini birden kullanın: LLM yönlendirmeli bölümler için MCP, hassas bölümler için CDP. Clawbrowser her iki protokol için browser katmanını yönetir.


FAQ

Browserı değiştirmeden CDP ile MCP arasında geçiş yapabilir miyim?

Evet, browserınız ikisini de destekliyorsa. Clawbrowser her profilde CDP endpoint sunar ve dahili MCP server ile gelir. Betikli otomasyon için Playwright'ı CDP endpoint'e bağlayın, LLM yönlendirmeli gezinme için MCP server'ı kullanın; ikisi de aynı fingerprints ve sessions ile aynı browser profilleri üzerinde çalışır. Her iki bağlantı yöntemi için Cursor'ı gerçek browsera CDP ile nasıl bağlarsınız rehberine bakın.

Hangi protokol daha hızlı?

CDP. Komutlar milisaniyede çalışır çünkü LLM inference yoktur. MCP eylem başına 0.5-3 saniye ekler çünkü LLM hangi aracı çağıracağına karar verip sonucu yorumlamak zorundadır. 50 adımlık veri toplama işi CDP ile saniyeler sürer. Aynı iş MCP ile dakikalar alır. Adımları bildiğiniz toplu otomasyon için CDP kullanın. Her adımda yargı gerektiren görevler için MCP kullanın.

WebDriver BiDi ne olacak?

WebDriver BiDi, hem WebDriver'ı (Selenium tarafından kullanılan) hem de CDP'nin bazı bölümlerini browsera bağımsız bir protokolle değiştirmeyi amaçlayan bir W3C standardıdır. Hala olgunlaşma aşamasındadır. Playwright ve Puppeteer dahili olarak hala CDP kullanır. WebDriver BiDi tam benimseme düzeyine ulaştığında CDP ile browser kontrol katmanında rekabet edecektir, MCP ile araç kullanımı katmanında değil. Bu makaledeki CDP-MCP karar çerçevesi, hangi düşük seviyeli browser protokolünün galip geleceğinden bağımsız olarak geçerlidir.

İki protokolden biri için anti-detect browsera ihtiyacım var mı?

Evet, agent'ınız anti-bot koruması olan sitelerde otomasyon yapıyorsa. Ne CDP ne de MCP algılama önleme içerir. Bunlar browsera komut göndermek için protokollerdir. Browser otomasyon sinyalleri sızdırıyorsa (navigator.webdriver, headless User-Agent, genel canvas hash), hangi protokolü kullanırsanız kullanın site engeller. Tam algılama modeli için Engellemeden browser otomasyonu yazısına bakın.


Başlayın

Clawbrowser'ı clawbrowser.ai adresinden kurulum komutunu AI agent'ınıza yapıştırarak yükleyin.

MCP yolu (LLM yönlendirmeli): Clawbrowser MCP server yapılandırmasını agent'ınıza ekleyin ve doğal dilde gezinmeye başlayın.

CDP yolu (betikli): Playwright veya Puppeteer'ı CDP endpoint'e bağlayın ve otomasyon kodunuzu yazın.

İkisi birden: LLM'in ne yapacağını düşündüğü bölümler için MCP kullanın. Hassas, hızlı ve deterministik kontrol gereken bölümler için CDP kullanın. Aynı browser, aynı fingerprints, aynı sessions.

CDP'yi derinlemesine incelemek için AI agent'lar için CDP browser geliştirici rehberi yazısını okuyun. Tam oluşturma rehberi için Web'de gezinen AI agent nasıl oluşturulur yazısını okuyun.

Continue exploring

Ask AI how Clawbrowser helps

Okumaya devam edin

Tümünü görüntüle →