一尘不染

og meta标签,社交按钮和angularjs

angularjs

我正在使用多个视图创建一个网站。页面的标签和标签通过$ rootScope变量进行更改。所以我有类似

<html>
<head>
   <title ng-bind="page_title"></title>
   <meta property="og:title" content="{{page_title}}">
</head>

每当将每个视图加载到网站上时,page_title变量都会更改,并且title和og:title标记将更新(一切正常。)

问题是,在某些视图上,我需要加载一个Facebook,一个Google+和一个Twitter按钮。我可以正确显示它们,但如果单击它们,则页面标题看起来像:

{{page_title}}

我试图使用setTimeOut延迟每个按钮的脚本执行,但效果不佳。但是脚本只读取已写的内容,而不会解析page_title。

有谁知道解决方法?

谢谢


阅读 224

收藏
2020-07-04

共1个答案

一尘不染

这无法使用javascript完成。有人认为Facebook正在阅读页面上的当前内容。不是。它使用Scraper使用相同的URL(来自window.location.href)向您的服务器发出单独的请求,而Facebook
Scraper无法运行javascript。这就是为什么当您点击诸如Facebook分享按钮之类的内容时会得到{{page_title}}的原因。您的内容将必须由服务器生成,因此,当Facebook访问该URL时,它将无需JavaScript即可获取所需的内容。您可以通过几种方式解决服务器端渲染。

  1. 您可以允许服务器端技术呈现内容。
  2. 您可以使用PhantomJS方法https://github.com/steeve/angular-seo
2020-07-04