Консоль поиска Google не индексирует мое приложение Angular SPA. Команда Angular динамически вставляет метатег «noindex» в заголовок, а после завершения рендеринга страницы компонент Angular удаляет метатег «noindex». Насколько я понимаю, эта стратегия якобы избегает индексации SPA до того, как Angular отображает веб-сайт, и избегает индексации 404 страниц. Я придерживался того же подхода, что и Angular.io SPA, но я вижу разные результаты в Google Search Console.
My SPA - это ванильный проект Angular CLI с несколькими маршрутизированными модулями с отложенной загрузкой, и компоненты внутри маршрутизированных модулей с отложенной загрузкой отвечают за удаление мета-тега noindex.
Очевидно, что Google индексирует Angular.io просто отлично https://www.google.com/search?q=angular+router+-site%3A+angular.io
Вот мой index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Site Title</title>
<meta name="description" content="My SEO meta description" />
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script>
// Dynamically, pre-emptively, add `noindex`, which will be removed when the doc is ready and valid
tag = document.createElement('meta'); tag.name = 'robots'; tag.content = 'noindex';
document.head.appendChild(tag);
</script>
</head>
<body>
<app-root></app-root>
</body>
</html>
И Angular.io index.html. https://github.com/angular/angular/blob/57f7996b6d2bee5a63902637fdec5b60b9a857cd/aio/src/index.html#L35
Это мой app.route.ts
export const routes: Routes = [
{
path: '',
pathMatch: 'full',
loadChildren: './routed/home/home.module#HomeModule',
data: {
page: 'home',
}
},
// <editor-fold desc="Catch-All Routes">
{
path: '**',
loadChildren: './routed/not-found/not-found.module#NotFoundModule'
}
// </editor-fold>
];
@NgModule({
imports: [
BrowserModule,
FormsModule,
RouterModule.forRoot(routes)
],
exports: [RouterModule]
})
export class AppRouterModule { }
А это отрывок моего лениво загруженного маршрутизируемого home компонента модуля, который удаляет метатег "noindex".
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
constructor(private metaService: Meta) {
this.metaService.removeTag('name="robots"');
}
ngOnInit() {
}
}
И это компонент Angular.io, отвечающий за удаление метатега "noindex" https://github.com/angular/angular/blob/57f7996b6d2bee5a63902637fdec5b60b9a857cd/aio/src/app/app.component.html#L53
https://github.com/angular/angular/blob/57f7996b6d2bee5a63902637fdec5b60b9a857cd/aio/src/app/layout/doc-viewer/doc-viewer.component.ts#L161
При просмотре исходного кода в инструментах разработчика Chrome тег <head> не содержит метатега noindex. Однако при входе в консоль поиска Google и выполнении живого теста я получаю эту ошибку: «Исключен тегом« noindex ». В метатеге« robots »обнаружено« noindex »*