這裡將會紀錄如何建立一個Facebook App,並且讓User授權應用程式,最後取得FB ID來當會員資料或是參加活動的ID識別

首先,你必須是個Facebook App Developers,你可以去facebook DEVELOPER申請你的身份,我記得以前不用手機驗證,但現在則需要

接著你會看到以下畫面

點選右上角的Create New App

會跳出一個POP視窗

App Name:指的是你的應用程式名稱

App Namespace:是你的網址命名

Web Hosting:如果你有自己的Web Hosting就不用勾選

按下Continue以後會出現填寫驗證碼,填寫完後按下Submit

然後就會看到建立好的App一些資訊和設定

因為雖然是寫Facebook App,但其實Facebook只是提供你API和外框包住你的網頁,所以你還要提供你的網頁所在位置給Facebook

要注意的是Facebook要求使用加密的https,所以如果你如果沒有的話,可能要花錢購買這方面的憑證

到這邊為止,已經建立好初步的Facebook App了

使用JavaScript API做授權

有了App以後,我們要跟網頁串起來,因為我是.NET開發者,所以我會先建立一個index.aspx,接著一般我都會在<form id="form1" runat="server"></form>的後面加上

<div id="fb-root"></div>
<script type="text/javascript" src="https://connect.facebook.net/zh_TW/all.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

注意,如果沒有fb-root的div會導致不能使用Facebook API,另外我還多用了Jquery來方便等一下寫js程式碼

接下來新增一個div做為點選授權

 <div id="btn">點我授權</div>

接著是js初始化部分

$(function () {var _app_id = 'Your App ID';var _api_key = '';//驗證FB.init({appId: _app_id,status: true, // check login statuscookie: true, // enable cookies to allow the server to access the sessionxfbml: true, // parse XFBMLoauth: true // enable OAuth 2.0});FB.Canvas.setAutoGrow(); //autoResize  → no scrollbar});

Your App ID必須填入你建立好的Facebook App裡面的App ID ,接著加上點擊觸發授權的js部分

    $('#btn').click(function () {getLoaginState();});//驗證function getLoaginState() {FB.getLoginStatus(function (response) {if (response.authResponse) {var u_fb_id = response.authResponse.userID;console.log(u_fb_id);} else {login();}});}//跳出登入視窗function login() {FB.login(function (response) {if (response.authResponse) {var u_fb_id = response.authResponse.userID;console.log(u_fb_id);} else {alert('須同意應用程式');}});}

這段js是綁定一個click事件,在id為btn的div上,然後去執行getLoaginState(),FB.getLoginStatus是看登入狀態,沒有登入則會跳到login(),console是等下能看到我們所取得的FB ID

接著在剛剛App設定網址那邊有個Canvas Page,那就是你掛在Facebook底下的網址,後面的網址名稱就是你剛剛設定的App Namespace,進入以後會看到以下畫面

按下點我授權,就會跳出授權是否同意應用程式視窗

同意以後,就可以在firebug裡面看到我們剛剛所加的console,秀出你的FB ID

得到FB ID可以利用Graph API再更進一步取得許多資料,當然也要先授權相關權限才行

以上如有問題,歡迎一起討論

原文:http://blog.rx836.tw/blog/facebook-app-create-getfbid/

[Facebook] 如何建立facebook App 且取得FB ID相关推荐

  1. facebook 分享页面_如何建立Facebook页面

    facebook 分享页面 Facebook Pages are a great way to promote your business, a cause, or just your hobby. ...

  2. Facebook Shop和Facebook Marketplace如何选择?

    Facebook Shop和Facebook Marketplace都是可以让facebook用户售卖商品的平台,这两者有什么区别?在facebook上开网店要使用那一个平台更好?又要如何开通使用?这 ...

  3. kurento教程_如何使用WebRTC和Kurento媒体服务器,来建立视频会议App(一)

    原文标题:[TUTORIAL] ​How ​to ​Build ​a ​Video Conference ​Application ​with WebRTC ​& ​Kurento ​Medi ...

  4. 微信 openid = hash(uid + app_id) 也就是说,对每个app可以做到用户id唯一

    转自:http://segmentfault.com/q/1010000002403358 你可以简单的理解为 openid = hash(uid + app_id) 也就是说,对每个app可以做到用 ...

  5. android 获取控件 id 工具,如何使用appium desktop 获取Android APP 控件的id

    背景: 随着Android 版本的更新,你会发现我们之前用的最新的版本的Appium 1.5.3无法启动我们的 Android APP 在模拟器为7.0的设备上,所以我们有必要了解如何使用 appiu ...

  6. Android-Dex分包最全总结:含Facebook解决方案,移动app开发

    65536 trouble writing output: Too many method references: 70048; max is 65536. 或者 UNEXPECTED TOP-LEV ...

  7. 迎战Snapchat,Facebook最新推出Slingshot App!

    近期Facebook持续更新企业动态,例如,上个月Facebook认知到Camera.Poke两大App已经无法再吸引使用者,因而从App Store快速下架,也传出,Facebook正积极研发一款类 ...

  8. 利用百度云平台建立Web App

    今天试了下百度云开发平台,使用php建立一个简单的web服务. 基本上参考这个文章<在百度云平台上构建Web App>. 另外发现了一些可能对个人来讲更有意思的功能,你的Web App发布 ...

  9. 安卓获取APP对应的Android id的原理分析

    android_id 的生成原理是由系统生成的随机数,并与应用 app 签名,经过 HmacSHA256 算法生成的: 从 android 8 以后开始就是随机的了,每个应用获取到的简要步骤: 获取的 ...

最新文章

  1. Linux平台下QtCreator集成代码静态分析工具clang-tidy和Clazy
  2. 117.滑动窗口协议
  3. 13. sizeof 和 strlen 的区别
  4. Dart 异步编程之 Isolate 和事件循环
  5. 数据结构 (计算机存储、组织数据方式)
  6. 求素数为什么到平方根就行了
  7. mysql 自动备份删除_mysql自动备份删除5天前的备份
  8. 解决为什么JDK要带着JRE一起下载
  9. Rust 中的继承与代码复用
  10. VMware vSphere 性能优化设计经验+优化方法 | 周末送资料
  11. 本页不但包含安全的内容,也包含不安全的内容
  12. input file 上传图片判断图片的宽高尺寸
  13. TCP/IP模型及OSI七层参考模型各层的功能和主要协议
  14. WebResponse 跨域访问
  15. 《WINDOWS黑客编程技术详解》勘误收集及软件下载
  16. python,文件md5校验
  17. 新型计算机离我们还有多远
  18. katana材质的制作-1
  19. Android2017Google IO
  20. php实现简单的留言板

热门文章

  1. android 技术2016,2016安卓模拟器技术更成熟 优秀产品脱颖而出
  2. 视频教程-Ruby on Rails打造企业级RESTful API项目实战我的云音乐-Ruby/Rails
  3. js获取所在城市及IP
  4. 面对海量内容,如何快速完成视频内容审核?
  5. 大灯照出来的光有阴影_揭秘为什么车灯改装换了氙气灯泡或LED大灯会有黑影
  6. 中集飞瞳全球领先集装箱AI助力集装箱物流企业提效降本智能化,助力船公司智能化,智慧港口码头智能化,智慧铁路智能化,智慧海关智能化
  7. 医院系统的服务器,医院管理系统云服务器
  8. 刷题笔记:千奇百怪的排序算法
  9. 光盘/硬盘存储寿命时间
  10. opengl使用compute shader的生成纹理,解决残影的问题