>_ DevTrendsnl

Taal

Home

Talen

Secties

Frontend Backend Mobiel DevOps AI / ML GameDev Blockchain Embedded Beveiliging
Python

Hoe een neuraal netwerk te verbinden met een live browser met Browser Harness

Browser Harness

Iedereen die geprobeerd heeft om het web te automatiseren met taalmodellen kent deze frustratie. De agent begint vrolijk knoppen aan te klikken, maar blijft steken op het allereerste niet-standaard invoerveld of lastige captcha. Traditionele frameworks bieden een starre set tools: klikken, typen, scrollen. Als de vereiste actie niet in de codebase van de agent staat, valt de taak uit elkaar.

Het browser-use team stelde een andere aanpak voor in het browser-harness project. In plaats van te proberen alle mogelijke webpagina-scenario's van tevoren te voorzien, creëerden ze een wrapper die een LLM verbindt met je echte browser via het Chrome DevTools Protocol (CDP) en het model de mogelijkheid geeft om ontbrekende functies ter plekke te schrijven.

Wat is het idee achter de zelflerende wrapper

Een reguliere browser agent werkt geïsoleerd. Hij krijgt een geïsoleerde headless browser zonder opgeslagen sessies, cookies of autorisaties. Als gevolg daarvan gaat de helft van de tijd verloren aan inlogpogingen.

Browser Harness maakt rechtstreeks verbinding met je draaiende Chrome via de debug poort. Het model ziet onmiddellijk open tabs, je profielen en werkende omgeving.

Het interessantste deel zit in de code-afhandelingsmechaniek:

  1. De agent ontvangt een taak, bijvoorbeeld het downloaden van de laatste twintig video's van een sociaal media profiel of het invullen van een complex formulier met een bestand-dropzone.
  2. Het model controleert het lokale bestand agent-workspace/agent_helpers.py. Als er geen geschikte functie is om met het element te werken, schrijft de agent zelf een helper script.
  3. Het script wordt onmiddellijk uitgevoerd in de pagina-context. Als het succesvol werkt, wordt de functie opgeslagen in de werkruimte.
  4. Bij het uitvoeren van de volgende vergelijkbare taak hoeft de agent het wiel niet opnieuw uit te vinden maar gebruikt de eerder geschreven helper.

Tegelijkertijd blijft de kern van de bibliotheek zelf in de src/browser_harness/ map beschermd tegen wijzigingen. Het model breidt alleen zijn eigen lokale werkruimte uit, dus het risico op het breken van de kernlogica is minimaal.

Download mijn laatste 20 X video's

Hoe de lancering werkt

Het project is nauw geïntegreerd met agentic development environments zoals Claude Code of Codex. Om te beginnen, geef je assistent gewoon een kant-en-klaar installatie-prompt:

Install or upgrade browser-harness to the latest stable version with uv using Python 3.12, register the skill from `browser-harness skill`, and connect it to my browser. Ask whether I want local browser recordings enabled; default to no and preserve my existing preference on upgrades. Follow https://github.com/browser-use/browser-harness/blob/main/install.md if setup or connection fails.

Na het uitvoeren van het commando wordt het chrome://inspect/#remote-debugging tabblad geopend. Daar moet je het vakje voor remote debugging aanvinken zodat de agent toegang krijgt tot de CDP WebSocket:

Remote debugging setup

De hele stack wordt bijeengehouden door drie duidelijke bestanden:

  • Het install.md instructiebestand regelt de initiële verbinding met de browser via de debug poort.
  • Het SKILL.md bestand beschrijft interactiepatronen met pagina's voor de LLM.
  • Modules in de src/browser_harness/ directory onderhouden een persistente socket en geven commando's door.

Wat zit erin en welke technologieën worden gebruikt

Onder de motorkap gebruikt het project Python 3.12 en de uv package manager. Sessiebeheer gebruikt een directe WebSocket naar CDP, zonder zware wrappers zoals Selenium.

Deze aanpak geeft twee praktische voordelen:

  • Minimale latentie bij het verzenden van invoergebeurtenissen, scrollen en klikken.
  • Volledige toegang tot DOM, netwerkverzoeken en browseropslag zonder extra bruggen te hoeven opzetten.

Als je tientallen taken parallel moet uitvoeren, bieden de makers Browser Use Cloud infrastructuur aan met kant-en-klare proxies, bot-detector bescherming en captcha-oplossing. Maar voor dagelijks lokaal gebruik op je eigen browser is dat meer dan voldoende.

Praktische gebruiksscenario's

Waar zo'n tool echt tijd bespaart:

  • Gegevens verzamelen van privédashboards waar geen openbare API is en tweefactorauthenticatie is ingesteld. Je autoriseert één keer handmatig en draagt de routinematige rapportexport over aan de agent.
  • Bulk media-bestanden downloaden. De agent opent de pagina, scrolt door de feed, vindt de nodige videospeler-selectors en slaat bestanden op in een lokale map.
  • Testen van lay-outs en gebruikersscenario's. De agent doorloopt de gebruikersreis, schrijft zelf ontbrekende checks en slaat ze op in helpers.
  • Invullen van repetitieve formulieren in zakelijke CRM-systemen wanneer je een batch gegevens vanuit een spreadsheet moet overzetten.

Is het de moeite waard om te proberen

Als je actief agentic CLI-tools zoals Claude Code gebruikt en het beu bent om handmatig gegevens van pagina's naar de terminal te kopiëren, is het project zeker de moeite waard om te proberen. Het concept waarbij de agent zelf zijn gereedschapskist uitbreidt via persistente helpers lijkt veel levensvatbaarder dan het eindeloos opblazen van de system prompt.

Van de nadelen merk ik op dat het project zorgvuldige aandacht voor veiligheid vereist: door een LLM toegang te geven tot je hoofd-browser, deel je alle open sessies. Dus voor experimenten is het verstandiger om een apart Chrome-profiel aan te maken zonder gekoppelde bankpassen en kritieke diensten. Begin met eenvoudige parseerscenario's, kijk hoe de agent zijn eerste functies genereert in agent_helpers.py, en evalueer hoe goed dit formaat in je gebruikelijke stack past.

Gerelateerde projecten