almost 6 years ago
FBTEST.HTML
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>FB測試</title>
    </head>
    <body>
        <div id="fb-root"></div>
        <script type="text/javascript">
            window.fbAsyncInit = function() {
                FB.init({appId: '515295501861364', status: true, cookie: true, xfbml: true});
                //這裡要輸入你的appId 到 FB 開發者申請
                /* All the events registered */
                FB.Event.subscribe('auth.login', function(response) {
                    // do something with response
                    login();
                });
                FB.Event.subscribe('auth.logout', function(response) {
                    // do something with response
                    logout();
                });
 
                FB.getLoginStatus(function(response) {
                    if (response.session) {
                        // logged in and connected user, someone you know
                        login();
                    }
                });
            };
            (function() {
                //將FB的內容使用append方式加入
                var e = document.createElement('script');
                e.type = 'text/javascript';
                e.src = document.location.protocol +
                    '//connect.facebook.net/en_US/all.js';
                e.async = true;
                document.getElementById('fb-root').appendChild(e);
            }());
 
            function login(){
                FB.api('/me', function(response) {
                    document.getElementById('login').style.display = "block";
                    document.getElementById('login').innerHTML = response.name + " 你已經成功登入!";
                });
            }
            function logout(){
                //document.getElementById('login').style.display = "none";
                document.getElementById('login').innerHTML = response.name + " 你目前未登入!";
            }
 
            //stream publish method
            function streamPublish(name, description, hrefTitle, hrefLink, userPrompt){
                FB.ui(
                {
                    method: 'stream.publish',
                    message: '',
                    attachment: {
                        name: name,
                        caption: '',
                        description: (description),
                        href: hrefLink
                    },
                    action_links: [
                        { text: hrefTitle, href: hrefLink }
                    ],
                    user_prompt_message: userPrompt
                },
                function(response) {
 
                });
 
            }
            function showStream(){
                FB.api('/me', function(response) {
                    //console.log(response.id);
                    streamPublish(response.name, 'FB測試', 'hrefTitle', 'http://localhost', "分享FB測試");
                });
            }
 
            function share(){
                var share = {
                    method: 'stream.share',
                    u: 'http://localhost'
                };
 
                FB.ui(share, function(response) { console.log(response); });
            }
 
            function graphStreamPublish(){
                var body = '直接寫入到使用者的訊息';
                FB.api('/me/feed', 'post', { message: body }, function(response) {
                    if (!response || response.error) {
                        alert('發生錯誤');
                    } else {
                        alert('Post ID: ' + response.id);
                    }
                });
            }
 
            function fqlQuery(){
                FB.api('/me', function(response) {
                     var query = FB.Data.query('select name, hometown_location, sex, pic_square from user where uid={0}', response.id);
                     query.wait(function(rows) {
                        //可以選擇更多 使用SQL語法的方式來撈取
                       document.getElementById('name').innerHTML =
                         '你的名字: ' + rows[0].name + "<br />" +
                         '性別:' + rows[0].sex + "<br/>" + 
                         '家鄉:' + rows[0].hometown_location + "<br/>" +
                         '<img src="' + rows[0].pic_square + '" alt="" />' + "<br />";
                     });
                });
            }
            
            function fqlQuery2(){
                FB.api('/me', function(response) {
                     var query = FB.Data.query('select name, hometown_location, sex, pic_square from user where uid={0}', '100000263966335');
                     query.wait(function(rows) {
                        //取得已知的UID的資訊
                       document.getElementById('name').innerHTML =
                         '朋友的名字: ' + rows[0].name + "<br />" +
                         '性別:' + rows[0].sex + "<br/>" + 
                         '家鄉:' + rows[0].hometown_location + "<br/>" +
                         '<img src="' + rows[0].pic_square + '" alt="" />' + "<br />";
                     });
                });
            }
            
            function setStatus(){
                //
                status1 = document.getElementById('status').value;
                FB.api(
                  {
                    method: 'status.set',
                    status: status1
                  },
                  function(response) {
                    if (response == 0){
                        alert('你的狀態未更新,取得更新授權');
                    }
                    else{
                        alert('狀態已經更新');
                    }
                  }
                );
            }
        </script>
 
        <h3>JavaScript範例</h3>
        <p><fb:login-button autologoutlink="true" perms="email,user_birthday,status_update,publish_stream"></fb:login-button></p>
 
        <p>
            <a href="#" onclick="showStream(); return false;">貼到我的塗鴉牆</a> |
            <a href="#" onclick="share(); return false;">分享給你的朋友</a> |
            <a href="#" onclick="graphStreamPublish(); return false;">透過介面發布訊息</a> |
            <a href="#" onclick="fqlQuery(); return false;">取得使用者參數(FQL)</a> |
            <a href="#" onclick="fqlQuery2(); return false;">取得朋友使用者參數(FQL)</a>
        </p>
 
        <textarea id="status" cols="50" rows="5">測試寫寫東西,按下送出按鈕</textarea>
        <br />
        <a href="#" onclick="setStatus(); return false;">送出</a>
 
        <br /><br /><br />
        <div id="login" style ="display:none"></div>
        <div id="name"></div>
 
    </body>
</html>

參考來源:http://greenchiou.blogspot.tw/2010/12/javascript-facebook-sdk-width-graphic.html

← Android Project Default Activity 修改ASP預設日期格式 →
 
comments powered by Disqus