当href参数是变量时，Facebook分享对话框无法工作

Question

我正在尝试从我的Web应用程序中分享链接至Facebook。我已经初始化了SDK，并且以下代码可以正常工作：

callToMyAPI()
    .then(function(response) {
        FB.ui({
            method: "share",
            href: "http://www.google.com",
        }, function(response) {
            console.log(response);
        });
    });

这将弹出Facebook分享对话框，其中包含一个指向http://www.google.com的链接和一个小的嵌入式预览（底部的框显示来自URL的图像，以及页面的标题和描述/摘要）。当我点击对话框中的“发布到Facebook”按钮后，切换到Facebook页面，我会看到带有共享链接的帖子。

但是我需要动态设置href参数，使用从我的API返回的值。因此，我改为这样做：

callToMyAPI()
    .then(function(response) {
        var url = response; // http://www.google.com

        FB.ui({
            method: "share",
            href: url,
        }, function(response) {
            console.log(response);
        });
    });

基本上，我所做的就是用变量url（其值为响应，即http://www.google.com）替换硬编码的"http://www.google.com"。其他所有内容都完全相同。但是，当我这样做时，会发生以下情况：

1. Facebook分享对话框仍然打开，但缺少我要分享的URL的嵌入式预览。

2. 当我单击“发布到Facebook”按钮时，对话框关闭，但从未发布任何内容到Facebook。记录下来的响应只是一个空数组（[]）

所以使用我的API响应作为href值时会出现问题，但我不知道原因。我该如何解决呢？

更新：经过多次尝试和错误，“我发现了这种奇怪的行为......”

如果我将http://dev.example.com用作href值（其中example.com实际上是我的真实域），则在共享对话框中没有预览，并且不会发布任何内容到Facebook。

FB.ui({
    method: "share",
    href: "http://dev.example.com"
});

但是如果我使用http://www.example.com（注意www）作为href值（再次强调，example.com实际上是我的真实域名），我仍然无法在分享对话框中获得预览，但是帖子确实可以发布：

FB.ui({
    method: "share",
    href: "http://www.example.com"
});

然而，由于在共享对话框中仍然没有预览功能，它实际上并未将链接附加到消息中。因此，在Facebook上，我只能得到一个带有我写的任何评论的帖子，但没有嵌入到 http://www.example.com 的链接。

- daGUY

---

你尝试过简单的 href: response 吗？ - isherwood

是的，实际上我先这样做了，但没有任何区别。我只是使用了“url”变量，以使它更清晰，即这是来自我的API的响应，而不是来自Facebook的响应。 - daGUY

如果您编写var url ='http：//www.google.com';，它是否有效？ 如果是，则可能response变量是一个对象而不是字符串。 - Tasos K.

是的，但我的回复也是一个字符串。这个问题描述了一个类似的问题：http://stackoverflow.com/questions/25440700/fb-ui-facebook-share-doesnt-work-on-posts?rq=1 - daGUY

Answer 1

真正的答案有三个方面：

1. 我的 http://dev.example.com 网站需要身份验证；由于我已经保存了用户名/密码，所以我完全忘记了这一点，因此它从未提示我

2. 我的 http://www.example.com 实际上是一个较长的 URL (http://www.example.com/test/12345)，它没有指向该服务器上的现有页面（它只存在于我的开发服务器上）。因此 Facebook 可以访问该 URL（无需进行身份验证），但无法从中抓取任何内容，因此帖子可以发布，但没有嵌入式预览。

3. 我要分享的页面缺少各种 Open Graph 元标签（og:type 等）；显然，href 是您可以通过共享方法传递的唯一参数，而用于共享所需的其他所有内容都必须来自页面上的 OG 标签。

因此，我在页面上添加了缺失的 OG 标签（除了 og:url），暂时禁用了我的开发服务器上的身份验证（供测试使用），现在终于可以正确地附加链接发布帖子了。

- daGUY

Answer 2

我是一名有用的助手，可以为您进行文本翻译。以下是需要翻译的内容：

我遇到了同样的问题，并通过在要分享的URL末尾添加一个随机的GET参数来解决它。

例如：

var url = window.location;
url = url+"?randomParameter=randomValue"

FB.ui({ method:'share', href: url }, function(response){});

- obit

---

你的问题在于window.location不是一个字符串，而是一个Location对象。它大多数情况下会自动转换为字符串，但Facebook要求你发送一个字符串。当你将另一个字符串连接起来时，url被转换为字符串，就没有问题了。真正的解决方案是使用window.location.href。 - glerendegui

Answer 3

我暂时通过使用feed方法代替share方法来解决这个问题，如this answer中所提到的：

callToMyAPI()
    .then(function(response){
        var url = response;

        FB.ui({
            method: "feed",
            link: url,
        }, function(response) {
            console.log(response);
        });
    });

语法与share方法完全相同，只是参数名称为link而不是href，并且它可以正常工作。这证实了我的响应确实是一个字符串，所以我真的不明白为什么share不能以同样的方式工作。

唯一的问题是，feed方法已弃用，将在2015年4月30日停止工作。因此，我仍然希望找到一种使用更新的share方法使其能够工作的方法。

- daGUY