Sampson-Li
Sampson.Li学习经验总结博客 学历代表过去,能力代表现在.学习力代表未来!

参考资料  (为方便以后自己使用.总结一些小的步骤)

 Facebook 所有权限的资料和其他api的资料可以直接访问以下地址查找:https://developers.facebook.com/docs/ 

现在一个项目是开发facebook上面的web app,开发web app需要注册成为facebook开发者,这个很简单,进入 https://developers.facebook.com/

   注册过程不详细写了,很简单,需要注意的是:

                      1、website项目中的站点url和domain两个项目是不需要http://开头的;而app on facebook的canvas URL,是需要写http的。而且这一段是实际上从facebook打开这个app时,嵌入的iframe的地址。

                      2、如果本机测试,可以直接使用localhost作为地址,真正上线的时候记得改回来就行。也可以用改host文件的方法随便指定一个域名,加端口访问也没问题,就是不能用ip地址,提交通不过。

          注册好了,就开始开发吧,我们首先不使用C#的sdk,直接使用facebook提供的javascript api:

                      1、创建一个静态页面,引入脚本

                             http://connect.facebook.net/en_US/all.js

                             除此之外,还要引用jquery,写脚本方便嘛;

                      2、另外需要在页面上方这么一个div:

                             <div id="fb-root">

                             如果不放,就会脚本报错。放哪儿都行,也不显示。但是要放在fb初始话的脚本前面。

                     3、写段脚本吧,这里我们有个登录按钮:

            FB.init({ appId: '{这里是appid}', status: true, cookie: true, xfbml: true });
            $("#FBLogin").click(function () {
                FB.login(function (response) {
                    if (response.session) {
                        // 登录成功
                        window.location = 'about.aspx'
                    } else {
                        // 
                    }
                }, { perms: "publish_stream" });
            });

这里首先初始化了fb对象,需要appid,它在创建时自动生成。第二个呢注册了一个登录按钮的点击事件,点击后直接调用FB封装好的login方法,第一个参数是回调函数,第二个参数是一个json对象,这里注明了该app的访问权限是publish_stream,差不多是最小权限了吧。

FB.api({path}, 'GET', {}, function(response){
        if (!response || response.error) {
            alert('Error occured');
        }
        else {
            …
        }
    })

  path就是对应访问内容的路径,比如访问个人资料,就填me,访问某视频的信息,可以直接填视频的id。很简单吧,回调函数中都是返回的json对象,书写也很便利。          项目用到一半,除了登入退出外,也就用了这么两类的api,很简单吧。

下面贴一下,自己写的一个demo

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>

<script src="https://connect.facebook.net/en_US/all.js"></script>

<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>

</head>
<body>
<img src="/images/article_root/News_con_img.jpg" style="cursor: pointer; vertical-align: middle;"
alt="facebook sign up" onclick="facebook_signup()" />&nbsp;使用FaceBook帳號登入!
<div id="fb-root">
</div>

<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({ appId: '264470130268960', status: true, cookie: true, xfbml: true });
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = 'http://connect.facebook.net/zh_TW/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
} ());
function facebook_signup() {
FB.login(function(response) {
if (response.session) {
FB.api("me", function(response) {
$.ajax({
type: "POST",
url: "Action.ashx?time=" + Math.random(),
data: "id=" + response["id"] + "&first_name=" + response["first_name"] + "&last_name=" + response["last_name"] + "",
success: function(msg) {
if (msg == "Hello") {

alert(msg);
} else {

alert(msg);
}
}
});
});
} else {
alert("失败");
}
});
}
</script>
</body>
</html>

源博客资料:http://www.cnblogs.com/zsz417/archive/2011/08/19/2146001.html

posted on 2011-11-30 15:40  Sampson  阅读(3283)  评论(1编辑  收藏  举报