Facebook share button not displaying image

Question

I have an Angular 9 SSR application - http:

在每个页面我都有一个分享Facebook按钮。

我遇到的问题是 og:image 对于大多数页面来说，Facebook无法正确识别。

应用程序中的所有图片都是320px X 200px。

同时 meta 看起来对所有页面都是正确的。

对于这个页面来说，它确实很好用 - http:/www.dosgamesworld.comgamealleycat

     <meta property="fb:app_id" content="1596858517136240">
    <meta property="og:url" content="http://www.dosgamesworld.com/game/alleycat">
    <meta property="og:type" content="website">
    <meta property="og:title" content="DOS Games World - Alley Cat">
    <meta property="og:description" content="Alley Cat is a single player platform game. The player has to assume the role of a cat, which is outside of a house and has to go through a certain track, near ">
    <meta property="og:image" content="http://www.dosgamesworld.com/assets/images/alleycat.png">
  <meta property="og:image:type" content="image/png">
  <meta property="og:image:width" content="320">
  <meta property="og:image:height" content="200">

但是对于其他页面，它不工作：例如 http:/www.dosgamesworld.comgamepop

(meta 看起来是正确的，但实际的分享是缺少照片)

  <meta property="fb:app_id" content="1596858517136240">
    <meta property="og:url" content="http://www.dosgamesworld.com/game/pop">
    <meta property="og:type" content="website">
    <meta property="og:title" content="DOS Games World - Prince of Persia">
    <meta property="og:description" content="Prince of Persia is one of the most famous and entertaining games of all time. The game is a fantasy cinematic platformer, which takes place in Ancient Persia. ">
    <meta property="og:image" content="http://www.dosgamesworld.com/assets/images/pop.png">
  <meta property="og:image:type" content="image/png">
  <meta property="og:image:width" content="320">
  <meta property="og:image:height" content="200">

当我查看facebook开发者工具时，我看到以下错误。Provided og:image URL, http://www.dosgamesworld.com/assets/images/pop.png was not valid because it did not meet the minimum size constraint of 200px by 200px.

Answer 1

啊，知道了，仔细看。在浏览器中打开pop图片的网址。它的名字是pop.png，但它实际上是一张jpeg图片。

将pop的meta从

<meta property="og:image:type" content="image/png">

至

<meta property="og:image:type" content="image/jpg"> or <meta property="og:image:type" content="image/jpeg">

或

将弹出图像改为实际的png。