Tarayıcı Kullanımı Bulut API'si Nasıl Kullanılır

Bu eğitim, yapay zeka destekli tarayıcı otomasyonunun gücünden yararlanmak için bilmeniz gereken her şeyi size adım adım gösterecektir. İster veri çıkarma otomasyonu yapmak, ister web uygulamalarınızı test etmek veya gelişmiş izleme araçları oluşturmak isteyin, bu rehber size başlamanız için gereken bilgi ve örnekleri sağlayacaktır.

Browser Use Cloud Nedir?

Browser Use Cloud, akıllı tarayıcı otomasyon ajanlarını programatik olarak oluşturmanıza ve yönetmenize olanak tanıyan güçlü bir platformdur. Bunu, web'de gezinebilen, web siteleriyle etkileşime girebilen ve sizin adınıza karmaşık görevleri yerine getirebilen bir sanal asistan filosu gibi düşünebilirsiniz.

Platformun temelinde "görev" kavramı yer alır. Görev, bir ajana doğal dilde sağladığınız bir dizi talimattır. Örneğin, bir ajana şöyle bir görev verebilirsiniz: "hacker-news.com'a git, en iyi 5 makaleyi bul ve başlıklarını ve URL'lerini bir dosyaya kaydet." Ajan daha sonra bu talimatları gerçek bir tarayıcı ortamında anlamak ve yürütmek için büyük bir dil modeli (LLM) kullanacaktır.

Browser Use Cloud'un en heyecan verici özelliklerinden biri gerçek zamanlı geri bildirim döngüsüdür. Oluşturduğunuz her görev bir live_url ile birlikte gelir. Bu URL, ajanın ne yaptığının canlı, etkileşimli bir önizlemesini sağlar. Ajanın gerçek zamanlı olarak gezinmesini izleyebilir ve hatta gerekirse kontrolü ele alabilirsiniz. Bu, hata ayıklama ve izlemeyi inanılmaz derecede sezgisel hale getirir.

API Anahtarınızı Alma

Ajan oluşturmaya başlamadan önce bir API anahtarına ihtiyacınız olacak. API anahtarı isteklerinizi doğrular ve hesabınıza bağlar.

<Note> API anahtarınızı almak için Browser Use Cloud'a aktif bir aboneliğinizin olması gerekir. Aboneliğinizi yönetebilir ve API anahtarınızı faturalandırma sayfasından alabilirsiniz: cloud.browser-use.com/billing. </Note>

API anahtarınızı aldıktan sonra güvende tuttuğunuzdan emin olun. Ona bir parola gibi davranın ve asla istemci tarafı kodunda ifşa etmeyin veya sürüm kontrolüne kaydetmeyin. Onu güvenli bir ortam değişkeninde saklamak en iyisidir.

export BROWSER_USE_API_KEY="your_api_key_here"

Fiyatlandırma Modelini Anlama

Browser Use Cloud API'si basit, kullandıkça öde fiyatlandırma modeline sahiptir. Bu, yalnızca kullandığınız kadar ödeme yapmanızı sağlayarak hem küçük hem de büyük ölçekli projeler için maliyet etkin olmasını sağlar. Fiyatlandırma iki ana bölümden oluşur:

1. Görev Başlatma Maliyeti: Başlattığınız her görev için $0.01 sabit ücret alınır. Bu, ajanınız için tarayıcı ortamını başlatma maliyetini karşılar.
2. Görev Adımı Maliyeti: Bu, ajanın attığı her eylem veya "adım" için maliyettir. Adım başına maliyet, ajanı güçlendirmek için seçtiğiniz LLM'ye bağlıdır.

LLM Adım Fiyatlandırması

Farklı LLM'lerin farklı yetenekleri ve fiyat noktaları vardır. Performans ve maliyet açısından ihtiyaçlarınıza en uygun modeli seçebilirsiniz. İşte mevcut her model için adım başına maliyetin bir dökümü:

Maliyet Hesaplama Örneği

Bir web sitesine giriş yapmayı, belirli bir sayfaya gitmeyi ve bazı verileri çıkarmayı içeren bir görevi otomatikleştirmek istediğinizi hayal edelim. Bunun yaklaşık 15 adım süreceğini tahmin ediyorsunuz. Güçlü GPT-4o modelini kullanmayı seçerseniz, toplam maliyet aşağıdaki gibi hesaplanacaktır:

• Görev Başlatma: $0.01
• Görev Adımları: 15 adım × $0.03/adım = $0.45
• Toplam Maliyet: $0.01 + $0.45 = $0.46

Bu şeffaf fiyatlandırma, maliyetlerinizi etkin bir şekilde tahmin etmenize ve kontrol etmenize olanak tanır.

İlk Ajanınızı Oluşturma: Bir "Merhaba Dünya!" Örneği

Şimdi heyecan verici kısma geldik! İlk tarayıcı otomasyon ajanınızı oluşturalım. Çok basit bir görevle başlayacağız: Google'a gidip "Browser Use" araması yapmak.

Yeni görevler oluşturmak için birincil uç nokta olan /api/v1/run-task uç noktasına bir POST isteği yapmak için curl kullanacağız.

curl -X POST <https://api.browser-use.com/api/v1/run-task> \\\\
  -H "Authorization: Bearer $BROWSER_USE_API_KEY" \\\\
  -H "Content-Type: application/json" \\\\
  -d '{
    "task": "Go to google.com and search for Browser Use"
  }'

Bu komutu inceleyelim:

• curl -X POST ...: Belirtilen URL'ye bir HTTP POST isteği gönderiyoruz.
• H "Authorization: Bearer $BROWSER_USE_API_KEY": Bu, kimlik doğrulama başlığıdır. API anahtarınızı içerir. Daha önce ayarladığımız ortam değişkenini kullanıyoruz.
• H "Content-Type: application/json": Bu başlık, API'ye JSON formatında veri gönderdiğimizi söyler.
• d '{ "task": "..." }': Bu, isteğimizin gövdesidir. task alanı, ajanımız için doğal dil talimatlarını içerir.

API Yanıtını Anlama

Bu isteği gönderdiğinizde, API yeni oluşturulan görev hakkında bilgi içeren bir JSON nesnesiyle yanıt verecektir. İşte bu yanıtın nasıl görünebileceğine dair bir örnek:

{
  "task_id": "ts_2a9b4e7c-1d0f-4g8h-9i1j-k2l3m4n5o6p7",
  "status": "running",
  "live_url": "<https://previews.browser-use.com/ts_2a9b4e7c-1d0f-4g8h-9i1j-k2l3m4n5o6p7>"
}

• task_id: Bu, göreviniz için benzersiz bir tanımlayıcıdır. Bu kimliği görevi daha sonra yönetmek için kullanacaksınız (örn. duraklatmak, devam ettirmek veya durdurmak için).
• status: Bu, görevin mevcut durumunu gösterir. Başlangıçta running (çalışıyor) olacaktır.
• live_url: Bu, canlı önizleme için URL'dir. Ajanınızın çalışmasını görmek için bu URL'yi tarayıcınıza kopyalayıp yapıştırın!

Etkileşimli Canlı Önizlemeler

live_url, Browser Use Cloud'un en güçlü özelliklerinden biridir. Bu sadece salt okunur bir video akışı değildir; tamamen etkileşimli bir oturumdur.

live_url'yi bir iframe kullanarak doğrudan kendi uygulamalarınıza yerleştirebilirsiniz. Bu, ajanlarınızın gerçek zamanlı görünümünü içeren özel panolar ve izleme araçları oluşturmanıza olanak tanır.

İşte canlı önizlemeyi yerleştirmek için basit bir HTML kod parçacığı:

<!DOCTYPE html>
<html>
<head>
  <title>Agent Live Preview</title>
  <style>
    body, html { margin: 0; padding: 0; height: 100%; overflow: hidden; }
    iframe { width: 100%; height: 100%; border: none; }
  </style>
</head>
<body>
  <iframe src="YOUR_LIVE_URL_HERE"></iframe>
</body>
</html>

YOUR_LIVE_URL_HERE'yi API yanıtındaki live_url ile değiştirin. Bu HTML dosyasını bir tarayıcıda açtığınızda, ajanın ekranını göreceksiniz. Kendi bilgisayarınızda gezinir gibi tıklayabilir, yazabilir ve kaydırabilirsiniz. Bu, aşağıdakiler için inanılmaz derecede faydalıdır:

• Hata Ayıklama: Bir ajan takılırsa, nedenini ve ekranında ne olduğunu hemen görebilirsiniz.
• Manuel Müdahale: Bir görev, otomatikleştirmesi zor bir adım gerektiriyorsa (karmaşık bir CAPTCHA'yı çözmek gibi), kontrolü ele alabilir, adımı manuel olarak tamamlayabilir ve ardından ajanın işine devam etmesine izin verebilirsiniz.
• Gösteriler: Paydaşlara otomasyonunuzun ne yaptığını göstermek için harika bir yoldur.

Görev Yaşam Döngüsünü Yönetme

Bir görev çalışırken, yaşam döngüsü üzerinde tam kontrole sahipsiniz. API kullanarak görevleri duraklatabilir, devam ettirebilir ve durdurabilirsiniz. Tüm yönetim işlemleri için task_id'ye ihtiyacınız olacak.

Bir Görevi Duraklatma ve Devam Ettirme

Bir görevi duraklatmak istemeniz için birçok neden olabilir. Belki web sayfasını manuel olarak incelemeniz gerekiyor veya devam etmeden önce harici bir olayın gerçekleşmesini beklemek istiyorsunuz.

Bir görevi duraklatmak için /api/v1/pause-task uç noktasına bir POST isteği gönderin:

curl -X POST <https://api.browser-use.com/api/v1/pause-task> \\\\
  -H "Authorization: Bearer $BROWSER_USE_API_KEY" \\\\
  -H "Content-Type: application/json" \\\\
  -d '{
    "task_id": "YOUR_TASK_ID_HERE"
  }'

Ajan mevcut adımını tamamlayacak ve ardından paused (duraklatılmış) durumuna geçecektir.

Görevi devam ettirmek için /api/v1/resume-task uç noktasına bir POST isteği gönderin:

curl -X POST <https://api.browser-use.com/api/v1/resume-task> \\\\
  -H "Authorization: Bearer $BROWSER_USE_API_KEY" \\\\
  -H "Content-Type: application/json" \\\\
  -d '{
    "task_id": "YOUR_TASK_ID_HERE"
  }'

Ajan kaldığı yerden devam edecektir.

Bir Görevi Durdurma

Bir görevi kalıcı olarak sonlandırmak isterseniz, /api/v1/stop-task uç noktasını kullanabilirsiniz. Bu, görev tamamlandığında, ters gittiğinde veya artık gerekmediğinde faydalıdır.

curl -X POST <https://api.browser-use.com/api/v1/stop-task> \\\\
  -H "Authorization: Bearer $BROWSER_USE_API_KEY" \\\\
  -H "Content-Type: application/json" \\\\
  -d '{
    "task_id": "YOUR_TASK_ID_HERE"
  }'

<Note> Bir görev durdurulduktan sonra devam ettirilemez. Tarayıcı ortamı yok edilir ve ilgili tüm kaynaklar temizlenir. </Note>

Gelişmiş Görev Oluşturma

"Merhaba Dünya!" örneği sadece bir başlangıçtı. run-task uç noktası sadece basit bir task dizesinden daha fazlasını destekler. Ek parametreler sağlayarak ajanınızın davranışını özelleştirebilirsiniz.

Bir LLM Seçme

Fiyatlandırma bölümünde gördüğümüz gibi, ajanıza güç vermek için birkaç farklı LLM arasından seçim yapabilirsiniz. run-task isteğinde model parametresini kullanarak modeli belirtebilirsiniz.

Örneğin, Claude 3.7 Sonnet modelini kullanmak için aşağıdaki isteği yaparsınız:

curl -X POST <https://api.browser-use.com/api/v1/run-task> \\\\
  -H "Authorization: Bearer $BROWSER_USE_API_KEY" \\\\
  -H "Content-Type: application/json" \\\\
  -d '{
    "task": "Go to reddit.com/r/programming and find the top post of the day.",
    "model": "claude-3.7-sonnet-20250219"
  }'

Bir model belirtmezseniz, API varsayılan bir model kullanacaktır; bu genellikle GPT-4o mini gibi maliyet etkin ve performanslı bir seçenektir.

Kendi İstemcinizi Oluşturma

curl basit testler için harika olsa da, Browser Use Cloud API'sini uygulamalarınıza uygun bir istemci kütüphanesi kullanarak entegre etmek isteyeceksiniz. Bunu yapmanın en iyi yolu, tür açısından güvenli bir istemci oluşturmak için OpenAPI spesifikasyonumuzu kullanmaktır.

OpenAPI spesifikasyonu, REST API'lerini tanımlamanın standart bir yoludur. Spesifikasyonumuzu burada bulabilirsiniz: http://api.browser-use.com/openapi.json.

Python İstemci Oluşturma

Python geliştiricileri için openapi-python-client'ı öneriyoruz. Tam tür ipuçlarıyla modern, async-first bir istemci oluşturur.

Önce, oluşturucu aracını kurun:

# We recommend using pipx to keep your global environment clean
pipx install openapi-python-client --include-deps

Şimdi, istemciyi oluşturun:

openapi-python-client generate --url <http://api.browser-use.com/openapi.json>

Bu, Python istemci paketinizi içeren yeni bir dizin oluşturacaktır. Bunu pip kullanarak kurabilirsiniz:

pip install .

Şimdi istemciyi Python kodunuzda kullanabilirsiniz:

import asyncio
from browser_use_api import Client
from browser_use_api.models import RunTaskRequest

async def main():
    client = Client(base_url="<https://api.browser-use.com/api/v1>")
    request = RunTaskRequest(task="Go to ycombinator.com and list the top 3 companies.")

    response = await client.run_task.api_v1_run_task_post(
        client=client,
        json_body=request,
        headers={"Authorization": f"Bearer {YOUR_API_KEY}"}
    )

    if response:
        print(f"Task created with ID: {response.task_id}")
        print(f"Live URL: {response.live_url}")

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

TypeScript/JavaScript İstemci Oluşturma

Frontend veya Node.js projeleri için openapi-typescript, OpenAPI spesifikasyonundan TypeScript tür tanımları oluşturmak için mükemmel bir araçtır.

Önce, oluşturucuyu bir geliştirme bağımlılığı olarak kurun:

npm install -D openapi-typescript

Ardından, oluşturucuyu çalıştırın:

npx openapi-typescript <http://api.browser-use.com/openapi.json> -o src/browser-use-api.ts

Bu, API için tüm tür tanımlarını içeren tek bir dosya, src/browser-use-api.ts oluşturacaktır. Daha sonra tür açısından güvenli istekler yapmak için bu türleri tercih ettiğiniz HTTP istemcisiyle, örneğin fetch veya axios ile kullanabilirsiniz.

İşte bir TypeScript projesinde fetch kullanan bir örnek:

import { paths } from './src/browser-use-api';

const API_URL = "<https://api.browser-use.com/api/v1>";

type RunTaskRequest = paths["/run-task"]["post"]["requestBody"]["content"]["application/json"];
type RunTaskResponse = paths["/run-task"]["post"]["responses"]["200"]["content"]["application/json"];

async function createTask(task: string, apiKey: string): Promise<RunTaskResponse> {
  const body: RunTaskRequest = { task };

  const response = await fetch(`${API_URL}/run-task`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${apiKey}`,
    },
    body: JSON.stringify(body),
  });

  if (!response.ok) {
    throw new Error(`API request failed with status ${response.status}`);
  }

  return response.json() as Promise<RunTaskResponse>;
}

async function run() {
  const apiKey = process.env.BROWSER_USE_API_KEY;
  if (!apiKey) {
    throw new Error("API key not found in environment variables.");
  }

  try {
    const result = await createTask("Find the current weather in New York City.", apiKey);
    console.log("Task created:", result);
  } catch (error) {
    console.error("Failed to create task:", error);
  }
}

run();