Node.js Angular2搜索引擎优化-如何使Angular2应用程序可爬行
我正在使用创建一个Angular 2应用程序 我想通过谷歌和其他搜索引擎实现快速一致的索引，并允许Facebook sharer和其他搜索引擎生成我的JS生成内容的预览 通常SPA使用PhantomJS在服务器端呈现页面，并将静态HTML发送到客户端 当然，当我截获一个“转义片段”或看到google或scraper用户代理时，我自己也可以生成PhantomJS，但当直接在流量大的网站上生成PhantomJS时，我总是会遇到内存泄漏和孤立的PhantomJS实例（我使用了NodeJS和） 对于Angular 1应用程序，我曾经用Angular模块来解决这个问题，例如，但似乎很难将此类模块转换为Angular 2Node.js Angular2搜索引擎优化-如何使Angular2应用程序可爬行,node.js,seo,phantomjs,angular,angular2-meteor,Node.js,Seo,Phantomjs,Angular,Angular2 Meteor,我正在使用创建一个Angular 2应用程序 我想通过谷歌和其他搜索引擎实现快速一致的索引，并允许Facebook sharer和其他搜索引擎生成我的JS生成内容的预览 通常SPA使用PhantomJS在服务器端呈现页面，并将静态HTML发送到客户端 当然，当我截获一个“转义片段”或看到google或scraper用户代理时，我自己也可以生成PhantomJS，但当直接在流量大的网站上生成PhantomJS时，我总是会遇到内存泄漏和孤立的PhantomJS实例（我使用了NodeJS和） 对于An
我还没有找到任何合适的Angular 2模块。我应该自己构建它，还是现在还有其他好方法来实现这一点？Angular2的好处在于，当启动时，根应用程序元素中的所有内容都会消失。这意味着你可以把任何你想要的东西放在那里，从你想要被爬虫抓取的服务器上 您可以在应用程序中使用服务器呈现的内容版本生成此内容，或者使用自定义逻辑 您可以在此处找到更多信息： 这里：我刚刚创建了一个Angular2模块，可以根据当前路线更改元标记
const routes: Routes = [
{
path: 'home',
component: HomeComponent,
data: {
meta: {
title: 'Home page',
description: 'Description of the home page'
}
}
},
{
path: 'dashboard',
component: DashboardComponent,
data: {
meta: {
title: 'Dashboard',
description: 'Description of the dashboard page',
'og:image': 'http://example.com/dashboard-image.png'
}
}
}
];
<head>
<meta name="title" content="Website Name">
<meta name="og:title" content="Website Name">
<meta name="og:image" content="http://example.com/fallback-image.png">
...
</head>
...
对服务器端渲染的支持正在进行中。服务器端渲染不是谷歌排名的要求 我有一个论坛，它的谷歌网站地图文件中有大约33000个条目。这个网站是用asp.NETWebForms编写的，有大量来自谷歌的请求。这个网站确实有非常糟糕的移动可读性（这是谷歌的惩罚，它实际上在我的谷歌“搜索控制台”中提到了这一点） 我用angular重写了所有内容（部署的版本是angular5）。我正在使用Title和Meta服务设置我的Title和Meta标记。所有路由都包含从实际内容中提取的关键字。我还确保每个带有[routeLink]属性的元素都是一个a标记，我还指定了href元素（这是爬虫寻找的元素…），当然，我非常关注移动设备的可读性 结果：我实际上得到了比以前更多的访问量，在搜索控制台中，我清楚地看到我的索引页面增加了：在30k+页面中，只有大约10K包含在索引中。现在我的索引中有将近25k页 我并不是说服务器端渲染无关紧要。使用通用或其他方法将导致更快的下载时间，这可能会导致更高的分数。但谷歌绝对能够正确地索引一个角度SPA
编辑：一些证据：如果你在谷歌上搜索“3ds max threadripper”，你会发现它的排名实际上超过了互联网上最大的硬件网站之一。很棒的视频，聪明的搜索引擎优化，比幻影方法更好这个答案现在在Angular的更新版本中被弃用，因为它是@Angular/platform服务器的一部分。这似乎不适用于Angular Universal，该页面在服务器端生成document.querySelector没有定义“我使用ng2meta插件，它看起来不像站长工具/google抓取它。”。它仍然认为我有重复的元标记，例如用于描述。有什么想法吗？
<head>
<meta name="title" content="Website Name">
<meta name="og:title" content="Website Name">
<meta name="og:image" content="http://example.com/fallback-image.png">
...
</head>