Node.js中使用Puppeteer无法播放Facebook Reel视频的解决方法

导致视频黑屏的核心原因通常是Puppeteer默认浏览器配置限制了媒体自动播放，或是被Facebook识别为非真实用户环境。以下是针对性的修复方案：

1. 配置浏览器允许媒体自动播放 #

启动浏览器时添加参数，强制允许无需用户交互的自动播放：

const launchOptions = {
    headless: false,
    args: [
        '--autoplay-policy=no-user-gesture-required', // 允许自动播放无需用户手势
        '--mute-audio' // 可选：避免自动播放时的声音干扰，需要声音可移除
    ]
};

2. 模拟真实用户环境 #

通过设置用户代理和视口尺寸，规避Facebook的反爬识别：

await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36');
await page.setViewport({ width: 1920, height: 1080 });

3. 等待视频元素加载并主动触发播放 #

页面加载完成后，视频可能仍未就绪，需等待元素出现后调用播放方法：

await page.goto("https://www.facebook.com/reel/1573966706275454", {
    waitUntil: "networkidle2",
    timeout: 0,
});

// 等待视频元素加载并触发播放
await page.waitForSelector('video[src]', { timeout: 10000 });
await page.evaluate(() => {
    const video = document.querySelector('video[src]');
    if (video) {
        video.play().catch(err => console.error('视频播放失败:', err));
    }
});

4. 禁用Web安全（可选，解决跨域资源加载问题） #

如果上述方法无效，可尝试添加禁用Web安全的参数（注意：仅测试环境使用，生产环境不推荐）：

args: [
    '--autoplay-policy=no-user-gesture-required',
    '--disable-web-security',
    '--disable-features=IsolateOrigins,site-per-process'
]

完整修改后的代码 #

const puppeteer = require("puppeteer");

const testRun = async () => {
    const launchOptions = {
        headless: false,
        args: [
            '--autoplay-policy=no-user-gesture-required',
            '--mute-audio'
        ]
    };
    const browser = await puppeteer.launch(launchOptions);
    const page = await browser.newPage();

    // 模拟真实用户环境
    await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36');
    await page.setViewport({ width: 1920, height: 1080 });

    await page.goto("https://www.facebook.com/reel/1573966706275454", {
        waitUntil: "networkidle2",
        timeout: 0,
    });

    // 等待视频加载并触发播放
    await page.waitForSelector('video[src]', { timeout: 10000 });
    await page.evaluate(() => {
        const video = document.querySelector('video[src]');
        if (video) {
            video.play().catch(err => console.error('视频播放失败:', err));
        }
    });
};

testRun();

额外提示：部分Facebook Reels内容需要登录账号才能访问，若上述方法仍无效，可在代码中添加模拟用户登录的逻辑，登录后再访问Reels链接。

内容的提问来源于stack exchange，提问作者ferdinand