使用 Javascript 将动态内容共享到 Facebook 新闻提要的最简单方法?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8292480/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 02:57:27  来源:igfitidea点击:

Simplest way to share dynamic content to Facebook news feed with Javascript?

javascriptfacebookfacebook-graph-apisharefacebook-like

提问by Visa Kopu

I want my users to be able to share dynamic content on their Facebook news feed. There's no other Facebook integration (e.g. Facebook login or other server-side integration) so I want this to be as light as possible.

我希望我的用户能够在他们的 Facebook 新闻提要上分享动态内容。没有其他 Facebook 集成(例如 Facebook 登录或其他服务器端集成),所以我希望这尽可能简单。

This is where I got, but how does it looks like? It seems to work, but I'm not sure if I've thought of everything.

这是我得到的地方,但它看起来如何?它似乎有效,但我不确定我是否已经考虑了一切。

<button id="fb-publish">Share to Facebook</button>

<script type="text/javascript">
(function() {
    FB.init({
        appId: MY_FACEBOOK_APP_ID, cookie: true, status: true, xfbml: true, oauth: true
    });
    var fbAuth = null;
    var fbShare = function() {
        FB.ui({
            method: "feed",
            display: "iframe",
            link: "http://example.com/",
            caption: "Example.com",
            description: "Here is the text I want to share.",
            picture: "http://example.com/image.png"
        });
    };
    $("#fb-publish").click(function() {
        if (!fbAuth) {
            FB.login(function(response) {
                if (response.authResponse) {
                    fbAuth = response.authResponse;
                    fbShare();
                }
            }, {scope: 'publish_stream'});
        } else {
            fbShare();
        }
    });
})();
</script>

Also, if I want to attach an image from a URL (bigger than just the 50x50 pixel image defined in the picturefield), how can I do that with just JavaScript? Or can I?

另外,如果我想从 URL 附加图像(大于picture字段中定义的 50x50 像素图像),我该如何仅使用 JavaScript 来实现?或者我可以吗?

采纳答案by Visa Kopu

I decided to leave out authResponsecaching and call FB.login()every time. It briefly opens a popup window, but at least there's no case where user has logged out in another tab or window and the cached authResponsehas gone stale. The briefly flashing popup window is not that big of an issue, since I don't think users will share the same page multiple times, anyway.

我决定不使用authResponse缓存并FB.login()每次都调用。它会短暂地打开一个弹出窗口,但至少不会出现用户在另一个选项卡或窗口中注销并且缓存authResponse已经过时的情况。短暂闪烁的弹出窗口并不是什么大问题,因为我认为用户不会多次共享同一页面。

Here's my final code which is even simpler than the original one:

这是我的最终代码,它比原始代码更简单:

<button id="fb-publish">Share to Facebook</button>

<script type="text/javascript">
(function() {
    FB.init({
        appId: MY_FACEBOOK_APP_ID, cookie: true, status: true, xfbml: true, oauth: true
    });
    var fbShare = function() {
        FB.ui({
            method: "feed",
            display: "iframe",
            link: "http://example.com/",
            caption: "Example.com",
            description: "Here is the text I want to share.",
            picture: "http://example.com/image.png"
        });
    };
    $("#fb-publish").click(function() {
        FB.login(function(response) {
            if (response.authResponse) {
                fbShare();
           }
        }, {scope: 'publish_stream'});
    });
})();
</script>

And as mentioned by Tolga Arican, if it's ok to you that the sharing dialog opens in a popup window, you don't even need to call FB.login()and ask for the publish_streampermission; just call FB.ui({ method: "feed" })directly and you're good to go:

正如 Tolga Arican 所提到的,如果您可以在弹出窗口中打开共享对话框,您甚至不需要打电话FB.login()请求publish_stream许可;直接打电话FB.ui({ method: "feed" })就可以了:

<button id="fb-publish">Share to Facebook</button>

<script type="text/javascript">
(function() {
    FB.init({
        appId: MY_FACEBOOK_APP_ID, cookie: true, status: true, xfbml: true, oauth: true
    });
    $("#fb-publish").click(function() {
        FB.ui({
            method: "feed",
            link: "http://example.com/",
            caption: "Example.com",
            description: "Here is the text I want to share.",
            picture: "http://example.com/image.png"
        });
    });
})();
</script>

回答by Tolga Arican

1) Make sure appId defined.

1) 确保定义了 appId。

2) In FB.login , response.authResponse may not work. I'm not pretty sure but just throw console.log, it may response.session

2) 在 FB.login 中, response.authResponse 可能不起作用。我不太确定但只是抛出console.log,它可能是response.session

3) in method:feed , you can put larger images for picture, but it wil downsize. There is no way to put big images as a feed thumbnail. It is just a thumb of a feed..

3) 在 method:feed 中,您可以为图片放置更大的图像,但它会缩小尺寸。无法将大图像作为提要缩略图。这只是一个饲料的拇指..

For the lightest method:feed js, you don't need display:iframe i guess.

对于最轻的方法:feed js,我猜你不需要 display:iframe。

FB.ui( {
method: 'feed',
name: 'Facebook Dialogs',
link: 'http://developers.facebook.com/docs/reference/dialogs/',
picture: 'http://fbrell.com/f8.jpg',
caption: 'Reference Documentation',
description: 'Dialogs provide a simple, consistent interface for applications to interface with users.' }, function(response) {} });