当 href 参数是变量时，Facebook 共享对话框不起作用

Question

我正在尝试通过我的网络应用程序在 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 时，我会看到带有共享链接的帖子。

但我需要使用从我的 API 返回的值动态设置 href 参数。所以我这样做了：

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

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

基本上，我所做的只是将硬编码的"http://www.google.com" 替换为变量url（其值是响应，即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 的嵌入式链接。

Answer 1

我现在通过使用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 方法是 deprecated，并将在 2015 年 4 月 30 日停止工作。所以我仍然想找到一种方法来使用较新的share 方法。

Answer 2

真正的答案是三方面的：

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 是您可以通过 share 方法传入的唯一参数，而共享所需的其他所有参数都必须来自页面上的 OG 标签

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

Answer 3

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

例如：

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

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