如何解决可以在没有SSR的情况下通过Googlebot识别的Angular 8组件来设置HTML标题和元标记吗?
我的组件使用setTitle
和updateTag
更新标题和标签。屏幕上的剩余数据通过模板绑定更新到通过主机请求获得的对象。 Google搜索控制台会显示正确的屏幕数据,但会显示默认的标题和元标记。
没有通用汽车,有没有办法解决这个问题?
constructor(private dataService: DataService,private route: ActivatedRoute,private meta: Meta,private title: Title,private canonicalService: CanonicalService) {}
ngOnInit() {
this.canonicalService.setCanonicalURL();
this.route.params.subscribe(
params => {
const id = +params['id'];
this.getLicense(id);
}
);
let list = sessionStorage.getItem('liclist');
if (list) {
this.licList = JSON.parse(list);
}
this.dataService.getEnum().subscribe((data: Enum[]) => {
this.enums = data;
});
}
getLicense(id) {
this.dataService.getLicense(id).subscribe((data: License) => {
this.license = data;
this.licListPtr = this.licList.findIndex(x => x === id);
this.meta.updateTag({
name: "keywords",content: !!this.license.keywords ? this.license.keywords.toLowerCase().replace("~",",") : ' '
});
let desc = this.license.licDesc;
if (!!this.license.occs) {
this.license.occs.forEach(o => {
desc += `\nOccupation ${o.occCode} ${o.occTitle.toLowerCase()}`;
});
this.meta.updateTag({
name: "description",content: desc
});
this.title.setTitle(`Licensing for ${this.license.licTitle}`);
}
})
}
解决方法
我认为,如果没有像Angular Universal这样的SSR,就不可能实现。
我在一些项目中遇到了同样的问题。您的元标记确实已在更新,但是网络搜寻器可能只查看了一次。我注意到某些社交网络对爬虫也有相同的限制。我认为随着SPA的普及,我们可能会看到爬虫开始适应。
,查看@ angular / platform-browser。
setTitle('blah blah') with a constructor:
constructor(private titleService: Title) {
const title = 'MyPage-Title'; // set from the server
this.titleService.setTitle(title);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。