本文为您介绍如何通过函数服务（veFaaS）应用中心一键部署 Browser Session 应用。 ## 背景信息 * **应用介绍** veFaaS 提供浏览器会话能力，作为一项 Browser as a Service 服务，直接对内外用户提供浏览器实例。用户可通过多语言 SDK 获取浏览器资源，再通过 Playwright/Puppeteer 浏览器等工具、上层服务（如 browser\-use）来访问浏览器资源。 * **运行时** Native 运行时。 * **关联云服务**

注意

关联的云服务会产生相应的使用费用。计费详情，请查看关联云服务对应的计费文档。

* browser\-session\-manager * [函数服务](https://www.volcengine.com/product/vefaas)：面向用户提供浏览器实例生命周期管理的接口。 * [API 网关](https://www.volcengine.com/product/apig)：通过 API 网关暴露接口。 * browser\-pool * [函数服务](https://www.volcengine.com/product/vefaas)：运行浏览器实例。 * [API 网关](https://www.volcengine.com/product/apig)：browser\-session\-manager 通过该网关管理浏览器实例。 ## 前提条件 * 已开通本应用关联的所有云服务。 * IAM 用户需确保已授权 **VeFaaSFullAccess**、**APIGFullAccess**、**STSAssumeRoleAccess** 策略。如果缺少以上策略，请联系主账号或管理员进行授权。具体操作，请参见 [创建用户并授权](https://www.volcengine.com/docs/6257/94013)。 * 已创建 Serverless 网关类型的 API 网关实例。详细操作，请参见 [创建实例](https://www.volcengine.com/docs/6569/85693)。 * 首次使用函数服务，需确保已完成跨服务授权。如未授权，控制台会弹出跨服务授权页面引导您进行授权。 ## 操作步骤 1. 登录 [函数服务控制台](https://console.volcengine.com/vefaas)。 2. 在顶部导航栏，选择目标地域。

说明

目前仅 华北2（北京）地域支持该应用。

3. 在左侧导航栏选择 **应用 ** \> ** 我的应用**。 4. 在 **应用** 页面，单击 **创建应用**。 5. 在 **创建应用** 页面，选择 **Browser Session** 模板，单击 **创建**。 ![图片](https://portal.volccdn.com/obj/volcfe/cloud-universal-doc/upload_b9e7fe828e19a91b8dd92bd98e328392.png) 6. 在 **创建应用** 页面，配置应用参数。 * 基础信息 |**配置项** |**说明** | |---|---| |已选模板 |展示选择的模板。本场景为 **Browser Session**。 | |名称 |根据系统提示的命名规则，自定义应用的名称。您也可以直接使用系统自动生成的应用名称。 | |备注 |填写当前应用的备注信息，可以为空。 | |IAM 角色 |应用中心提供了系统默认角色 **ServerlessApplicationRole**，该角色包含了应用中心需要访问的部分云资源权限。

* 如果您的用户角色未包含此角色，将会自动添加该角色。

* 如果您的用户角色已包含此角色，系统会自动检测该角色是否已包含当前应用需要的所有策略。当缺少相关策略时，控制台会提示需要添加的策略名称，请单击 **添加策略** 进行添加。

注意

IAM 用户需确保已授权 IAMReadOnlyAccess 策略，否则无权限获取 ServerlessApplicationRole 角色信息。

IAM 用户如需进一步为 ServerlessApplicationRole 角色添加策略，需确保已授权 IAMFullAccess 策略。

更多 IAM 用户的角色相关操作，请参见 IAM 文档。

| |关联云服务 |展示当前应用需要使用的所有云服务名称、开通状态及开通目的。

注意

使用关联云服务时可能产生的计费以及对账号余额的要求，请参见相关云产品计费文档：函数服务计费说明、API 网关计费说明。

| * 资源配置 |**配置项** |**说明** | |---|---| |**浏览器资源池配置** || |地域 |展示当前应用及应用下关联云资源所在的地域。 | |函数名称 |根据系统提示的命名规则，自定义函数名称。您也可以直接使用系统自动生成的函数名称。 | |**访问配置** || |网关实例 |选择前提条件中准备的 Serverless 类型 API 网关实例。将在该实例下自动创建 API 网关触发器相关资源，包括：服务、Upstream、路由。 | |API 访问密钥 |火山引擎访问密钥 Access Key ID 和 Secret Access Key（AK/SK）信息。获取方法，请参见 [Access Key 管理](https://www.volcengine.com/docs/6291/65568)。 | 7. 单击 **确定**，开始创建和部署应用。系统将自动跳转至应用详情页面，您可以实时查看应用部署状态和日志。 8. 应用部署成功后，在 **应用详情** 页签单击 **访问入口详情** 下的访问地址，即可进入您自己的应用交互界面。 ![图片](https://portal.volccdn.com/obj/volcfe/cloud-universal-doc/upload_d9f728628f71b33d628af146273810a4.png) ## 使用浏览器通过上述 **操作步骤**，可以获取一个浏览器实例，接下来将为您介绍如何使用浏览器。 ### 浏览器操作工具通过 Playwright/Puppeteer 等浏览器操作工具使用： * **Playwright** ```Python from playwright.sync_api import sync_playwright import websocket import json import requests import time def test_with_cdp(): # cdp_url = "ws://******.apigateway-cn-beijing.volceapi.com/v1/browsers/c400ec0c-37f3-4c01-a796-e406081b9678/devtools/browser/936c2835-3bf7-4a4b-99f5-7679088fed8e" cdp_url = "https://******.apigateway-cn-beijing.volceapi.com/v1/browsers/9ebdaa2a-f075-48de-a92d-6cf23b1a0ded" with sync_playwright() as playwright: browser = playwright.chromium.connect_over_cdp(cdp_url) print("Connected to browser via CDP") context = browser.new_context() page = context.new_page() page.goto("https://toutiao.com") print(page.url) browser.close() if __name__ == "__main__": test_with_cdp() ``` 输出结果： ```JSON Connected to browser via CDP https://www.toutiao.com/ ``` * **Puppeteer** ```Python import asyncio from pyppeteer import connect async def test_with_cdp(): cdp_url = 'ws://******.apigateway-cn-beijing.volceapi.com/v1/browsers/02a2ce20-f8b7-46e3-9caa-f2023bd00c28/devtools/browser/f3f017c4-8e57-499d-8903-3e37b14e6c01' try: # Connect to the remote browser using CDP browser = await connect({ 'browserWSEndpoint': cdp_url, 'defaultViewport': None }) print('Connected to browser via CDP') # Create a new page page = await browser.newPage() # Navigate to toutiao.com await page.goto('https://toutiao.com') print(page.url) # Close the browser connection await browser.close() except Exception as error: print('Error:', str(error)) if __name__ == "__main__": # Run the async function using asyncio.run() asyncio.run(test_with_cdp()) ``` ### browser\-use 在 browser\-use 中使用 veFaaS 提供的浏览器实例。 ```Python from langchain_openai import ChatOpenAI from browser_use import Agent import asyncio from dotenv import load_dotenv from browser_use.browser.browser import Browser, BrowserConfig from browser_use.browser.context import BrowserContext load_dotenv() async def main(): browser = Browser( config = BrowserConfig( cdp_url = "https://******.apigateway-cn-beijing.volceapi.com/v1/browsers/9ebdaa2a-f075-48de-a92d-6cf23b1a0ded" ) ) context = BrowserContext( browser=browser, ) agent = Agent( task="访问 baidu.com 并找一下 pico 最新型号", llm=ChatOpenAI(model="gpt-4o"), browser_context=context ) await agent.run() asyncio.run(main()) ``` 输出结果： ```SQL ➜ cdp git:(web) ✗ python run_browser_use.py INFO [browser_use] BrowserUse logging setup complete with level info INFO [root] Anonymized telemetry enabled. See https://docs.browser-use.com/development/telemetry for more information. /Users/bytedance/.pyenv/versions/3.12.8/lib/python3.12/site-packages/browser_use/agent/message_manager/views.py:59: LangChainBetaWarning: The function `load` is in beta. It is actively being worked on, so the API may change. value['message'] = load(value['message']) INFO [agent] 🚀 Starting task: 访问 baidu.com 并找一下 pico 最新型号 INFO [agent] 📍 Step 1 INFO [browser] Connecting to remote browser via CDP https://xxxxxx.apigateway-cn-beijing.volceapi.com/v1/browsers/9ebdaa2a-f075-48de-a92d-6cf23b1a0ded INFO [agent] 🤷 Eval: Not applicable - starting fresh with a new task. INFO [agent] 🧠 Memory: Starting with a new task to find the latest model of 'pico' on baidu.com. INFO [agent] 🎯 Next goal: Navigate to baidu.com INFO [agent] 🛠️ Action 1/1: {"open_tab":{"url":"https://www.baidu.com"}} INFO [controller] 🔗 Opened new tab with https://www.baidu.com INFO [agent] 📍 Step 2 INFO [agent] 👍 Eval: Success - Navigated to baidu.com successfully. INFO [agent] 🧠 Memory: Landed on Baidu, starting to search for the latest Pico model. INFO [agent] 🎯 Next goal: Enter 'Pico 最新型号' in the search box and perform the search. INFO [agent] 🛠️ Action 1/2: {"input_text":{"index":12,"text":"Pico 最新型号"}} INFO [agent] 🛠️ Action 2/2: {"click_element":{"index":8}} INFO [controller] ⌨️ Input Pico 最新型号 into index 12 INFO [agent] Something new appeared after action 1 / 2 INFO [agent] 📍 Step 3 INFO [agent] 👍 Eval: Success - Entered the search and received results regarding Pico. INFO [agent] 🧠 Memory: Searched for 'Pico 最新型号' on Baidu and found relevant information about the new models: PICO 4 Ultra and PICO Neo3 Enterprise Edition. INFO [agent] 🎯 Next goal: Summarize the findings and conclude the task. INFO [agent] 🛠️ Action 1/1: {"done":{"text":"The latest models of Pico are the PICO 4 Ultra and PICO Neo3 Enterprise Edition. PICO 4 Ultra includes 21 system updates and is marketed with enhanced mixed reality experiences. The PICO Neo3 Enterprise Edition targets enterprise markets with a new 6DoF optical positioning system, powered by Qualcomm Snapdragon XR2 chip, featuring 4K HD display and immersive audio components.","success":true}} INFO [agent] 📄 Result: The latest models of Pico are the PICO 4 Ultra and PICO Neo3 Enterprise Edition. PICO 4 Ultra includes 21 system updates and is marketed with enhanced mixed reality experiences. The PICO Neo3 Enterprise Edition targets enterprise markets with a new 6DoF optical positioning system, powered by Qualcomm Snapdragon XR2 chip, featuring 4K HD display and immersive audio components. INFO [agent] ✅ Task completed INFO [agent] ✅ Successfully ``` ## Swagger Swagger 可视化的 API 请参见 [veFaaS Browser Session Manager API](https://sd1qsdevr8npbn2c3s550.apigateway-cn-beijing.volceapi.com/docs)。 ## API 列表获取浏览器实例列表 ### **GET** /browsers 按 Pod 分组返回所有浏览器实例。 #### 返回参数 * **200 OK**：以 JSON 格式成功返回按 Pod 分组的浏览器元数据。 * **500 Internal Server Error**：服务发生错误，请重试或联系您的火山引擎客户经理，获取技术支持。 #### 返回示例 ```JSON { "pod-name-1": { "podExpireAt": "2024-01-01T12:00:00Z", "browsers": [ { "id": "browser-123", "pod_name": "pod-name-1", "status": "ready", "port": 9222, "cdp_url": "ws://localhost:9222/devtools/browser/abc123", "ws_url": "ws://localhost:9222/devtools/browser/abc123", "created_at": "2024-01-01T10:00:00Z", "expiration_time": "2024-01-01T11:00:00Z", "deleted_at": "", "options": { "enable_enhancement": true, "timeout": 300 } } ] } } ``` ### 创建新浏览器 ### **POST** /browsers 使用指定的配置创建一个新的浏览器实例。 #### 请求结构体

说明

timeout 超时时间取值最长为 1380 分钟。

```JSON { "customized_engine": false, "timeout": 300 } ``` #### 返回参数 * **200 OK**：成功返回新建的浏览器实例。 * **400 Bad Request** ：无效的请求参数值。请重新输入有效的参数值。 * **500 Internal Server Error**：服务发生错误，请重试或联系您的火山引擎客户经理，获取技术支持。 #### 返回示例 ```JSON { "id": "browser-456", "pod_name": "pod-name-2", "status": "creating", "port": 9223, "cdp_url": "ws://localhost:9223/devtools/browser/def456", "ws_url": "ws://localhost:9223/devtools/browser/def456", "created_at": "2024-01-01T10:30:00Z", "expiration_time": "2024-01-01T11:30:00Z", "deleted_at": "", "options": { "enable_enhancement": true, "timeout": 300 } } ``` ### 获取浏览器信息 ### **GET** /browsers/{browser_id} 指定浏览器实例 ID，获取浏览器实例信息。 #### 请求参数 * **browser_id** ：必填参数，类型为 String，输入浏览器实例 ID。 #### 返回参数 * **200 OK**：成功返回指定的浏览器实例。 * **404 Not Found**：未查询到指定的浏览器实例。请重新输入有效的实例 ID。 #### 返回示例 ```JSON { "id": "browser-123", "pod_name": "pod-name-1", "status": "ready", "port": 9222, "cdp_url": "ws://localhost:9222/devtools/browser/abc123", "ws_url": "ws://localhost:9222/devtools/browser/abc123", "created_at": "2024-01-01T10:00:00Z", "expiration_time": "2024-01-01T11:00:00Z", "deleted_at": "", "options": { "enable_enhancement": true, "timeout": 300 } } ``` ### 删除浏览器 ### **DELETE** /browsers/{browser_id} 指定浏览器实例 ID，删除浏览器实例。 #### 请求参数 * **browser_id** ：必填参数，类型为 String，输入浏览器实例 ID。 #### 返回参数 * **200 OK**：成功删除指定的浏览器实例。 * **404 Not Found**：未查询到指定的浏览器实例。请重新输入有效的实例 ID。 * **500 Internal Server Error**：服务发生错误，请重试或联系您的火山引擎客户经理，获取技术支持。 #### 返回示例 ```JSON { "status": "success", "message": "Browser deleted successfully" } ``` ### 获取浏览器 JSON 版本 ### **GET** /browsers/{browser_id}/json/version 返回指定浏览器的 JSON 版本信息。 #### 请求参数 * **browser_id** ：必填参数，类型为 String，输入浏览器实例 ID。 #### 返回参数 * **200 OK**：调用 API 成功，返回指定浏览器的 JSON 版本信息。 * **404 Not Found**：无效的请求参数值。请重新输入有效的参数值。 * **500 Internal Server Error**：服务发生错误，请重试或联系您的火山引擎客户经理，获取技术支持。 #### 返回示例 ```JSON { "version": "1.0.0", "protocol": "1.3", "webSocketDebuggerUrl": "ws://localhost:9222/devtools/browser/abc123" } ``` ## ## 多语言 SDK Python * 地址：[https://pypi.org/project/vefaas-browser-session/](https://pypi.org/project/vefaas-browser-session/) * 安装命令： ```Python pip install vefaas-browser-session ``` * SDK 示例： ```Python from vefaas_browser_session import Configuration, ApiClient, BrowsersApi def create_browser(): browser_session_endpoint = 'https://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v1' try: configuration = Configuration(host=browser_session_endpoint) client = ApiClient(configuration=configuration) api = BrowsersApi(client) response = api.create_browser() browser_id = response.id cdp_url = response.cdp_url ws_url = response.ws_url print(f"✅ Browser created: {browser_id}") print(f"🔗 CDP URL: {cdp_url}") print(f"🌐 WebSocket: {ws_url}") return cdp_url except Exception as e: print(f"❌ Error: {str(e)}") return None if __name__ == "__main__": create_browser() ``` 预期返回结果如下： ```Python ➜ cdp git:(master) ✗ python python.py ✅ Browser created: c5f7362d-055a-4905-934d-ff17d179cb59 🔗 CDP URL: https://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v1/browsers/c5f7362d-055a-4905-934d-ff17d179cb59 🌐 WebSocket: ws://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v0.1/browsers/c5f7362d-055a-4905-934d-ff17d179cb59/devtools/browser/cb87c79d-5371-4247-8145-be8eac5c0205?faasInstanceName=vefaas-2u02weu6-9e8t31v73p-d1uhb86366fga65vi7m0-sandbox ``` Node.js * 地址：[https://www.npmjs.com/package/@vefaas-agent/vefaas-browser-session](https://www.npmjs.com/package/@vefaas-agent/vefaas-browser-session) * 安装命令： ```JavaScript npm i @vefaas-agent/vefaas-browser-session ``` * SDK 示例： ```JavaScript import pkg from '@vefaas-agent/vefaas-browser-session'; const { BrowsersApi, Configuration } = pkg; const browserSessionEndpoint = 'https://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v1'; async function run() { const browsersApi = new BrowsersApi(new Configuration({ basePath: browserSessionEndpoint })); try { const response = await browsersApi.createBrowser({}); const browser = response.data; console.log(`✅ Browser created: ${browser.id}`); console.log(`🔗 CDP URL: ${browser.cdp_url}`); console.log(`🌐 WebSocket: ${browser.ws_url}`); } catch (err: any) { console.error('❌ Error:', err.message); } } run(); ``` 预期返回结果如下： ```JavaScript ➜ vefaas-browser-session-sdk git:(sdk) ✗ npx ts-node example.ts ✅ Browser created: b7d63a8b-d7c2-4157-944b-01908ea3e089 🔗 CDP URL: https://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v1/browsers/b7d63a8b-d7c2-4157-944b-01908ea3e089 🌐 WebSocket: ws://sd1mt1m354gpj4to2lgh0.apigateway-cn-beijing.volceapi.com/v0.1/browsers/b7d63a8b-d7c2-4157-944b-01908ea3e089/devtools/browser/8dad80ea-cb31-4bbc-a756-2728ccf050a5?faasInstanceName=vefaas-2u02weu6-9e8t31v73p-d1qbllu2pag0j2edb8r0-sandbox ``` ###