解锁 AI 网络代理:GPT-4V 和 Puppeteer 赋能自主浏览
使用 GPT-4V 和 Puppeteer 解锁强大的 AI 网络代理! 探索自主浏览、网络爬虫和复杂的 AI 驱动的网络研究。发现这些先进的 AI 助手如何革新任务,从 RPA 到客户支持。
2025年2月24日

利用这种创新的方法,结合 GPT-4V 和 Puppeteer,解锁 AI 驱动的网络自动化的力量。发现如何构建一个 AI 代理,能够浏览网页、提取数据并轻松完成复杂任务,从而革新您的工作流程,开启新的可能性。
人工智能网络代理的使用案例和市场机遇
人工智能网络代理的使用案例和市场机遇
从人工智能网络代理的潜在用例和市场机会来看,可以通过检查之前建立类似系统的尝试、其局限性以及新技术或变化如何可能改变动态来进行分析。
一个直接的市场类别是机器人流程自动化(RPA),这是一类帮助企业构建自动化机器人来处理重复和标准化任务(如发票处理或数据录入)的软件。然而,RPA解决方案的局限性是非常明确的 - 它们难以处理非标准化或不断变化的流程,并且为每个特定自动化需要高昂的设置成本。
相比之下,可以直接控制计算机和浏览器的人工智能网络代理令人兴奋,因为它们理论上可以处理更复杂的情况,而且设置成本要低得多。代理不需要为每个网站建立特定的自动化,而是可以导航网站、提取数据并完成任务,而不受格式变化的影响,因为代理可以做出必要的决策。
除了自动化之外,这些人工智能代理还可以超越传统的RPA,完成更智能的任务,如客户支持、销售和营销。通过访问更多系统并利用其决策能力,这些人工智能"工人"可以部署于更广泛的用例,包括低量的消费者应用程序。
然而,提供有用的人工智能工人解决方案的关键挑战不仅在于技术理解,还在于特定工作职能的端到端工作流程知识。Hotspot最近进行的一项调查研究,访问了1,400多位全球销售主管,为构建销售职能的人工智能代理提供了宝贵的见解。
总之,人工智能网络代理的主要机会包括:
- 相比传统RPA,可以处理更复杂、非标准化的任务
- 减少自动化的设置成本
- 超越仅自动化,扩展到更智能的任务,如客户支持和销售
- 利用特定工作职能的深入工作流程知识,构建更有效的人工智能代理
构建人工智能网络代理的两种方法
构建人工智能网络代理的两种方法
方法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 的网络爬虫
要构建一个基于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提取工作经验部分。您可以自定义提示,从网站中提取不同类型的信息。
FAQ
FAQ