在 WSL2 上运行 Puppeteer 控制 Windows 上的 Chrome

Question

我正在尝试在 WSL2 上运行 puppeteer。我尝试过通过 VcXsvr 使用远程显示，但我的防火墙设置和主机进行了自定义更改，坦率地说我已经放弃了查看 https://learn.microsoft.com/en-us/windows/wsl/tutorials/gui -apps 正在开发中。

因此，与此同时，我尝试使用以下测试代码直接连接到 Windows Chrome 安装：

const puppeteer = require('puppeteer');

const EXECUTABLE_PATH = '/mnt/c/Users/[username]/AppData/Local/Google/Chrome/Application/chrome.exe';
const USER_DATA_DIR = 'C:\\Users\\[username]\\AppData\\Local\\Google\\Chrome\\User Data';


const url = process.argv[2];
console.log(url);
if (!url) {
    throw "Please provide URL as a first argument";
}
async function run () {
    try {
        const browser = await puppeteer.launch({
            executablePath: EXECUTABLE_PATH,
            userDataDir: USER_DATA_DIR,  
            headless: false,
            ignoreDefaultArgs: ['--disable-extensions'],

        });
        const page = await browser.newPage();
        await page.goto(url);
        await page.screenshot({path: 'screenshot.png'});
        browser.close();
    } catch(err){
        console.log(err)
    }
}
run();

我看到 chrome 打开，但随后显示以下错误：

Error: Failed to launch the browser process!
[4348:24368:0526/115831.752:ERROR:cache_util_win.cc(20)] Unable to move the cache: Access is denied. (0x5)
[4348:24368:0526/115831.753:ERROR:cache_util.cc(144)] Unable to move cache folder C:\Users\[username]\AppData\Local\Google\Chrome\User Data\ShaderCache\GPUCache to C:\Users\[username]\AppData\Local\Google\
Chrome\User Data\ShaderCache\old_GPUCache_001
[4348:24368:0526/115831.753:ERROR:disk_cache.cc(184)] Unable to create cache
[4348:24368:0526/115831.753:ERROR:shader_disk_cache.cc(606)] Shader Cache Creation failed: -2


TROUBLESHOOTING: https://github.com/puppeteer/puppeteer/blob/main/docs/troubleshooting.md

    at onClose (~/development/my-puppeteer-app/node_modules/puppeteer/lib/launcher/BrowserRunner.js:189:20)
    at Interface.helper_1.helper.addEventListener (~/development/my-puppeteer-app/node_modules/puppeteer/lib/launcher/BrowserRunner.js:179:65)
    at Interface.emit (events.js:203:15)
    at Interface.close (readline.js:397:8)
    at Socket.onend (readline.js:173:10)
    at Socket.emit (events.js:203:15)
    at endReadableNT (_stream_readable.js:1145:12)
    at process._tickCallback (internal/process/next_tick.js:63:19)

我无法从提供的故障排除链接中找出如何解决此问题，也找不到显示此问题的任何其他来源。欢迎任何建议。

Answer 1

这是我采用不同路径的解决方案：

请注意我使用的路径，因为我认为这是OP的问题

const puppeteer = require('puppeteer-core');
const { exec } = require('child_process');
const chromeExecutable =      
'/mnt/c/Program Files/Google/Chrome/Application/chrome.exe';

    
    // Node.js Puppeteer - launch devtools locally
    const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
    const openDevtools = async (page, client) => {
      // get current frameId
      const frameId = page.mainFrame()._id;
      // get URL for devtools from scraping browser
      const { url: inspectUrl } = await client.send('Page.inspect', {
        frameId,
        executablePath: chromeExecutable,
      });
      // open devtools URL in local chrome
      exec(`"${chromeExecutable}" "${inspectUrl}"`, (error) => {
        if (error) throw new Error('Unable to open devtools: ' + error);
      });
      // wait for devtools ui to load
      await delay(5000);
    };

    // Create a new page in the browser
    const page = await browser.newPage();

    // Create a new CDPSession in the browser
    const client = await page.target().createCDPSession();
    await openDevtools(page, client);

我没有发布所有代码，因为这是不必要的，但这是我对打开开发工具问题的解决方案。