2015-03-13 48 views
2

通常情况下,如果我不希望谷歌抓取网页,我会的页面添加到我的robots.txt文件,像这样:阻止谷歌索引的AngularJS路线

User-agent: * 
Disallow: /my-page 

为了防止谷歌索引该页面,我就从我sitemap.xml删除页面下面的元标记添加到网页的<head>

<meta name="robots" content="noindex"> 

现在,如果我用AngularJS来处理所有路由单个页面的应用程序,你如何阻止谷歌索引和/或者抓取路线? Angular为每条路线带来ng视图中的内容,因此<head>中的信息在每条路线上都保持不变。我不认为我可以在这种情况下添加元标记。

回答

3

如果您的根模块放置在<html>标记(<html ng-app="myApp">)上,则可以修改<head>中的所有属性。这允许您为每个页面动态设置机器人<meta>。您可以使用根模块中的$routeChangeSuccess事件来完成此操作。如果你使用的是ui-router,你可以在路由上设置一个'data'属性,你可以在每次状态改变时读入它。您也可以使用$ rootScope从其他模块更新此值,但这不是一个好习惯。最好的方法是从子控制器/指令向你的根模块广播一个改变。

我有一个动态更改页面<title>的示例,但它有点复杂,因为此应用程序正在手动引导。但是,想象在<html>标记上有一个ng-app =“”和ng-controller =“”指令。

这里是状态改变事件:https://github.com/danmindru/angular-boilerplate-study/blob/master/src/app/_app-main/_app-main.controller.js#L14-L24

下面是广播听众:https://github.com/danmindru/angular-boilerplate-study/blob/master/src/app/_app-main/_app-main.controller.js#L38-L40

这里的广播是如何触发:https://github.com/danmindru/angular-boilerplate-study/blob/master/src/app/profile-feature/customer-page/customer-page.controller.js#L12

这里的<title>结合:https://github.com/danmindru/angular-boilerplate-study/blob/master/src/index.html#L4

但是,Google并不擅长阅读这些属性,因此您必须使用预渲染服务t o确保googlebot将解析<meta name="robots" content="noindex">而不是<meta name="robots" content="{{index}}">之类的内容。

+0

谢谢。我的应用程序已经预渲染SEO,我总是把根模块放在html标签上,所以这应该可以正常工作。 – Coop 2015-03-15 15:30:24