Puppeteer和angularjs html呈现问题

时间:2017-12-23 00:50:57

标签: angularjs puppeteer

我正在尝试使用puppeteer预渲染使用angularjs编写的网页。 我的应用程序的堆栈是MEAN(Mongo-Express-Angular-NodeJs)。

渲染逻辑如下:

var args = [
    '--disable-gpu',
    '--disable-setuid-sandbox',
    '--no-sandbox',
  ];


var getPageContent = async function getPageContent(request)
{
    var url = getUrl(request);
    var browser = await puppeteer.launch({headless: true, handleSIGINT: false, args: args});
    var page = await browser.newPage();
    await page.goto(url, {waitUntil: 'networkidle2'});
    var html = await page.content();
    await browser.close();
    return html;
};

一切正常,我确实得到了页面的html。但是我以有角度的方式获得了html。如下所示:

<title> {{meta.title}} </title>
<meta property="og:title" content="{{meta.title}}">
<meta property="og:description" content="{{meta.description}}">
<meta property="og:image" content="{{meta.imageSrc}}">

我想要的是页面的实际内容而不是{{}}。 类似的东西:

<title> My Page </title>
<meta property="og:title" content="My Page">
<meta property="og:description" content="Page about saving humanity">
<meta property="og:image" content="url_to_image">

我想知道这是否是page.content()的问题?或者是否有任何其他puppeteer API将返回页面的实际原始html?

1 个答案:

答案 0 :(得分:0)

module.exports.getmessages = async (page, selector, message) => {
const messages = [];
const bodyHandle = await page.$$(selector);
console.log(" table of messages length : ", bodyHandle.length);
const length = bodyHandle.length;
console.log(message + "switch ordre after load :\n")
for (let i = 0; i < length; i++) {
    const element = bodyHandle[i];
    const content = await page.evaluate(body => body.textContent, element);
    console.log("message" + i + ": ", content + "\n");
    messages[i] = content;
}
return messages;}

您好,我使用vue js的simular代码,我得到一个由vue创建的正确值的html代码,我希望代码适合你;)