與Facebook分享動態更新元標簽-角度6

Question

我需要動態更新og：title，og：description和og：image等元標記，並在Facebook上共享它們，我已經嘗試了所有方法，但無濟於事。

因此，首先，我嘗試使用javascript設置元標記，如下所示：

var meta = document.createElement('meta');
meta.httpEquiv = "X-UA-Compatible";
meta.content = "IE=edge";
document.getElementsByTagName('head')[0].appendChild(meta);

然后我嘗試使用如下所示的角度元標記：

加上：-

this.meta.addTag({ name: 'og:description', content: 'How to use Angular 6 meta service' });

更新：-

this.meta.updateTag({ name: 'og:description', content: 'Angular 6 meta service' });

但這一切都失敗了，最后我在meta包下面嘗試了一下，

https://github.com/vinaygopinath/ng2-meta

但在將我的網站網址共享給facebook時 ， 我仍然遇到動態字段問題，如果有人在發布后發布網址，它應該顯示動態內容。

如果有人有主意，請告訴我！

Answer 1

您嘗試過的所有方法都在客戶端進行。 您需要在這里了解一件事：當您在Facebook上共享URL時，它會向您的服務器發出請求，讀取元標記，然后在facebook.com中更新卡。 JavaScript稍后發布。 因此，無論您嘗試使用哪種方法，如果它正在瀏覽器中執行，都將無法在此處使用。 我建議您嘗試以下方法之一：

使用為此專門構建的Angular Universal的服務器端渲染。 該文檔可以在以下網址找到： https : //angular.io/guide/universal 。 該解決方案的缺點是必須從節點服務器提供HTML頁面。