javascript - Facebook 分享 : preview window is empty first time Share is clicked

Question

我的网站上有一个共享按钮(图像)。单击后，以下 js 将创建共享预览:

window.open('https://www.facebook.com/sharer/sharer.php?u=www.mysite.com/thepage/', 'facebook-share-dialog', 'width=626,height=436');

第一次在页面上单击“共享”按钮时，预览为空白。它甚至不显示网址。如果共享窗口关闭，并且再次单击“共享”按钮，那么它就可以正常工作。

这些页面是用户生成的，因此不可能浏览每个页面并确保每个共享按钮已被单击一次，也不可能对每个页面进行 linter。

Answer 1

我遇到了同样的问题，并在 Facebook 的文档中找到了解决方案:

Use og:image:width and og:image:height Open Graph tags

Using these tags will specify the image to the crawler so that it can render it immediately without having to asynchronously.

只需确保您的开放图形标签包括宽度和高度以及图像源。您的元标记应如下所示:

<meta property="og:image" content="...image.jpg" />
<meta property="og:image:width" content="500" />
<meta property="og:image:height" content="600" />