用Langchain代理和Playwright工具轻松实现浏览器自动化控制

由于 Playwright 工具存在一个开放性问题以及 Pydantic V2 的更改导致 KeyError: “data”，即使代码正确，最新的包也无法正常工作，（在 key error 之后添加逗号以提高可读性）。我已对照 langchain 最新版本 0.3.4 的文档进行了验证。为了解决这个问题，我将 langchain、langchain-core、langchain-community 和 langchain-openai 的包降级到以下版本。

langchain 0.2.16
langchain-community 0.2.17
langchain-core 0.2.41
langchain-openai 0.1.25

playwright 1.48.0
pydantic 2.9.2
pydantic-core 2.23.4
pydantic-settings 2.6.0

我按以下顺序执行了：

安装 langchain-community 版本小于 0.3 和 langchain 版本小于 0.3

安装 langchain-core 版本小于 0.3

安装 langchain-openai 版本小于 0.2

如果这个修复方法对你不管用，请通过LinkedIn告诉我，并我会关注该未解决的问题，。

在不断发展的科技世界中，自动化是提高效率和生产力的关键。特别是在浏览器自动化方面，从自动化测试到数据抓取等众多应用，提供了广泛的可能性。本教程将介绍如何使用Langchain与Playwright结合来控制浏览器，并利用GPT-4。

首先，确保你的系统上安装了Python版本。接着，安装需要的软件包。

    pip install langchain playwright langchain_community langchain_openai lxml langchainhub

可以使用上面的命令安装这些包。

另外，您需要安装 Playwright 浏览器。

    playwright install

新建一个Python脚本，并导入需要的模块，

    from langchain_community.agent_toolkits import PlayWrightBrowserToolkit  
    from langchain_community.tools.playwright.utils import create_sync_playwright_browser  
    from langchain import hub  
    from langchain.agents import AgentExecutor, create_openai_tools_agent  
    from langchain_openai import ChatOpenAI

启动我们代理使用的同步Playwright浏览器和相关工具：

sync_browser = 创建同步的Playwright浏览器()  
toolkit = PlayWrightBrowserToolkit.from_browser(sync_browser=sync_browser)  
tools = 获取工具()

为代理定义提示。你也可以试试用 create_react_agent 代理时用 hwchase17/react 提示。不过，使用该代理时函数调用有时会失败，整个链路也会崩溃。你可以根据具体需求修改这个提示。

# 从hub拉取"hwchase17/openai-tools-agent"

第5步：选择语言模型

选择一个将驱动代理的LLM模型。我之前尝试让这些工具与GPT-3.5-turbo协同工作，但它经常失败，因为它没有针对工具调用来返回格式化的JSON进行微调。在这种情况下，我们使用的是这个GPT-4模型。

    llm = ChatOpenAI(model="gpt-4o-mini", temperature=0)   
    # 之前使用的是gpt-4，因为当时还没有mini模型。但现在4o-mini也表现得很不错，而且价格便宜很多

使用先前初始化的LLM和工具创建OpenAI工具代理，并通过输入代理和工具来创建代理执行程序。代理执行程序将处理命令的执行：

    agent = create_openai_tools_agent(llm, tools, prompt)  
    # 如果使用 hwchase17/react prompt，请使用此行  
    agent_executor = AgentExecutor(agent=agent, tools=tools, verbose=True)

你现在可以使用自然语言指令来控制浏览器。代理还可以提取HTML元素，使用点击工具点击页面上的特定按钮等操作，提取超链接等。比如，我们导航到一个网站并从该网站提取数据，然后对其进行总结，我们可以通过这些步骤实现。

    command = {  
        "input": "打开 https://python.langchain.com/v0.2/docs/integrations/toolkits/playwright/ 网站，并给我一份该页面提到的所有工具的摘要。并打印 URL，每一步。"  
    }  
    agent_executor.invoke(command)

终端：如下：

    > 正在进入新的AgentExecutor链...  

    调用:`navigate_browser` 参数为`{'url': 'https://python.langchain.com/v0.2/docs/integrations/toolkits/playwright/'}`  

    导航到 https://python.langchain.com/v0.2/docs/integrations/toolkits/playwright/ 返回状态码为200  
    调用:`current_webpage` 参数为没有参数  

    https://python.langchain.com/v0.2/docs/integrations/toolkits/playwright/  
    调用:`extract_text` 参数为没有参数  

    PlayWright浏览器 | 🦜️🔗 LangChain 跳过到主要内容 LangChain 0.2 正式发布！在此处提供对 v0.2 文档的反馈。您可以在此处查看 v0.1 文档。集成 API 参考 更多 人员 贡献 模板 示例教程 YouTube arXiv v0.2 v0.2 v0.1   
    🦜️🔗 LangSmith LangSmith 文档 LangServe GitHub 模板 GitHub 模板 中心 LangChain 中心 JS/TS 文档 💬 搜索 K 提供商 提供商 Anthropic AWS Google Hugging Face Microsoft OpenAI 更多 组件 Chat 模型 LLMs 嵌入模型 文档加载器 文档转换器 向量存储 检索器 工具 工具箱 AINetwork Airbyte 问答服务 Amadeus Azure AI Services Azure 认知服务 Cassandra 数据库 ClickUp cogniswitch Connery 工具包 CSV 文档比较 Github Gitlab Gmail Jira JSON MultiOn NASA Office365 OpenAPI 自然语言 API Pandas 数据帧 PlayWright 浏览器 Polygon IO 工具包 PowerBI 数据集 Python Robocorp Slack Spark 数据帧 Spark SQL   
    SQL 数据库 Steam 游戏推荐与游戏信息 Xorbits 记忆图 Callbacks Chat 加载器 适配器 存储 模型缓存 组件 工具箱 PlayWright 浏览器 在此页面上 PlayWright 浏览器 此工具箱用于与浏览器进行交互。虽然其他工具（如 Requests工具）适用于静态站点，但 PlayWright 浏览器工具箱可以让代理在浏览网页和与动态渲染的站点互动时发挥作用。PlayWright 浏览器工具箱包含以下工具：  

1. **NavigateTool (navigate_browser)**：此工具用于导航到一个 URL。  

2. **NavigateBackTool (previous_page)**：此工具用于导航回浏览器历史记录中的上一个页面。  

3. **ClickTool (click_element)**：此工具用于点击由 CSS 选择器指定的元素。  

4. **ExtractTextTool (extract_text)**：此工具使用BeautifulSoup从当前网页中提取文本。  

5. **ExtractHyperlinksTool (extract_hyperlinks)**：此工具使用BeautifulSoup从当前网页中提取超链接。  

6. **GetElementsTool (get_elements)**：此工具用于通过 CSS 选择器选择元素。  

7. **CurrentPageTool (current_page)**：此工具用于获取当前页面的 URL。  

    该页面还提供了安装所需包的说明，如何实例化一个浏览器工具包，以及如何在代理中使用这些工具的说明。

代码如下：

    from langchain_community.agent_toolkits import PlayWrightBrowserToolkit  
    from langchain_community.tools.playwright.utils import (  
        create_sync_playwright_browser,  # 这是一个同步浏览器，但它与Jupyter不兼容。  
    )  
    from langchain import hub  
    from langchain.agents import AgentExecutor, create_openai_tools_agent  
    from langchain_openai import ChatOpenAI  

    # 获取要使用的提示（你可以修改这个提示！）  
    prompt = hub.pull("hwchase17/openai-tools-agent")  

    sync_browser = create_sync_playwright_browser()  
    toolkit = PlayWrightBrowserToolkit.from_browser(sync_browser=sync_browser)  
    tools = toolkit.get_tools()  

    # 选择将驱动代理的LLM模型  
    # 只有某些模型支持这个功能  
    llm = ChatOpenAI(model="gpt-4", temperature=0)  

    # 构建OpenAI工具代理  
    agent = create_openai_tools_agent(llm, tools, prompt)  

    # 通过传入代理和工具来创建代理执行器  
    agent_executor = AgentExecutor(agent=agent, tools=tools, verbose=True)  

    command = {  
        "input": "访问 https://python.langchain.com/v0.2/docs/integrations/toolkits/playwright/，并总结页面上提到的所有工具。每一步都打印出URL。"  
    }  
    agent_executor.invoke(command)

通过本指南，您已经搭建了一个强大且自动化的环境，利用Langchain和Playwright。这个组合结合了GPT-4的自然语言处理能力和Playwright强大的浏览器自动化功能。试试用这些工具来优化您的工作流程，解锁更多自动化可能。祝您编程开心！

在第二部分，我们将向Playwright工具集中添加一个Fill工具，它可以让OpenAI填充网页上的文本框。

本文为希望在项目中使用Langchain和Playwright进行高级浏览器自动化的人员提供了一个全面的入门指南。了解更多详细信息和高级功能，请参阅Langchain和Playwright的官方资料。

这也是我在 Medium 上写的第一个文章，所以请在下面的评论中提出任何有关错误、库或代码修复的建议，我会尽快处理这些问题。谢谢！