Question

在经历了一些现有问题及其答案之后，我无法在AngularJs中实现完美的策略。

我找到的方法是实现它 -

创建Nginx中间层，以不同方式为抓取者请求提供服务。
转换AngularJS应用程序以支持HTML5模式。但它仅由Google（使用WebMaster Tool）搜索引擎支持。
使用支持的工具来支持AngularJS中的SEO，例如brombone，prerender，getseojs

我需要帮助来选择这个替代方案，这对我的1到20个AngularJS（SAP）是有益的。我已经完成了这个堆栈question

Answer 1

正如链接的堆栈问题所说

＆＃34; Google抓取工具现在可以执行javascript - 您可以使用Google 网站管理员工具可以更好地了解您的网站的呈现方式谷歌＆＃34; Check it out here

这意味着您不需要经历许多痛苦的步骤来让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>

如果您有类似的指令，那么搜索引擎优化元数据和标题应该由谷歌抓取而没有问题。

如何在AngularJS SPA中实现SEO

1 个答案: