使用 javascript 设置 Facebook 分享者显示的图像答案

【问题标题】：Use javascript to set the image shown by Facebook sharer使用 javascript 设置 Facebook 分享者显示的图像
【发布时间】：2012-03-21 15:39:06
【问题描述】：

我正在尝试动态设置使用 javascript 分享到 Facebook 时显示的缩略图。我尝试将元标记“og：image”添加到页面（它是一个 JSP）并且它有效，但我现在想做的是用另一个由 javascript 动态加载的图像替换这样的图像。

基本上，页面在加载时调用 API，使用 javascript 并检索图像列表。我想使用其中之一作为缩略图。

我尝试使用 javascript 替换元标记的内容，但 Facebook 似乎并不关心它（如果我用浏览器检查它确实会改变）。

可以这样做吗？

提前致谢！

【问题讨论】：

标签： javascript facebook thumbnails share meta

【解决方案1】：

这是我用来从 Flash 对象标签的 flashvars 参数中提取图像 url 的函数，然后使用 jquery 将其分配给元标签：

$(window).load(function(){
//Use $(window).load() instead of $(document).ready(), so that the flash code has loaded and you have all the html you need process with javascript already in place when you start processing.
    var stringToExtractFrom = $('param[name="flashvars"]').attr('value');
//Get the flashvars parameter value which we'll use to extract the preview image url from.
    var pos = stringToExtractFrom.indexOf("&");
//Search for the position ampersand symbols which surround the image url.
    var stringToUse;
//The final string we'll use.
    var startOfImageSrc = null;
//The first position where we discover the ampersand
    var endOfImageSrc;
//The second position where we discover the ampersand
    var lengthToSubstract
//How many symbols to chop off the flashvars value.
    while(pos > -1) {
        if(startOfImageSrc == null){
            startOfImageSrc = pos;
        }
        else {
            endOfImageSrc = pos;
            lengthToSubstract = endOfImageSrc - startOfImageSrc;
        }
        pos = stringToExtractFrom.indexOf("&", pos+1);
    }
    stringToUse = stringToExtractFrom.substr(startOfImageSrc+7, lengthToSubstract-7);
    $('meta[property="og:image"]').attr('content', stringToUse); });

【讨论】：

【解决方案2】：

Facebook 机器人从不运行 java 脚本代码但是为什么你不尝试在服务器端设置 og 标签呢？

【讨论】：

我读到你可以使用 #!让它运行javascript，但不确定我是否完全理解它是否以及如何工作。我想避免运行服务器端代码，这意味着要更改很多已经存在的代码。
也许吧，但 javascript 并不是一种完全值得信赖的解决问题的方法