解鎖 AI 網路代理人:GPT-4V 和 Puppeteer 賦予自主瀏覽能力
使用 GPT-4V 和 Puppeteer 解鎖強大的 AI 網路代理! 探索自主瀏覽、網頁爬蟲和複雜的 AI 驅動網路研究。發現這些先進的 AI 助手如何革新任務,從 RPA 到客戶支援。
2025年2月19日

利用結合 GPT-4V 和 Puppeteer 的創新方法,解鎖 AI 驅動的網頁自動化的力量。探索如何建立一個 AI 代理,能夠瀏覽網頁、提取數據,並輕鬆完成複雜的任務,革新您的工作流程,開啟全新的可能性。
AI 網路代理的使用案例和市場機會
AI 網路代理的使用案例和市場機會
從探討人工智慧網路代理的潛在用例和市場機會的角度來看,我們可以檢視之前建立類似系統的嘗試、其局限性,以及新技術或變化如何可能改變動態。
一個直接的市場類別是機器人流程自動化(RPA),這是一類幫助企業建立自動化機器人來處理重複和標準化任務(如發票處理或資料輸入)的軟體。然而,RPA解決方案的局限性相當明顯 - 它們難以處理非標準化或不斷變化的流程,並且需要為每個特定自動化設置高昂的成本。
相比之下,可以直接控制電腦和瀏覽器的人工智慧網路代理令人興奮,因為它們理論上可以處理更複雜的情況,而且設置成本更低。代理不需要為每個網站結構建立特定的自動化,而是可以瀏覽網站、擷取資料並完成任務,無論格式如何變化,因為代理可以自行做出必要的決策。
除了自動化之外,這些人工智慧代理還可以超越傳統的RPA,完成更智慧的任務,如客戶支援、銷售和行銷。通過訪問更多系統並利用其決策能力,這些人工智慧「工人」可以部署於更廣泛的用例,包括低量的消費者應用程式。
然而,提供有用的人工智慧工人解決方案的關鍵挑戰不僅在於技術理解,還在於特定工作職能的端到端工作流程知識。Hotspot最近的一份研究報告調查了1,400多位全球銷售主管,提供了有關現代銷售工作流程和人工智慧用例的寶貴見解,這對於建立銷售職能的人工智慧代理非常有幫助。
總之,人工智慧網路代理的主要機會包括:
- 相比傳統RPA,能夠處理更複雜、非標準化的任務
- 降低自動化的設置成本
- 擴展到不僅僅是自動化,還包括更智慧的任務,如客戶支援和銷售
- 利用特定工作職能的深入工作流程知識,建立更有效的人工智慧代理
建立 AI 網路代理的兩種方法
建立 AI 網路代理的兩種方法
方法1: 基於GPT-4V的網頁爬蟲
- 使用Node.js庫Puppeteer來截取網頁截圖並控制網頁瀏覽器。
- 創建一個Python腳本,調用JavaScript檔案來截取截圖,然後使用GPT-4V從截圖中提取資料。
- Python腳本定義了將圖像轉換為base64、截取截圖以及使用GPT-4V從截圖中提取資訊的函數。
- 該腳本將這些函數連接起來,創建一個強大的網頁爬蟲,可以訪問通常阻擋爬蟲服務的網站。
方法2: 構建一個網路人工智慧代理
- 創建一個Node.js檔案,導入各種庫並設置一個OpenAI實例和命令行界面。
- 實現一個
highlightLinks
函數,識別網頁上的所有互動元素並為它們添加一個特殊屬性。 - 定義一個主函數,創建一個Puppeteer瀏覽器,為GPT-4V設置一個系統消息,並進入一個循環,其中它:
- 根據用戶的提示和當前網頁的狀態從GPT-4V獲取響應。
- 如果響應指示應該點擊一個鏈接,它會找到相應的元素並點擊。
- 如果響應指示應該訪問一個新的URL,它會導航到該URL並突出顯示鏈接。
- 如果響應是一般消息,它會將結果顯示給用戶。
- 這個網路人工智慧代理可以瀏覽多個網站,點擊鏈接,並通過利用GPT-4V的功能來完成複雜的研究任務。
建立一個由 GPT-4V 驅動的網頁爬蟲
建立一個由 GPT-4V 驅動的網頁爬蟲
要構建一個基於GPT-4V的網頁爬蟲,我們將使用一個名為Puppeteer的Node.js庫來控制網頁瀏覽器並截取截圖。以下是逐步指南:
- 創建一個名為
screenshot.js
的新檔案,並導入必要的庫:
const puppeteer = require('puppeteer');
const puppeteerExtra = require('puppeteer-extra');
- 定義要爬取的URL和超時值:
const url = 'https://en.wikipedia.org/wiki/Main_Page';
const timeout = 60000; // 60 seconds
- 創建一個異步函數來啟動瀏覽器,導航到URL並截取截圖:
async function takeScreenshot() {
const browser = await puppeteerExtra.launch();
const page = await browser.newPage();
await page.setViewport({ width: 1920, height: 1080 });
await page.goto(url, { waitUntil: 'networkidle0' });
await page.screenshot({ path: 'screenshot.jpg', fullPage: true });
await browser.close();
}
-
在這個例子中,我們使用
puppeteer-extra
插件來使瀏覽器更難被網站檢測到。 -
運行
takeScreenshot()
函數來捕捉截圖:
takeScreenshot();
現在,您可以運行腳本node screenshot.js
,它將把維基百科首頁的截圖保存到screenshot.jpg
檔案中。
接下來,我們將創建一個Python腳本,使用截圖和GPT-4V從網站中提取資料:
- 創建一個名為
vision_scraper.py
的新檔案,並導入必要的庫:
import os
import subprocess
import base64
import openai
from dotenv import load_dotenv
load_dotenv()
openai.api_key = os.getenv("OPENAI_API_KEY")
- 定義將圖像轉換為base64和使用
screenshot.js
腳本捕捉截圖的函數:
def image_to_b64(image_path):
with open(image_path, "rb") as image_file:
return base64.b64encode(image_file.read()).decode("utf-8")
def url_to_screenshot(url):
if os.path.exists("screenshot.jpg"):
os.remove("screenshot.jpg")
try:
subprocess.run(["node", "screenshot.js"], check=True)
return "screenshot.jpg"
except subprocess.CalledProcessError:
return None
- 創建一個使用GPT-4V從截圖中提取資訊的函數:
def vision_extract(image_b64, prompt):
response = openai.ChatCompletion.create(
model="gpt-4",
messages=[
{"role": "system", "content": "You are a web scraper. Your job is to extract information based on a screenshot of a website and user instructions."},
{"role": "user", "content": prompt},
{"role": "user", "content": image_b64}
],
max_tokens=2048,
n=1,
stop=None,
temperature=0.7,
)
return response.choices[0].message.content.strip()
- 在
vision_query()
函數中綜合所有內容:
def vision_query(url, prompt):
screenshot_path = url_to_screenshot(url)
if screenshot_path:
image_b64 = image_to_b64(screenshot_path)
return vision_extract(image_b64, prompt)
else:
return "Error: Unable to capture screenshot."
- 您現在可以使用
vision_query()
函數從網站中提取資訊:
result = vision_query("https://www.linkedin.com/in/your-profile-url", "Extract the work experience section from the profile.")
print(result)
這個示例將捕捉指定LinkedIn個人資料的截圖,並使用GPT-4V提取工作經驗部分。您可以自定義提示,從網站中提取不同類型的資訊。
常問問題
常問問題