1

我正在尝试通过 javascript api 返回 facebook 用户的个人资料图片

<script type="text/javascript">   
    function get_profile_pic(){
                    FB.api("/me/picture?type=square",  function(response) {
                    alert(response.data.url); 
                        return response.data.url;
                    });
                }
    </script>

在我的 html 文件中，我有：

<img class="profile_pic" src="get_profile_pic();"/>

在我的 css 文件中，我有

    #profile_pic {
   height: 50px;
   width: 50px; 
   top: 315px;
    left: 30px;
    position: absolute;
    display: block;
}

但是当我加载页面时，个人资料图片不可见。我知道 api 可以正常工作，因为警报中的 url 是用于图片的，但我不知道我缺少什么，因为它不会加载到 html 页面上。任何帮助，将不胜感激！

4

1 回答 1

1

该src属性需要是一个 url。它不会执行javascript。但是，在加载 FB api 之后，您可以做的是调用get_profile_pic()，但只有在您将其更改为以下内容之后：

function get_profile_pic(){
                FB.api("/me/picture?type=square",  function(response) { 
                    $('.profile_pic').attr('src', response.data.url);
                });
            }

注意：这使用 jQuery。会更新我的答案..

让我知道这是否有意义或者您有任何问题:)

纯Javascript

通过将代码放在window.fbAsyncInit之后FB.init，您可以确保在调用 facebook api 之后执行您的代码。例如，以下是前面脚本的纯 javascript 实现：

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    // init the FB JS SDK
    FB.init({
      appId      : 'YOUR_APP_ID',                        // App ID from the app dashboard
      channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel file for x-domain comms
      status     : true,                                 // Check Facebook Login status
      xfbml      : true                                  // Look for social plugins on the page
    });

    // Additional initialization code such as adding Event Listeners goes here
    FB.api("/me/picture?type=square",  function(response) {
        var profilePics = document.getElementsByClassName('profile_pics');
        for (i=0; i<a.length; i++)
        {
            profilePics[i].src = response.data.url;
        }
    });
  };

  // Load the SDK asynchronously
  (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_US/all.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
于 2013-08-15T05:06:17.643 回答