async await puppeteer.launch 不工作 onClick with puppeteer-web

Question

I'm trying to be able to run a puppeteer node task on the server when a button is clicked in the browser.当在浏览器中单击按钮时，我试图能够在服务器上运行 puppeteer 节点任务。 I'm not sure if I have the correct environment set up because I get "Uncaught (in promise) TypeError: Cannot read property 'call' of undefined".我不确定我是否设置了正确的环境，因为我收到"Uncaught (in promise) TypeError: Cannot read property 'call' of undefined".

When I run $node src/js/pdfTest.js from CMD, it outputs the file as expected so I'm not sure what I'm missing.当我从 CMD 运行 $node src/js/pdfTest.js 时，它会按预期输出文件，所以我不确定我错过了什么。 I'm using puppeteer/puppeteer-web.js, C# .NET, JavaScript, with Node 10.15.0 installed on my local windows/WSL machine我正在使用 puppeteer/puppeteer-web.js、C# .NET、JavaScript，在我的本地 Windows/WSL 机器上安装了 Node 10.15.0

pdf.html pdf.html

<head>
    <script src="src/js/libs/jquery-3.3.1.min.js"></script>
    <script src="src/js/libs/handlebars/handlebars-v4.1.0.js"></script>
    <script src="src/js/handlebarsHelpers.js"></script>
    <script src="src/js/templates.js"></script>
</head>
<body>
    <button id="pdfBtn">Save PDF</button>
    <div id="pdf">
    </div>
    <script src="src/js/pdf.js"></script>
    <script src="src/js/pdfTest.js"></script>
</body>

(I load a handlebars template on the page inside the #pdf div from another js file) （我从另一个 js 文件的 #pdf div 内的页面上加载了一个把手模板）

pdf.js pdf.js

var Pdf = (function () {
    'use strict';

    $(document).ready(function () {
        render();
    });

    function render() {
    console.log("rendering pdf.js");
        $("#pdfBtn").on("click", function () {
            PdfTest.printPDF();
        });
    }

    return {
        render: render
    }
}());

pdfTest.js pdfTest.js

var PdfTest = (function () {
    async function printPDF() {
        const puppeteer = require('puppeteer');

        (async () => {
            const browser = await puppeteer.launch();
            const page = await browser.newPage();

            await page.goto('http://localhost:60639/pdf.html');
            await page.waitFor(2000);
            await page.pdf({ path: 'src/pdf/mynewpdf.pdf', format: 'A4', printBackground: true })
            await browser.close();
        })()
    };

    return {
       printPDF: printPDF
    }
}());

This code from pdfTest.js (if I replace the above with just this snippet) is working perfectly when I call it from the command line.当我从命令行调用它时，来自 pdfTest.js 的这段代码（如果我只用这个片段替换了上面的代码）工作得很好。

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    await page.goto('http://localhost:60639/pdf.html');
    await page.waitFor(2000);
    await page.pdf({ path: 'src/pdf/mynewpdf.pdf', format: 'A4', printBackground: true })
    await browser.close();
})()

Error:错误：

Uncaught (in promise) TypeError: Cannot read property 'call' of undefined
    at puppeteer-web.js:8902
    at new Promise (<anonymous>)
    at promisified (puppeteer-web.js:8894)
    at Launcher.launch (puppeteer-web.js:5074)
    at module.exports.launch (puppeteer-web.js:7887)
    at pdfTest.js:85
    at Object.printPDF (pdfTest.js:92)
    at HTMLButtonElement.<anonymous> (postTrekPdf.js:43)
    at HTMLButtonElement.dispatch (jquery-3.3.1.min.js:2)
    at HTMLButtonElement.y.handle (jquery-3.3.1.min.js:2)

Answer 1

In browser javascript there is no function require()在浏览器 javascript 中没有函数require()

You have to send Event to main thread becouse this code works on client side in browser and browser can't open another browser.您必须将事件发送到主线程，因为此代码可在浏览器的客户端运行，并且浏览器无法打开另一个浏览器。 You can also send API request to eg.您还可以将 API 请求发送到例如。 localhost/dosmthn.本地主机/域。

Make webserver on console that sends html file.在发送 html 文件的控制台上制作网络服务器。 In this file when you click button API request is send and your nodejs application do puppeteer things.在此文件中，当您单击按钮 API 请求被发送并且您的 nodejs 应用程序执行木偶操作时。 And return to you (browser) pdf file.并返回给您（浏览器）pdf 文件。 Then you can display this file in browser.然后你可以在浏览器中显示这个文件。

I hope it helps我希望它有帮助

async await puppeteer.launch 不工作 onClick with puppeteer-web

问题描述

1 个解决方案

解决方案1
0 2020-06-10 16:21:51

async await puppeteer.launch 不工作 onClick with puppeteer-web

问题描述

1 个解决方案

解决方案1 0 2020-06-10 16:21:51

解决方案1
0 2020-06-10 16:21:51