如何在AngularJS SPA中实现SEO

在经历了一些现有的问题和答案后,我无法在AngularJs中实现SEO的完美策略。

我find的方法是 –

  1. 创buildNginx中间层,以不同方式提供爬虫请求。

  2. 将AngularJS应用程序转换为支持HTML5模式。 但只有Google (使用WebMaster Tool )search引擎支持。

  3. 使用付费工具来支持AngularJS中的SEO,如brombone , prerender , getseojs

我需要帮助来select这个替代品,这对我的1到20个AngularJS(SAP)将是有益的。 我已经经历了这个问题

正如链接堆栈问题所说的

“Google抓取工具现在可以执行javascript,您可以使用Google网站管理员工具来更好地了解您的网站是如何由Google呈现的。” 看看这里

这意味着您不需要经历很多痛苦的步骤才能让Google对AJAX加载的HTML进行索引。 如果你用AJAX加载元数据,你会没事的。

我所做的一个解决方案是创建一个AngularJS指令,以快速添加来自加载的模型的页面的元数据和标题名称。

/* SEO directives */ dtvs.directive('metaSeo', function() { return { restrict: 'E', scope: { desc: '=', title: '=' }, link: function(scope, el, attr) { scope.$watch('desc', function() { return $("head meta[name='description']").attr('content', scope.desc); }); return scope.$watch('title', function() { return $("head title").html(scope.title); }); } }; }); 

在上面的例子中,我使用jQuery来做到这一点,但是可以随意交换。

上面的指令给你一个HTML元素,你可以把它放在那个页面的某个地方:

 <meta-seo data-desc="lesson.brief" data-title="lesson.title"></meta-desc> 

如果你有一个类似的指令,那么SEO元数据和标题应该由谷歌没有问题抓取。