如何渲染"继续作为X"Facebook登录像Pinterest

Question

如何告诉Facebook加载一个登录按钮,显示登录用户的个人资料图片,就像Pinterest正在做的那样？

有人问过这个问题,Facebook登录就像Pinterest风格,但答案是黑客.如果您将Pinterest的app_id替换为您自己的app_id,保留其他所有内容,您只需再次获得常规登录按钮.Pinterest是否只是获得了这个很酷的功能的特殊私人访问权限？

我发现Pinterest所做的唯一相关代码来自他们的UnauthHomereactPage javascript文件.我被命名为"entryChunk-react-UnauthHomeReactPage-c85eaea8.js"

t.prototype.renderProfilePicButton = function P() {
        var e = this
          , t = '<div class="fb-login-button" data-scope="public_profile,email,user_likes,user_about_me,user_birthday,user_friends" onlogin="checkLoginState"></div>';
        return l["default"].createElement("div", {
            dangerouslySetInnerHTML: {
                __html: t
            },
            ref: function n(t) {
                e.profilePicButton = t
            },
            // This style just sets the height to 50px.
            style: R.fbProfileButton
        })
    }

和

FB.init({
    appId: f["default"].GEN.templateConst.settings.FACEBOOK_API_KEY,
    status: !0,
    xfbml: !0,
    version: "v2.7"
})

但是当我尝试它时,我的按钮只是常规的:

并且生成的iframe URL完全相同,除了我的" https://www.facebook.com/plugins "而不是Pinterest的" https://www.facebook.com/v2.7/plugins "和app_id ,域名和来源不同.

有任何想法吗？

Answer 1

现在已经正式了

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.9&appId=286230584903471";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

<div id="fb-root"></div>
<div class="fb-login-button" data-max-rows="1" data-size="large" data-button-type="continue_with" data-show-faces="false" data-auto-logout-link="false" data-use-continue-as="true"></div>