js抓取网页内容(谷歌爬虫是如何抓取javascript的？学习到的知识)

　　js抓取网页内容(谷歌爬虫是如何抓取javascript的？学习到的知识)

　　我们测试了谷歌爬虫是如何抓取javascript的，以下是我们从中学到的知识。

　　认为谷歌无法处理 javascript？再想想。audette audette 分享了一系列的测试结果，他和他的同事测试了谷歌和收录 会抓取什么类型的javascript函数。

　　

　　长话短说

　　1. 我们进行了一系列的测试，并确认谷歌可以以多种方式执行和收录 javascript。我们也确认了谷歌可以渲染整个页面并读取dom，可以收录动态生成内容。

　　2. dom中的seo信号（页面标题、meta描述、canonical标签、meta robots标签等）都是关注的。动态插入dom的内容也可以爬取和收录。此外，在某些情况下，dom 甚至可能优先于 html 源代码语句。虽然这需要更多的工作，但这是我们的几个测试之一。

　　简介：google 执行javascript & 读取dom

　　早在2008年，google就成功爬取了javascript，但很可能仅限于某种方式。

　　今天，很明显，Google 不仅可以制定自己的抓取和 收录 javascript 类型，而且在呈现整个网页方面也取得了重大进展（尤其是最近 12 到 18 个月）。

　　在merkle，我们的seo 技术团队希望更好地了解Google 爬虫可以抓取哪些类型的javascript 事件和收录。经过研究，我们发现了惊人的结果，并确认 Google 不仅可以执行各种 javascript 事件，还可以动态生成 收录 内容。怎么做？谷歌可以读取dom。

　　什么是dom？

　　很多搞seo的人不明白什么是文档对象模型（dom）。

　　

　　当浏览器请求一个页面时会发生什么，以及 dom 如何参与其中。

　　在 Web 浏览器中使用时，dom 本质上是一个应用程序接口或 api，用于标记和构建数据（例如 html 和 xml）。该界面允许 Web 浏览器将它们组合成一个文档。

　　dom 还定义了如何获取和操作结构。尽管 dom 是一种独立于语言的 API（不绑定到特定的编程语言或库），但它通常用于 javascript 和 Web 应用程序的动态内容。

　　dom 代表一个接口或“桥”，它将网页与编程语言连接起来。解析html并执行javascript的结果是dom。网页的内容不是（不仅）源代码，而是 dom。这使它变得非常重要。

　　

　　javascript 如何通过 dom 接口工作。

　　我们很高兴地发现 Google 可以读取 dom，并且可以解析信号和动态插入的内容，例如标题标签、页面文本、标题标签和元注释（例如：rel = canonical）。您可以阅读完整的详细信息。

　　这一系列的测试和结果

　　因为想知道会爬取哪些javascript函数和收录，所以分别在谷歌爬虫上创建了一系列测试。通过创建控件，确保可以独立理解 url 活动。下面，让我们详细介绍一些有趣的测试结果。它们分为5类：

　　1、javascript 重定向

　　2、javascript 链接

　　3、动态插入内容

　　4、元数据和页面元素的动态插入

　　5、rel = "nofollow" 的一个重要例子

　　

　　示例：用于测试 Google 抓取工具理解 javascript 能力的页面。

　　1. javascript 重定向

　　我们首先测试了常见的javascript重定向，不同方式表达的URL会有什么结果？我们为两个测试选择了 window.location 对象：test a 使用绝对路径 url 调用 window.location，而 test b 使用它的相对路径。

　　结果：重定向很快就被谷歌跟踪了。从收录的角度来看，它们被解释为301——最终状态的url，而不是google收录中的redirect url。

　　在随后的测试中，我们在权威网页上使用完全相同的内容来完成使用 javascript 重定向到同一站点的新页面。原创网址在 Google 热门查询的主页上排名。

　　结果：果然，重定向被谷歌跟踪了，但是原创页面不是收录。新的url为收录，立即被安排在同一个查询页面的同一个位置。这让我们感到惊讶。从排名的角度来看，JavaScript 重定向行为（有时）与永久性 301 重定向非常相似。

　　下次，您的客户想要为他们的 网站 完成 javascript 重定向操作，您可能不需要回答，或者回答：“请不要”。因为这好像有转职排名信号的关系。引用谷歌的指导方针支持这一结论：

　　使用 javascript 重定向用户可能是一种合法的做法。例如，如果您将登录用户重定向到内部页面，则可以使用 javascript 来完成此操作。在仔细检查 javascript 或其他重定向方法时，请确保您的网站遵循我们的指南并考虑其意图。请记住，将 301 重定向重定向到您的 网站 是最好的，但是如果您无权访问您的 网站 服务器，您可以为此使用 javascript 重定向。

　　2. javascript 链接

　　我们用多种编码方式测试了不同类型的js链接。

　　我们测试下拉菜单的链接。历史搜索引擎一直无法跟踪这种类型的链接。我们要确定是否会跟踪 onchange 事件处理程序。重要的是这只是特定类型的执行，而我们需要的是：其他变化的影响，而不是像上面javascript重定向的强制操作。

　　

　　示例：google 工作页面上的语言选择下拉菜单。

　　结果：链接被完全抓取和跟踪。

　　我们还测试了常见的 javascript 链接。以下是最常见的 javascript 链接类型，而传统的 seo 推荐纯文本。这些测试包括 javascript 链接代码：

　　作用于外部 href 键值对 (avp)，但在标签内 ("onclick")

　　函数 href 内部 avp("javascript: window.location")

　　在 a 标签之外进行操作，但在 href 中调用 avp("javascript: openlink()")

　　还有很多

　　结果：链接被完全抓取和跟踪。

　　我们接下来的测试是进一步测试事件处理程序，比如上面的onchange测试。具体来说，我们要使用事件处理程序进行鼠标移动，然后隐藏 url 变量，该变量仅在事件处理程序（在本例中为 onmousedown 和 onmouseout）被触发时执行。

　　结果：链接被完全抓取和跟踪。

　　构造链接：我们知道谷歌可以执行javascript，但是我们想确认他们是否可以读取代码中的变量。所以在这个测试中，我们连接了可以构造url字符串的字符。

　　结果：链接被完全抓取和跟踪。

　　3. 动态插入内容

　　显然，这些是要点：动态插入文本、图像、链接和导航。高质量的文本内容对于搜索引擎理解网页的主题和内容至关重要。在这个充满活力的网站时代，它的重要性毋庸置疑。

　　这些测试旨在检查在两种不同场景中动态插入文本的结果。

　　1)。测试搜索引擎是否可以统计动态插入的文本，文本来自页面的html源代码。

　　2)。测试搜索引擎是否可以统计动态插入的文本，并且文本来自页面的html源代码之外（在外部javascript文件中）。

　　结果：两种情况下都可以抓取文本和收录，页面根据内容排名。凉爽的！

　　为了深入了解，我们测试了一个用javascript编写的客户端全局导航，导航中的链接是通过document.writein函数插入的，确认可以完全爬取和跟踪。需要指出的是，谷歌可以解释网站使用angularjs框架和html5历史api（pushstate）构建，可以渲染和收录它，并且可以像传统的静态网页一样排名。这就是不禁止谷歌爬虫获取外部文件和javascript的重要性，这可能也是谷歌将其从“支持Ajax的Seo指南”中删除的原因。当您可以简单地呈现整个页面时，谁需要一个 html 快照？

　　经过测试，发现无论是什么类型的内容，结果都是一样的。比如图片加载到dom后会被抓取和收录。我们甚至做了这样一个测试：通过动态生成结构数据来制作面包屑（breadcrumb navigation），并插入到dom中。结果？成功插入后的面包屑出现在搜索结果中（搜索引擎结果页面）。

　　值得注意的是，Google 现在推荐使用 json-ld 标签来形成结构化数据。我相信未来会有更多基于此的东西。

　　4. 动态插入元数据和页面元素

　　我们动态地将各种对 seo 至关重要的标签插入到 dom 中：

　　标题元素

　　元描述

　　元机器人

　　规范标签

　　结果：在所有情况下，标签都可以被抓取并表现得像 html 源代码中的元素。

　　一个有趣的补充实验可以帮助我们理解优先级的顺序。当出现相互矛盾的信号时，哪一个会获胜？如果源代码中没有index,nofollow标签，dom中没有index,follow标签，会发生什么？在这个协议中，http x-robots 响应头部如何将行为作为另一个变量使用？这将是未来全面测试的一部分。但是，我们的测试表明，当发生冲突时，Google 会忽略源代码中的标签并支持 dom。

　　5. rel="nofollow" 的一个重要例子

　　我们想测试谷歌如何响应出现在源代码和dom的链接级别的nofollow属性。我们还创建了一个没有 nofollow 的控件。

　　

　　对于nofollow，我们分别测试了源码vs dom生成的注解。

　　源代码中的 nofollow 按我们预期的方式工作（未跟踪链接）。但是dom中的nofollow无效（链接被跟踪，页面为收录）。为什么？因为修改dom中href元素的操作发生得太晚了：在执行添加rel=”nofollow”的javascript函数之前，谷歌已经准备好抓取链接并排队等待url。但是，如果将带有 href="nofollow" 的 a 元素插入到 dom 中，nofollow 和链接将被跟踪，因为它们是同时插入的。

　　结果

　　从历史的角度来看，各种 seo 建议都尽可能关注“纯文本”内容。而动态生成的内容，ajax和javascript链接都会损害主流搜索引擎的seo。显然，这对谷歌来说不再是问题。javascript 链接的操作方式类似于普通的html 链接（这只是表面，我们不知道程序在幕后做了什么）。

　　JavaScript 重定向的处理方式与 301 重定向类似。

　　动态插入的内容，即使是meta标签，比如rel规范的注解，无论是在html源码中还是在解析初始html后触发JavaScript生成dom，都会被同样处理。

　　Google 依赖于能够完全呈现页面并理解 dom，而不仅仅是源代码。不可思议！（请记住允许 Google 爬虫获取这些外部文件和 javascript。）

　　谷歌已经以惊人的速度在创新方面将其他搜索引擎甩在了后面。我们希望在其他搜索引擎中看到相同类型的创新。如果他们要在新的网络时代保持竞争力并取得实质性进展，就意味着他们必须更好地支持html5、javascript和dynamic网站。

　　对于seo，不了解上述基本概念和google技术的人应该学习学习，以追赶当前的技术。如果你不考虑dom，你可能会失去一半的份额。

　　本文所表达的观点并非全部由搜索引擎地（搜索引擎网站）提供，部分观点由客座作者提供。所有作者的名单。