如何在动态呈现中为搜索引擎用户代理提供静态 HTML？

Question

我正在尝试使用 "Prerender.cloud" 服务创建动态呈现示例。我使用了 URL.

的预渲染版本

我可以把代码结构放在这里，但这不是问题。

a) 我净化了 CSS。 b) 我删除了所有不必要的代码和资源。 c) 我更改了资源 order/organisation 以获得更快的速度。 d) 优化图像。 e) 减少了请求大小。 f) 减小了页面大小。

我将页面速度提高了 3 秒，并将大小减小了 %200。

但主要问题在这里：

我有一个根域。com/example-dynamic-rendering 页面。这是原始页面。我想把这个送给客户。

此外，我有我的预呈现示例，我想知道如何从同一个 URL 向搜索引擎用户代理提供此静态 HTML 页面？

您对此任务有任何想法或代码吗？

请帮忙。

Answer 1

您可以使用 puppeteer 加载动态 page/app 并加载它的 HTML 并将内容保存到 HTML 文件。然后，如果 Google 爬虫程序访问您的站点，您可以要求他们通过 robots.txt 文件来抓取此 HTML 文件。

您可以运行每次想要运行这个人偶脚本。也许你可以使用 cron 来自动运行这个脚本。

像这样：

const puppeteer = require ('puppeteer')
const CronJob = require ('cron').CronJob
const fs = require ('fs-extra')

const crontask = '0 */1 * * *' // This will run script every hour
const urlDynamic = 'https://www.example.com' // Change this to your dynamic url
const staticFile = 'statichtml.html'

;(async () => {

    const browser = await puppeteer.launch ({
        headless: true,
        devtools: false
    })

    const [page] = await browser.pages ()

    const autorun = async () => {

        const open = await page.goto ( urlDynamic, { waitUntil: 'networkidle2', timeout: 0 } )

        const html = await page.content ()

        const save = await fs.writeFile ( staticFile, html )

    }

    const job = new CronJob(crontask, async () => {
        autorun ()
    })
    job.start()

})

如何在动态呈现中为搜索引擎用户代理提供静态 HTML？

How to Serve Static HTML to the Search Engine User-Agents in Dynamic Rendering?

rendering

static-html

puppeteer