{"id":4052,"date":"2024-12-26T09:49:34","date_gmt":"2024-12-26T08:49:34","guid":{"rendered":"https:\/\/vielhuber.de\/?p=4052"},"modified":"2024-12-26T10:10:42","modified_gmt":"2024-12-26T09:10:42","slug":"browser-mit-ki-steuern","status":"publish","type":"post","link":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/","title":{"rendered":"Browser mit KI steuern"},"content":{"rendered":"\n<p>Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen. Bisher wurde hierf\u00fcr beispielsweise <a href=\"https:\/\/github.com\/puppeteer\/puppeteer\" target=\"_blank\" rel=\"noreferrer noopener\">Puppeteer<\/a> eingesetzt. Mit dem Aufkommen von KI er\u00f6ffnen sich nun neue M\u00f6glichkeiten, die Browserautomatisierung intuitiver und weniger wartungsintensiv zu gestalten \u2013 B\u00fchne frei f\u00fcr <a href=\"https:\/\/github.com\/browserbase\/stagehand\" target=\"_blank\" rel=\"noreferrer noopener\">Stagehand<\/a>.<\/p>\n\n\n\n<!--more-->\n\n\n\n<p>Um die Funktionsweise zu verdeutlichen, wollen wir im Folgenden beispielsweise die Front-LED-Lichter meines (schrottigen) Vodafone-Kabelbox-Zweitrouters \u2013 der neben anderen wichtigen Funktionen insbesondere keine direkte API bietet \u2013 \u00fcber das entsprechende Webinterface ab-\/anschalten. Zun\u00e4chst installieren wir dazu beide Tools in der Kommandozeile (<a href=\"https:\/\/nodejs.org\" target=\"_blank\" rel=\"noreferrer noopener\">Node<\/a> \\(\\geq\\)23 vorausgesetzt):<\/p>\n\n\n\n<p class=\"githubgist\" data-gist-file=\"install.sh\">53e4085b029089ec48bd0f5b954a6b50<\/p>\n\n\n\n<p>Schlie\u00dflich hinterlegen wir in einer .env-Datei unser Vodafone-Passwort sowie unseren OpenAI API-Key:<\/p>\n\n\n\n<p class=\"githubgist\" data-gist-file=\".env\">53e4085b029089ec48bd0f5b954a6b50<\/p>\n\n\n\n<p>Mit Puppeteer l\u00e4sst sich das Gew\u00fcnschte beispielsweise wie folgt realisieren:<\/p>\n\n\n\n<p class=\"githubgist\" data-gist-file=\"puppeteer.js\">53e4085b029089ec48bd0f5b954a6b50<\/p>\n\n\n\n<p>Stagehand hingegen nimmt in nat\u00fcrlicher Sprache geschriebene Befehle entgegen:<\/p>\n\n\n\n<p class=\"githubgist\" data-gist-file=\"stagehand.js\">53e4085b029089ec48bd0f5b954a6b50<\/p>\n\n\n\n<p>Egal ob du Webseiten scrapen, automatisch Formulare ausf\u00fcllen oder Tests f\u00fcr deine Web-App durchf\u00fchren willst \u2013 Browser-Fernsteuerung hilft. Die Integration von KI in die Browser-Fernsteuerung erm\u00f6glicht es, komplexe Aufgaben mit einfachen Anweisungen durchzuf\u00fchren, was die Entwicklung beschleunigt, und die Wartung erleichtert. Insbesondere wenn sich die DOM-Struktur \u00e4ndert, k\u00f6nnen Stagehand-Scripte robuster und weniger wartungsintensiv sein.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen. Bisher wurde hierf\u00fcr beispielsweise Puppeteer eingesetzt. Mit dem Aufkommen von KI er\u00f6ffnen sich nun neue M\u00f6glichkeiten, die Browserautomatisierung intuitiver und weniger wartungsintensiv zu gestalten \u2013 B\u00fchne frei f\u00fcr Stagehand.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"gtbabel_prevent_lngs":"","gtbabel_alt_lng":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-4052","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-blog"},"acf":[],"yoast_head":"<title>Browser mit KI steuern &#060; Vielhuber David<\/title>\n<meta name=\"description\" content=\"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen...\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Browser mit KI steuern &#060; Vielhuber David\" \/>\n<meta property=\"og:description\" content=\"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/\" \/>\n<meta property=\"og:site_name\" content=\"Vielhuber David\" \/>\n<meta property=\"article:published_time\" content=\"2024-12-26T08:49:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-12-26T09:10:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"700\" \/>\n\t<meta property=\"og:image:height\" content=\"552\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"David\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@vielhuber\" \/>\n<meta name=\"twitter:site\" content=\"@vielhuber\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"David\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"1\u00a0Minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/\"},\"author\":{\"name\":\"David\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#\\\/schema\\\/person\\\/64d4ff14713d413ea4d9b210d0c2c6ef\"},\"headline\":\"Browser mit KI steuern\",\"datePublished\":\"2024-12-26T08:49:34+00:00\",\"dateModified\":\"2024-12-26T09:10:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/\"},\"wordCount\":227,\"publisher\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#\\\/schema\\\/person\\\/64d4ff14713d413ea4d9b210d0c2c6ef\"},\"articleSection\":[\"Blog\"],\"inLanguage\":\"de\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/\",\"url\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/\",\"name\":\"Browser mit KI steuern &#060; Vielhuber David\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#website\"},\"datePublished\":\"2024-12-26T08:49:34+00:00\",\"dateModified\":\"2024-12-26T09:10:42+00:00\",\"description\":\"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/blog\\\/browser-mit-ki-steuern\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/vielhuber.de\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Browser mit KI steuern\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#website\",\"url\":\"https:\\\/\\\/vielhuber.de\\\/\",\"name\":\"Vielhuber David\",\"description\":\"Full-Stack Developer\",\"publisher\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#\\\/schema\\\/person\\\/64d4ff14713d413ea4d9b210d0c2c6ef\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/vielhuber.de\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/vielhuber.de\\\/#\\\/schema\\\/person\\\/64d4ff14713d413ea4d9b210d0c2c6ef\",\"name\":\"David\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/vielhuber.de\\\/wp-content\\\/uploads\\\/about.jpg\",\"url\":\"https:\\\/\\\/vielhuber.de\\\/wp-content\\\/uploads\\\/about.jpg\",\"contentUrl\":\"https:\\\/\\\/vielhuber.de\\\/wp-content\\\/uploads\\\/about.jpg\",\"width\":700,\"height\":552,\"caption\":\"David\"},\"logo\":{\"@id\":\"https:\\\/\\\/vielhuber.de\\\/wp-content\\\/uploads\\\/about.jpg\"},\"sameAs\":[\"https:\\\/\\\/x.com\\\/vielhuber\"]}]}<\/script>","yoast_head_json":{"title":"Browser mit KI steuern &#060; Vielhuber David","description":"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen...","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/","og_locale":"de_DE","og_type":"article","og_title":"Browser mit KI steuern &#060; Vielhuber David","og_description":"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen.","og_url":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/","og_site_name":"Vielhuber David","article_published_time":"2024-12-26T08:49:34+00:00","article_modified_time":"2024-12-26T09:10:42+00:00","og_image":[{"width":700,"height":552,"url":"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg","type":"image\/jpeg"}],"author":"David","twitter_card":"summary_large_image","twitter_creator":"@vielhuber","twitter_site":"@vielhuber","twitter_misc":{"Verfasst von":"David","Gesch\u00e4tzte Lesezeit":"1\u00a0Minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/#article","isPartOf":{"@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/"},"author":{"name":"David","@id":"https:\/\/vielhuber.de\/#\/schema\/person\/64d4ff14713d413ea4d9b210d0c2c6ef"},"headline":"Browser mit KI steuern","datePublished":"2024-12-26T08:49:34+00:00","dateModified":"2024-12-26T09:10:42+00:00","mainEntityOfPage":{"@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/"},"wordCount":227,"publisher":{"@id":"https:\/\/vielhuber.de\/#\/schema\/person\/64d4ff14713d413ea4d9b210d0c2c6ef"},"articleSection":["Blog"],"inLanguage":"de"},{"@type":"WebPage","@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/","url":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/","name":"Browser mit KI steuern &#060; Vielhuber David","isPartOf":{"@id":"https:\/\/vielhuber.de\/#website"},"datePublished":"2024-12-26T08:49:34+00:00","dateModified":"2024-12-26T09:10:42+00:00","description":"Die Automatisierung von Browsern spielt eine gro\u00dfe Rolle in Bereichen wie Web-Scraping, automatisiertem Testen und der Interaktion mit Webanwendungen.","breadcrumb":{"@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/vielhuber.de\/blog\/browser-mit-ki-steuern\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/vielhuber.de\/"},{"@type":"ListItem","position":2,"name":"Browser mit KI steuern"}]},{"@type":"WebSite","@id":"https:\/\/vielhuber.de\/#website","url":"https:\/\/vielhuber.de\/","name":"Vielhuber David","description":"Full-Stack Developer","publisher":{"@id":"https:\/\/vielhuber.de\/#\/schema\/person\/64d4ff14713d413ea4d9b210d0c2c6ef"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/vielhuber.de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":["Person","Organization"],"@id":"https:\/\/vielhuber.de\/#\/schema\/person\/64d4ff14713d413ea4d9b210d0c2c6ef","name":"David","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg","url":"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg","contentUrl":"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg","width":700,"height":552,"caption":"David"},"logo":{"@id":"https:\/\/vielhuber.de\/wp-content\/uploads\/about.jpg"},"sameAs":["https:\/\/x.com\/vielhuber"]}]}},"_links":{"self":[{"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/posts\/4052","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/comments?post=4052"}],"version-history":[{"count":14,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/posts\/4052\/revisions"}],"predecessor-version":[{"id":4073,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/posts\/4052\/revisions\/4073"}],"wp:attachment":[{"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/media?parent=4052"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/categories?post=4052"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vielhuber.de\/ms\/wp-json\/wp\/v2\/tags?post=4052"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}