将很长的 url 传递给 Puppeteer - 有更好的方法吗? [英] Passing very long url to Puppeteer - is there a better way?

查看:105
本文介绍了将很长的 url 传递给 Puppeteer - 有更好的方法吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

所以一个 git 问题让我回滚了大约两周的工作 -

我目前正在尝试将大约 3300 个字符串的数组传递给把手模板,然后尝试将其打印为 pdf - 我的问题是我很确定我的 pupepteer URL 被截断为 3000 个字符.我不知道如何解决.

 <<<<<<<我的数据记录为 ----->数组(3330)[对象,对象,对象,对象,对象,对象,对象,对象,...]>>>var templateHtml = fs.readFileSync(path.join(process.cwd(), 'template.html'), 'utf8');var template = handlebars.compile(templateHtml);var html = 模板(数据);await page.goto(`data:text/html;charset=UTF-8,${html}`, {等待:10000});

在我的 git 崩溃之前,我正在打印 90 页的 PDF,但我无法弄清楚我之前做了什么.

解决方案

答案

您的问题似乎是 数据 URI 长度限制.在2MBrel="nofollow noreferrer">铬.因此,如果您的 html 超出限制,它将被修剪甚至根本不呈现.

我建议使用 page.setContent 内容相同,没有上限.

示例

注意: setContent 需要一个字符串作为输入,我刚刚复制了example.com的源代码.

const puppeteer = require('puppeteer')异步函数 fn() {const browser = await puppeteer.launch({ headless: true })const page = await browser.newPage()await page.goto('data:text/html,<h1>模板</h1>')等待页面.waitFor(2000)等待 page.setContent('<!doctype html><头><title>示例域</title><meta charset="utf-8";/><meta http-equiv="Content-type";内容=文本/html;字符集=utf-8"/><元名称=视口"内容=宽度=设备宽度,初始比例=1";/><style type="text/css">身体 { 背景颜色:#f0f0f2;边距:0;填充:0;font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;} div { 宽度:600px;保证金:5em 自动;填充:2em;背景颜色:#fdfdff;边界半径:0.5em;box-shadow: 2px 3px 7px 2px rgba(0,0,0,0.02);} a:link, a:visited { 颜色:#38488f;文字装饰:无;} @media (max-width: 700px) { div { margin: 0 auto;宽度:自动;} } </style><身体><div><h1>示例域</h1><p>该域用于文档中的说明性示例.您可以在没有事先协调或征得许可的情况下在文献中使用此域.</p><p><a href=https://www.iana.org/domains/example">更多信息...</a></p>

</html>')等待 page.pdf({ 路径:'page.pdf' })等待 browser.close()}fn()

So a git issue had me roll back about two weeks of work -

Im currently trying to pass an array of about 3300 string to a handlebars template then trying to print that as a pdf - my issue is I'm pretty sure my pupepteer URL is being cut off at 3000 characters. Im at a loss for a workaround.

 <<<< my data logs as -----> Array(3330) [Object, Object, Object, Object, Object, Object, Object, Object, …] >>>

 var templateHtml = fs.readFileSync(path.join(process.cwd(), 'template.html'), 'utf8');
    var template = handlebars.compile(templateHtml);
    var html = template(data);

await page.goto(`data:text/html;charset=UTF-8,${html}`, {
        waitFor:10000
    });

before my git meltdown I was printing out 90 page PDF's and I just cant figure out what I did before.

解决方案

Answer

Your problem seems to be the Data URI length limitation. It is 2MB in case of Chromium. So if your html exceeds the limit it will be trimmed or even not rendered at all.

I suggest to use page.setContent with the same content as it has no upper limit.

Example

Note: setContent needs a string as input, I've just copied the source of example.com.

const puppeteer = require('puppeteer')

async function fn() {
  const browser = await puppeteer.launch({ headless: true })

  const page = await browser.newPage()
  await page.goto('data:text/html,<h1>Template</h1>')
  await page.waitFor(2000)
  await page.setContent(
    '<!doctype html> <html> <head> <title>Example Domain</title> <meta charset="utf-8" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style type="text/css"> body { background-color: #f0f0f2; margin: 0; padding: 0; font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } div { width: 600px; margin: 5em auto; padding: 2em; background-color: #fdfdff; border-radius: 0.5em; box-shadow: 2px 3px 7px 2px rgba(0,0,0,0.02); } a:link, a:visited { color: #38488f; text-decoration: none; } @media (max-width: 700px) { div { margin: 0 auto; width: auto; } } </style> </head> <body> <div> <h1>Example Domain</h1> <p>This domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission.</p> <p><a href="https://www.iana.org/domains/example">More information...</a></p> </div> </body> </html>'
  )

  await page.pdf({ path: 'page.pdf' })

  await browser.close()
}
fn()

这篇关于将很长的 url 传递给 Puppeteer - 有更好的方法吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆