Question

我正在尝试使用从Puppeteer开始的Headless Chromium中的本地文件。

我总是遇到以下错误：

'Cross origin requests are only supported for protocol schemes: http, data, chrome, https'

我确实尝试设置--allow-file-access-from-file。

可以复制如下：

const puppeteer = require('puppeteer');

puppeteer.launch({headless:true,args:['--allow-file-access-from-files']}).then(
  async browser => {
    const page = await browser.newPage();
    await page.setContent('<html><head><meta charset="UTF-8"></head><body><div>A page</div></body></html>');
    await page.addScriptTag({url:"https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"});
    await page.on('console', msg => console.log('PAGE LOG:', msg.text()));
    await page.evaluate (() => {
      $.get('file:///..../cors.js')
        .done(
           _ => console.log('done')
        ).fail(
          e => console.log('fail:'+JSON.stringify(e))
        );
    });
  await browser.close();
  }
);

看看正在运行的进程，看起来好像Chromium是使用该选项启动的。

热烈欢迎所有提示！

Answer 1

您正尝试使用$.get()从Page DOM环境中加载本地文件，由于它违反了same-origin policy，因此无法正常工作。

Chromium标志--allow-file-access-from-files如下所述：

默认情况下，file：// URI无法读取其他file：// URI。对于需要旧行为进行测试的开发人员来说，这是一个替代。

此标志不适用于您的情况。

您可以使用Node.js函数fs.readFileSync()来获取文件的内容并将其传递给page.evaluate()：

const fs = require('fs');

const file_path = '/..../cors.js';
const file_content = fs.existsSync(file_path) ? fs.readFileSync(file_path, 'utf8') : '';

await page.evaluate(file_content => {
  console.log(file_content);
}, file_content);

木偶-使用'--allow-file-access-from-files'通过XMLHttpRequest加载本地文件不起作用

1 个答案: