如何通过人机交互跟踪任务？

Michael Lee

Expert Network Defense Engineer

27-May-2025

无废抓取浏览器现在通过基于会话的工作流程完全支持自动化任务。无论是通过游乐场还是API发起，所有程序执行都可以在仪表板上同步跟踪。

打开实时视图以实时监控运行状态。
分享实时URL以进行远程用户交互——如登录页面、表单填写或支付完成。
通过会话回放审查整个执行过程。

但你可能会想：

这些会话功能究竟是什么？它们对我有什么好处？我该如何使用它们？

在这篇博客中，我们将深入探讨无废抓取浏览器的会话，涵盖：

实时视图的概念和目的
实时URL是什么
如何使用实时URL进行直接用户交互
为什么会话回放是必要的

实时视图：实时程序监控

无废抓取浏览器中的实时视图功能允许您实时跟踪和控制浏览器会话。具体而言，它使您能够观察点击、输入和所有浏览器操作，监控自动化工作流，手动调试脚本，并在需要时直接控制会话。

创建浏览器会话

首先，您需要创建一个会话。可以通过以下两种方式实现：

方法1：通过游乐场创建会话

方法2：通过API创建会话

您也可以使用我们的API创建会话。请参考API文档：抓取浏览器API文档。我们的会话功能将帮助您管理会话，包括实时查看功能。

JavaScript Copy

const puppeteer = require('puppeteer-core');
 
const token = 'API密钥'
 
// 自定义指纹
const fingerprint = {
    platform: 'Windows',
}
 
const query = new URLSearchParams({
    session_ttl: 180,
    session_name: 'test_scraping', // 会话名称
    proxy_country: 'ANY',
    token: token,
    fingerprint: encodeURIComponent(JSON.stringify(fingerprint)),
});
 
const connectionURL = `wss://browser.scrapeless.com/browser?${query.toString()}`;
 
(async () => {
    const browser = await puppeteer.connect({browserWSEndpoint: connectionURL});
    const page = await browser.newPage();
 
    await page.goto('https://www.scrapeless.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.google.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.youtube.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await browser.close();
})();

查看实时会话

在无废会话管理界面中，您可以轻松查看实时会话：

方法1：在仪表板中直接查看实时会话

在游乐场创建会话后，您将在右侧看到正在运行的会话。

或者，您可以在实时会话页面上检查会话状态：

方法2：通过实时URL查看会话

为正在运行的会话生成实时URL，允许您在浏览器中实时观看过程。

实时URL对于以下方面非常有用：

调试与监控：实时观察一切或与团队成员分享。
人工交互：直接控制或输入——让用户安全地输入如密码等敏感信息。

您可以通过单击实时会话页面上的"🔗"图标复制实时URL。无论是游乐场还是通过API创建的会话均支持实时URL。

从仪表板获取实时URL

请查看我们下面的教程：

通过API获取实时URL

您还可以通过API调用检索实时URL。以下示例代码通过会话API获取所有运行会话，然后使用实时URL API来检索特定会话的实时视图：

Python Copy

import requests
 
API_CONFIG = {
    "host": "https://api.scrapeless.com",
    "headers": {
        "x-api-token": "API密钥",
        "Content-Type": "application/json"
    }
}
 
 
async def fetch_live_url(task_id):
    try:
        live_response = requests.get(f"{API_CONFIG['host']}/browser/{task_id}/live", headers=API_CONFIG["headers"])
 
        if not live_response.ok:
            raise Exception(f"获取实时URL失败: {live_response.status_code} {live_response.reason}")
 
        live_result = live_response.json()
        if live_result and live_result.get("data"):
            print(f"taskId: {task_id}")
            print(f"liveUrl: {live_result['data']}")
        else:

Copy

print("此任务没有可用的实时 URL 数据")
    except Exception as error:
        print(f"获取任务 {task_id} 的实时 URL 时发生错误: {str(error)}")
 
 
async def fetch_browser_sessions():
    try:
        session_response = requests.get(f"{API_CONFIG['host']}/browser/running", headers=API_CONFIG["headers"])
 
        if not session_response.ok:
            raise Exception(f"获取会话失败: {session_response.status_code} {session_response.reason}")
 
        session_result = session_response.json()
 
        sessions = session_result.get("data")
        if not sessions or not isinstance(sessions, list) or len(sessions) == 0:
            print("未找到活动的浏览器会话")
            return
 
        task_id = sessions[0].get("taskId")
        if not task_id:
            print("在会话数据中未找到任务 ID")
            return
 
        await fetch_live_url(task_id)
    except Exception as error:
        print(f"获取浏览器会话时发生错误: {str(error)}")
 
 
import asyncio
 
asyncio.run(fetch_browser_sessions())

通过 CDP 命令获取实时 URL

要在代码运行时获取实时 URL，请使用 CDP 命令 Agent.liveURL:

Python Copy

import asyncio
 
from pyppeteer import launcher
 
 
async def main():
    try:
        browser = await launcher.connect(
            browserWSEndpoint="wss://browser.scrapeless.com/browser?token=APIKey&session_ttl=180&proxy_country=ANY"
        )
        page = await browser.newPage()
        await page.goto('https://www.scrapeless.com')
 
        client = await page.target.createCDPSession()
        result = await client.send('Agent.liveURL')
        print(result)
    except Exception as e:
        print(e)
 
 
asyncio.run(main())

值得一提的亮点：

实时 URL 不仅允许实时监控，还支持人机交互。

例如：您需要用户输入他们的登录密码。

“哦不！你是在试图窃取我的私人信息吗？不可能！”

实际上，用户可以在屏幕上自己输入数据——一切都保持 100% 私密。这种 直接而安全 的方法即是实时 URL 所使能的——远程交互。

实时 URL：如何促进协作和用户交互

以注册和登录 Scrapeless 为例，演示如何与用户直接互动。

以下是您需要的代码：

JavaScript Copy

const puppeteer = require("puppeteer-core");

(async () => {
    const fingerprint = {
        // 自定义屏幕指纹
        screen: {
            width: 1920,
            height: 1080,
        },
        args: {
            // 将窗口大小设置为与屏幕指纹相同的值
            "--window-size": "1920,1080",
        },
    };

    const query = new URLSearchParams({
        token: "APIKey",
        session_ttl: 600,
        proxy_country: "ANY",
        fingerprint: encodeURIComponent(JSON.stringify(fingerprint)),
    });
    const browserWsEndpoint = `wss://browser.scrapeless.com/browser?${query.toString()}`;

    try {
        const browser = await puppeteer.connect({
            browserWSEndpoint: browserWsEndpoint,
        });

        const page = await browser.newPage();
        await page.setViewport(null);

        await page.goto(`https://app.scrapeless.com/passport/register`, {
            timeout: 120000,
            waitUntil: "domcontentloaded",
        });

        const client = await page.createCDPSession();
        const result = await client.send("Agent.liveURL");

        // 您可以将实时 URL 分享给任何用户
        console.log(`${result.liveURL}`);

        // 等待 5 分钟进行用户注册
        await page.waitForSelector("#none-existing-selector", {timeout: 300_000});
    } catch (e) {
        console.log(e);
    }
})()