Node-fetch获取"View Source"的HTML,想要"Inspector"中的内容



我正在使用node fetch来获取网站的内容。我读过几个类似的问题,比如这个或这个,但我仍然想不通。

当我在页面上时,当我进入View:Source时,我会看到一组HTML,而另一组在Inspector中。这似乎是因为网站向我显示的是即时DOM,而View Source(CTRL+U(向我显示了最初发送的内容?例如;视图:源;HTML的开始:

<!doctype html><html lang="en" translate="no"><head><meta name="version"/><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/>

而";检查员;HTML版本开始:

<html translate="no" class="fontawesome" lang="en"><head style=""><script 

以下是我的请求当前是如何使用节点提取设置的:

const fetch = (...args) => import('node-fetch').then(({default: fetch}) => fetch(...args));
var options1 = {
method: 'POST'
,headers:{/*omitting the options here*/  }
,body:       new URLSearchParams(postData)};
var urlString1       = new URL(url);
fetch(urlString1, options1)
.then(res =>{console.log(res.headers); return res.text();})
.then(values=>{ console.log(values);});
;

我如何设置我的请求以从";检查员;而不是来自";查看源"?

这似乎是因为网站向我显示即时DOM,而View Source(CTRL+U(向我显示最初发送的内容?

没错。

View Source向您显示HTML的文本内容。

浏览器开发工具中的DOM树(右键单击并单击"检查元素"时会看到(显示实际加载的元素是什么,包括自加载以来使用JavaScript进行的任何操作。基本上,HTML被解析,树被构建,然后为了开发人员的方便,它以一种很好的格式再次转换回HTML,供您在开发人员工具中查看。

我如何设置从";检查员;而不是来自";查看源"?

您需要实际运行浏览器引擎,例如headless Chrome。有几个NPM包可以做到这一点。

最新更新