Question

我已经为我的网站提供了Facebook和Twitter的所有元标记。角度开发网站：还提供了xmlns。

<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">

有人可以让我知道我在这里想念的东西吗。

在Facebook调试器上，我收到的消息为

推断的属性：即使可以从其他标签推断值，也应明确提供'og：image'属性。

缺少属性：缺少以下必需属性：og：url，og：type，og：title，og：image，og：description，fb：app_id

  updateTitle(title?: string) {

    if (!title) {
      this.router.events
        .pipe(
          filter((event) => event instanceof NavigationEnd),
          map(() => this.activatedRoute),
          map((route) => {
            while (route.firstChild) { route = route.firstChild; }
            return route;
          }),
          filter((route) => route.outlet === 'primary'),
          mergeMap((route) => route.data)).subscribe((event) => {
            this.titleService.setTitle(event['title']);
            this.meta.updateTag({ name: 'description', content: event['description'] });
            this.meta.updateTag({ name: 'author', content: event['author'] });
            this.meta.updateTag({ name: 'keywords', content: event['keywords'] });
            this.meta.updateTag({ name: 'news_keywords', content: event['news_keywords'] });

            //Indexing / Spiders 
            this.meta.updateTag({ name: 'googlebot', content: "all" });
            this.meta.updateTag({ name: 'bingbot', content: "all" });
            this.meta.updateTag({ name: 'robots', content: "all" });

            //OpenGraph

            this.meta.updateTag({ name: 'og:type', content: "article" });
            this.meta.updateTag({ name: 'og:site_name', content: 'kadakfeed.com' });
            this.meta.updateTag({ name: 'og:title', content: event['title'] });
            this.meta.updateTag({ name: 'og:description', content: event['description'] });
            this.meta.updateTag({ name: 'og:url', content: this.url + event['url'] });
            this.meta.updateTag({ name: 'og:image', content: this.imgUrlPath + event['url'] + "/" + event['img'] });
            this.meta.updateTag({ name: 'og:image:width', content: "600" });
            this.meta.updateTag({ name: 'og:image:height', content: "340" });
            this.meta.updateTag({ name: 'fb:app_id', content: "2152587131722996" });



            //Twitter
            this.meta.updateTag({ name: 'twitter:card', content: "summary_large_image" });
            this.meta.updateTag({ name: 'twitter:site', content: "@kadakfeed" });
            this.meta.updateTag({ name: 'twitter:title', content: event['title'] });
            this.meta.updateTag({ name: 'twitter:description', content: event['description'] });
            this.meta.updateTag({ name: 'twitter:image', content: this.imgUrlPath + event['url'] + "/" + event['img'] });

          });
    } else {
      this.titleService.setTitle(title);
    }

}

在app.component.ts中，我正在调用元服务updateTitle（）

constructor(public metaService: MetaserviceService) {
    this.metaService.updateTitle();

  }

Answer 1

您的Open Graph协议密钥不正确，您必须使用property而不是name

http://ogp.me/#structured

/* the key value is wrong

this.meta.updateTag({
  name: 'og:type',
  content: "article"
});

*/

this.meta.updateTag({
  property: 'og:type',
  content: "article"
});
this.meta.updateTag({
  property: 'og:site_name',
  content: 'kadakfeed.com'
});
....

Angular / Facebook：即使可以从其他标签推断出值，也应明确提供'og：image'属性

1 个答案: