内容


掌握 Facebook 应用程序开发,使用 PHP、Rational Application Developer、WebSphere Application Server 和 DB2 进行实现,第 1 部分

安装设置组件

Comments

系列内容:

此内容是该系列 # 部分中的第 # 部分: 掌握 Facebook 应用程序开发,使用 PHP、Rational Application Developer、WebSphere Application Server 和 DB2 进行实现,第 1 部分

敬请期待该系列的后续内容。

此内容是该系列的一部分:掌握 Facebook 应用程序开发,使用 PHP、Rational Application Developer、WebSphere Application Server 和 DB2 进行实现,第 1 部分

敬请期待该系列的后续内容。

在您开始之前

本教程面向那些使用 PHP、Java 语言、Javascript、HTML/CSS、以及一种关系数据库进行网站开发,并且具备一定经验的开发人员。他们希望更近一步地了解初露端倪的 Facebook 应用程序的开发。您将学习到 Facebook 本身、它为应用程序所提供的各种不同的结合点、Facebook 社您的应用程序是如何相互沟通的、以及如何使用 Facebook 的应用程序接口开发有用的和交互式的行为。

关于本系列

本系列教程将使您能够在一个已有的 Java 企业最上层开发您自己的 Facebook 应用程序:

  • 在第 1 部分中,您将概览一个 Facebook 应用程序的开发,并将从一个应用程序骨架开始。
  • 在第 2 部分中,您将使用 PHP 和 Java 开发一个 Facebook 应用程序,建立起在第 1 部分中创建的基础。

关于本教程

在本教程中,您将开始建立一个 Facebook 应用程序,其应用场景是一家股票经纪公司,它允许用户通过 Facebook 管理他们的投资。为了使应用程序真正做到社会化,而不仅仅是内嵌在 Facebook 之中,您还将提供用户之间投资竞争游戏这一选项。

为了给出一个更加真实的技术场景,您将假设部分应用程序已经用 Java 语言编写完成,并且您将运用 PHP 和 Java 语言添加 Facebook 应用程序。您将执行某些用 Java 语言编写的应用程序,使用 IBM Rational® 应用程序开发器 Java 环境、将 WebSphere® 作为您的 J2EE 应用程序服务器、并且将 Facebook 的 Java 客户机程序库用于 WebSphere 和 Facebook 之间的通讯。

您还将执行某些用 PHP 语言编写的应用程序,使用 Zend Core 引擎及其捆绑安装的 Apache 2 为页面提供服务,并且将 Facebook 的 PHP 客户机程序库用于同 Facebook 之间的通讯。这将为您提供使用 Java 和 PHP 语言的经验,从而您能够根据实际需要在这两者之间做出适当的选择。

系统要求

为了完成本教程中的相应步骤,您需要安装下列软件。如果您尚未安装,或者不具备其最新版本,那么请您下载相应的试用版本:

介绍 Facebook

在这一小节中,您将在安装组件和进行应用程序开发之前,首先了解到 Facebook 的基本情况。

什么是 Facebook?

到目前为止,很少有用户孤悬于网络之外了。您可以同全球各地的服务器相连接,并且获取大量的信息。但是,您在网上直接同其他人进行交流的程度还不够。类似 Facebook 这样的社交网站 —— 当前最受欢迎的同类网站 —— 改变了这一切。它允许用户为自己创建在线简介,并且轻易地再现他们现有的朋友圈。这为人与人之间的沟通创建了一种全新的模式。为了使这种交互作用更加社会化,内嵌在交友网站中的应用程序提供了各自的沟通方式。由于用户将越来越多的时间花费在类似 Facebook 这样的社交网站上,这些站点已经具备了成为一种新的运行系统的潜力。

Facebook 的两幅面孔

Facebook 有两副面孔:它既是一个朋友圈,也是一个同网络进行交互的平台。几乎 Facebook 的所有功能都是基于这种简单而统一的设计 —— Facebook 的大部分默认功能,例如管理相册和群的能力,都是 Facebook 应用程序。Facebook 的各种不同的应用程序接口(API)也暴露了许多基本应用程序的功能和数据,例如用户的朋友和相册列表等,并且由此提供了大量开发您自己的应用程序的入口。

当您第一次登录您的 Facebook 账号时,您将看到您的主页,如图 1 中所示。

图 1. 您的 Facebook 主页
Your Facebook homepage
Your Facebook homepage

最左侧的一栏中包括一个搜索框,以及到您所安装的全部应用程序的链接等。同顶部的定位栏一起,最左侧的一栏为您在 Facebook 中所查看的所有页面建立了框架。

主页本身的内容紧靠定位栏,并且被划分为两个专栏。左侧的专栏包含您的 News Feed,也就是一系列的博客条目,用来通报您的朋友们在他们各自的应用程序中所进行的活动。

简介页面

主页是每个用户查看自己网络的地方。通过点击位于顶部的导航栏,可以进入用户简介页面(如图 2 中所示)。

图 2. 简介页面
The profile page
The profile page

简介页面也被分割为两个专栏,我们分别将其称之为“窄栏”和“宽栏”,它们都包含已安装的 Facebook 和已安装的用户应用程序。同样令应用程序开发人员感兴趣的是照片正下方所呈现的一组 Profile Actions,通过应用程序放在那里,已安装的应用程序的图表出现在下面,每一个都将简介页面滚动到应用程序的框中,并且 Mini-Feed 应用程序显示了 News Feed 中所显示的条目的超集。

至此,您已经了解到 Facebook 的主要方面,现在我们安装所需要的各种工具。

安装组件

您的目标就是建模一个完全真实的状况,一个先有的 Java 企业希望将一个 Facebook 应用程序应用到 PHP 中。为了实现这一操作,我们需要建立您所需要的组件 —— Rational Application Developer、WebSphere Application Server 、Zend Core(包括一个绑定的 Apache)、以及 DB2 等。

Rational Application Developer、WebSphere Application Server 、Zend Core 以及 DB2

Rational Application Developer 是用于 Eclipse IDE 的 Java 开发环境,它同 WebSphere Application Server 结合在一起使用。WebSphere Application Server 是 IBM 的 J2EE 应用程序服务器,它使您能够创建处强大的、安全的和易于维护的基于 Java 的和基于 JSP 的应用程序。Zend Core 是一个世界标准的 PHP 引擎,它包括一个绑定的 Apache 2 网络服务器。DB2 是 IBM 的 产品级 SQL 数据库,并且其 DB2 Express-C 版本是完全免费的。所有这些工具组合在一起,构成了一个坚实的开发平台。在本教程中,您将在 Windows 平台上安装这些组件,但其实它们同样可以应用在 Linux® 环境中。

为 Java 开发环境装备 Rational Application Developer 和 WebSphere Application Server

首先,安装 Rational Application Developer 和 WebSphere Application Server ,建立 Java 方面的开发环境。第一步,使用 IBM 安装管理器(请参见 参考资源 一节)下载 Rational Application Developer。下载和安装过程十分直接,但是将花费一定的时间,这取决于您的网络连接速度。

对于本教程来说,服务器简介被命名为 JakeAppServer。定位到 IBM WebSphere > Application Server 6.1 > Profiles > JakeAppServer。一个命令提示行窗口将被打开,并且在服务器安装完成后被关闭。您可以通过打开管理控制台(在浏览器中打开)来核实服务器是否正在运行。

图 3. 管理控制台
The administrative console
The administrative console

现在,您已经建立了 WebSphere Application Server ,下面我们转到 PHP 这一边。

为 PHP 和 DB2 开发建立 Zend Core For IBM

至此,您也已经建立好 Zend Core,从而将 PHP 引入进来。请您下载 Zend Core for IBM(请参见 参考资源 一节)。您将使用同 DB2 Express-C 相绑定的 Zend Core for IBM 版本,从而简化安装过程(请参见图 4 中所示)。

  1. 如果您尚没有注册一个 Zend 帐户,那么您需要在下载之前首先创建一个。
    图 4. 选择需要安装的 Zend Core 版本
    选择需要安装的 Zend Core 版本
    选择需要安装的 Zend Core 版本
  2. 打开 InstallShield 向导,选择 IBM DB2Express-C 单选按钮。
  3. 出于简单起见,使用 Zend Core 自带的 Apache 2 网络服务器。请确保选择 Install bundled Apache 2.2.2 选项。
  4. Zend Core For IBM 安装操作同时也安装了 DB2。此时,您将收到是否马上重启计算机的提示(请参见图 5 中所示)。
    图 5. Zend Core 安装进程提示 DB2 的相关操作和计算机的重启
    Zend Core 安装进程提示 DB2 的相关操作和计算机的重启
    Zend Core 安装进程提示 DB2 的相关操作和计算机的重启
  5. 当为本地用户帐户创建密码时,安装进程只接受包含字母和数字的密码(例如 password123),但是并没有明确标明这一要求(请参见图 6 中所示)。
    图 6. DB2 本地用户帐户的设置
    DB2 本地用户帐户的设置
    DB2 本地用户帐户的设置

    您还可以指定 DB2 实例不随系统的启动而自动开启,从而您可以更加自主的对其进行控制,但是这仅是一种个人偏好。
  6. 点击 Create profile 允许安装进程创建 First Steps 简介来避免 Javascript 在浏览器中的警告信息(请参见图 7 中所示)。
    图 7. 创建 DB2 First Steps 浏览器简介
    Creating DB2 First Steps browser profile
    Creating DB2 First Steps browser profile

最终地,您将回到 Zend Core For IBM 安装器上来(从 DB2 安装器绕了一圈),并且应当在继续之前重启您的计算机。

现在,您拥有了 DB2、Zend Core 及其绑定的 Apache 网络服务器、Rational Application Developer、以及 WebSphere。下面,我们通过设计一个应用程序来探索 Facebook。

设计一个 Facebook 应用程序

理想情况下,您希望设计一个用户认为十分好用或者充满乐趣的应用程序。它使得用户能够通过 Facebook 网络同他们的朋友进行沟通。您不能保证一个成功的应用程序(这依赖于应用程序的核心概念),但是您可以保证如果这个概念是成功的,那么您的应用程序可以被很好地集成到 Facebook 平台之中,并且通过市场和虚拟的口口相传不断提升。所以,您可以从以下角度来看待问题:如何创建一个能够大幅提高用户连通性的应用程序,并且通过 Facebook 的集成点扩大您的用户基础,并且鼓励用户随时随地的同您的应用程序进行交互。

剖析一个 Facebook 应用程序

Facebook 为您的应用程序提供了许多集成点:其中两个主要的区域分别被称作应用程序的画布页面和剖面盒,除此之外,还有大量的辅助集成点。

画布页面

您通过这些辅助点的最突出的和无所不在的 Left Nav 访问一个应用程序的画布页面。Left Nav 是 Facebook 的左侧导航栏中的一个链接,它将 Facebook 中的所有其他的页面整合起来,并且列出了所有的当前用户已安装的应用程序(除非用户在安装应用程序时去掉了这一选项)。举例来说,您可以点击相册应用程序的 Left Nav 链接(请参见图 8 中所示)。

图 8. 左侧定位链接
Left Nav link

进入相册应用程序的画布页面,显示一个关于您的朋友们的最近更新的摘要,他们同样是使用相册应用程序进行创建的(请参见图 9 中所示)。

图 9. 相册画布页面
相册画布页面
相册画布页面

此处,您可以点击其中一个朋友的相册,但是依然位于相册画布页面之内(请参见图 10 中所示)。

图 10. 在相册画布页面内部查看特定的相册
在相册画布页面内部查看特定的相册
在相册画布页面内部查看特定的相册

剖面盒

应用程序的剖面盒位于用户的剖面页面上的窗口小部件,通常显示有关在该应用程序中用户活动的信息摘要。在相册应用程序的例子中,您可以看到用户最新的相册(请参见图 11 中所示)。

图 11. 相册应用程序的剖面盒
相册应用程序的剖面盒
相册应用程序的剖面盒

剖面行为链接

剖面行动链接使得一个应用程序可以发布到一个用户的剖面上,并且显示在用户相册的正下方。您的剖面行动链接将根据应用程序的用户或者一位访问者是否在查看剖面而做出不同的反应。

举例来说,此处相册应用程序将一个 View Photos of Me 行为链接发布在我的剖面中(请参见图 12 中所示)。

图 12. 相册应用程序剖面行动链接
相册应用程序剖面行动链接

点击,您将进入应用程序的画布页面,并且显示我的相册(请参见图 13 中所示)。

图 13. 点击相册应用程序剖面行动链接的结果
点击相册应用程序剖面行动链接的结果
点击相册应用程序剖面行动链接的结果

请求

一个应用程序的画布页面和剖面盒使得用户可以表达自己,而且还使得用户能够在彼此之间进行通讯,这通常是通过请求来实现的。一位用户可以向另一位用户发出一个请求,其中的内容可以是在好友应用程序中请求一个好友确认,或者在事件应用程序中邀请一位朋友参与这一事件。一位用户的未决请求将出现在他们的主页面的右上方(请参见图 14 中所示)。

图 14. 主页上的未决请求摘要
主页上的未决请求摘要

用户可以通过点击显示的任何一个请求,查看请求的完整列表(请参见图 15 中所示)。

图 15. 用户的请求页面
用户的请求页面
用户的请求页面

请求往往自己要求添加到应用程序之中,或者要求被请求的用户添加应用程序以完成该请求,这正是一个 Facebook 应用程序的口口相传行销的一部分(请参见图 16 中所示)。

图 16. 添加应用程序的请求
添加应用程序的请求
添加应用程序的请求

要求用户活动性的应用程序,例如游戏,可能会利用请求使用户得以一起玩耍。在这方面一个最常见的和最基础的例子就是好友请求,用户识别 Facebook 上的好友并且请求确认消息,进一步地内部连接社交图表,并且授权所有其他应用程序的用户活动性。

当请求允许用户明确地互相邀请以便在一个应用程序内部进行交互的时候,News Feed、Mini Feed、Message Attachments(信息附加)、Emails(电子邮件)、以及 Notifications(通告)也在暗中进行这一操作,并且帮助您的应用程序在用户的头脑中留下印象。

News Feed 和 Mini-Feed

News Feed 是出现在用户的主页面上的一个应用程序,它显示由用户的以及用户好友的应用程序所发布的新条目,通常响应应用程序内部某些用户的行动(请参见图 17 中所示)。

图 17. News Feed
The News Feed

应用程序往往宣布 News Feed 条目以响应一个被接受的请求,举例来说,一位用户从好友应用程序中接收一个“好友确认”的请求(请参见图 18 中所示)。

图 18. 朋友证实 News Feed 条目
朋友证实 News Feed 条目
朋友证实 News Feed 条目

News Feed 本质上是在用户的应用程序内部,用户之间进行交互的一个公共博客,并且通过朋友网络营造了一种轻松愉快的气氛。它吸引好友进入进来,并且安装应用程序本身。

Mini-Feed 位于用户剖面上面,它类似于 News Feed,但是只显示应用程序中关于用户的行动,而不显示他们的好友的相关信息。同样地,用户可以从中移除条目。应用程序可以将条目发布到一个特定用户的 Mini Feed 上面,或者同事发布到 Mini Feed 和 News Feed 上面(请参见图 19 中所示)。

图 19. Mini Feed
The Mini Feed
The Mini Feed

信息附加

信息附加使得用户能够轻易地将他们的应用程序内容同好友们分享。应用程序拥有一段 FBML 片段,当用户向另一个用户的 Facebook 收件箱中发送消息的时候,这段代码将被包含在信息附加之中(请参见图 20 中所示)。

图 20. 消息形式的信息附加
消息形式的信息附加
消息形式的信息附加

当用户向另一位用户的 Wall (剖面页面上的一个应用程序)中发布通知的时候,他还可以包括您的应用程序的信息附加(请参见图 21 中所示)。

图 21. Wall 邮件形式的信息附加
 Wall 邮件形式的信息附加
Wall 邮件形式的信息附加

通告和电子邮件

应用程序能够发送用户通告,它出现在用户的通告页面上面(请参见图 22 中所示)。

图 22. 通告页面
通告页面
通告页面

这些行的条目只对那些接收通告的用户可见,并且从 News Feed 和 Mini Feed 故事中分开。

对于非公共的通告(也就是从一个应用程序直接发送到一位用户的私有通讯)来说,一个应用程序能够向用户或者其好友发送电子邮件,用户可以将接收邮箱设置为外部邮箱账号(而非 Facebook 账号)。

一个应用程序的电子邮件、News Feed 行动、通告、以及消息/Wall 附加,促成了用户和应用程序之间的交互,触发了更多这样的事件,并由此 Facebook 网络内部的应用程序的广泛传播。

产品目录

这些口口相传的集成点提升了应用程序,并且使之在用户的头脑中保持活动性。除此之外,用户还可以通过每张屏幕左上角的搜索框,明确地找到要添加的应用程序(请参见图 23 中所示)。

图 23. 寻找应用程序
寻找应用程序
寻找应用程序

用户还可以通过点击 Applications 链接浏览应用程序,该链接位于左侧导航栏中的搜索框正下方(请参见图 24 中所示)。

图 24. Applications 链接
Applications 链接

点击 Applications 链接,打开 Applications 应用程序的画布页面(请参见图 25 中所示)。

图 25. Applications 应用程序的画布页面
The Applications appplication's canvas page
The Applications appplication's canvas page

您可以管理当前安装的应用程序,并且浏览新的应用程序。点击 Browse more applications 打开另一个集成点:产品目录(请参见图 26 中所示)。

图 26. 产品目录
产品目录
产品目录

您的应用程序将同其他的应用程序展开关注度的竞争。产品目录的前三个标签十分有用。Recently Popular(最近流行)、Most Activity(最活跃)、以及 Most Active Users(最活跃用户)反映了应用程序受欢迎的程度,意味着口口相传的营销装置(请求、News Feed、电子邮件、以及消息/Wall 附加),并且即使当用户明确地在产品目录中寻找新的应用程序的时候,用户交互作用的传播能力也是极为重要的。应用程序的第一位用户可以在 Newest(最新)标签中找到它,在那里您可以看到最新发布的应用程序。这些应用程序正努力从那里起步,通过社交图表逐步将自己提升为一个热门程序。

关于页面

如果产品目录中的一个应用程序吸引了用户的眼球,点击其链接后,将会转到它的关于页面(请参见图 27 中所示)。在这里,用户可以获得关于应用程序的更多信息,并且决定将该应用程序添加到他们的剖面中还是 Facebook 的另一个页面中。

图 27. 一个应用程序的关于页面
An application's About page
An application's About page

私有设置

最后,用户可以通过 Applications 应用程序在他们的环境中限制一个应用程序的集成点,Applications 应用程序列出了所有已经安装的程序,允许您对其进行删除或者编辑操作。点击 Edit Settings 打开标准私有设置窗口(请参见图 28 所示)。

图 28. 标准私有设置对话框
标准私有设置对话框
标准私有设置对话框

这里是私有设置的详细信息:

  • 谁能看到这里:允许用户指定哪些人能够看到他们所安装的相册应用程序。选项包括:
    • 我的网络和朋友:用户网络(例如纽约)中的任何人,以及用户的所有朋友。
    • 朋友的朋友
    • 只有朋友可以
    • 没有人可以
    • 定制:在弹出的窗口中,允许用户自己设定哪些网络和哪些朋友可以或者不可以看到应用程序。
  • 在左手菜单中显示:决定这个应用程序是否在用户的应用程序安装列表中建立链接(在他们的左侧导航栏中)。
  • 在我的 News Feed 中发布相关的故事:决定应用程序是否能够将条目发布到用户的 News Feed 中(位于他们的主页面)。
  • 在我的 Mini-Feed 中发布相关的故事:决定应用程序是否能够将条目发布到用户的 Mini-Feed 中(位于剖面页面)。
  • 在剖面图片之下添加一个到任何剖面的链接:决定应用程序是否能够发布剖面行动链接。
  • 允许这一应用程序通过电子邮件同我保持联系:决定应用程序是否能够向用户发送电子邮件。请注意这涉及到用户的外部邮件账号;您的应用程序不能够向用户的 Facebook 收件箱发送电子邮件。

在完成这些标准私有设置之后,应用程序还会提供其定制配置窗口,您可以通过标准私有设置窗口中的 Other Privacy Settings 链接进行进一步的设置(请参见图 29 所示)。

图 29. 在标准私有设置对话框中的另一个私有设置链接
在标准私有设置对话框中的另一个私有设置链接
在标准私有设置对话框中的另一个私有设置链接

现在,您已经回顾了用于集成您的应用程序的可用点,下面我们看一下如何为这些不同的集成点创建您的应用程序的内容。

FBML

您需要提供 Facebook 可以嵌入到其页面中的内容,但是您不能像在您自己的网站上那样,使用直接的 HTML 和 Javascript。Facebook 需要确保内容不包含任何恶意的 Javascript,并且希望使应用程序尽可能简单地将 Facebook 环境中的信息包含在您的提交内容中。

Facebook 对于这一问题的解决方法就是 FBML(FaceBook 标记语言),一种当 Facebook 提交您的应用程序的内容是所使用的 XML 语言。您可以将 Facebook 认为是一个文本预处理器,就像 XSLT 或者 PHP,它将 FBML 内容转换为 HTML,代替不同的 Facebook 标签下关于用户或者环境的数据。为了取代失去的 Javascript 功能,Facebook 提供了 FBJS 语言(FaceBook JavaScript)。为了简化到 Facebook 数据库的复杂查询,并且减少所需的调用的数量,Facebook 提供了 FQL(FaceBook 查询语言,SQL 的一个变体)。图 30 中描绘了信息从您的应用程序服务器到用户浏览器的流程。

图 30. 从应用程序服务器到用户浏览器的信息通告的流程
flow of information
flow of information

大多数 FBML 标签在语法上同 THML 标签都是一致的,但是 FBML 还提供了许多行为标签,以及从 Facebook 数据库中提取信息并且包含在您的内容中的标签。您将在第 2 部分中对相关内容做进一步的研究。

至于 FBJS(Facebook Javascript),它仅仅是做出某些修改后的 Javascript。Facebook 从语法上对您常见的 Javascript 代码进行了分析,并且在传递到浏览器之前做出了一些改变。它同样对 DOM 进行了修改,对于访问和修改元素加入了限制。您将在第 2 部分中看到更多关于这种改变的详细内容。

Facebook 还通过一个 AJAX 对象提供了功能强大的 AJAX。所有的 AJAX 请求都通过 Facebook 的服务器被代理,从而使您能够将 FBML 代码作为一个 AJAX 请求的结果返回。Facebook 对于 FBML 代码的处理同它对其他代码的处理一样,在适当的位置(比如 <fb:name>)插入 Facebook 数据,并且您的 AJAX 调用被返回一个对象,该对象能够通过一个 DOM 元素的 setInnerFBML() 函数设置为该元素的“内部 FBML”。出于安全性的原因,Facebook 并不支持“内部 HTML”,但是一个 setInnerXHTML() 函数正在测试之中。

WebSphere Application Server 和 Facebook 的服务器之间的通讯

我们的应用程序运行在 WebSphere 之下,它必须同 Facebook 进行通讯,而且 Facebook 也必须同您的应用程序进行通讯。Facebook 同您的 PHP 脚本之间的通讯被限制在画布页面请求中,在那里用户可以进行某些活动。当用户进入您的应用程序的画布页面 URL 时(http://www.facebook.com/JakeTestApp),Facebook 代理这一请求到您的远程服务器 URL(http://myserver.url/FacebookTestApp/index.php),并且您的 index.php 返回 FBML。类似地,您的 FBJS 代码发出一个 AJAX 请求,它通过同样的代理并且向您的服务器发出请求。

您的应用程序还需要同 Facebook 进行通讯,在一个请求期间或者是提取信息或者是发送信息。它通过 Facebook 的 REST 接口完成这一操作,这是一个将 API 暴露为您可以通过不同的请求参数进行特定调用的 URL 的 HTTP 接口,并且返回 XML 或者 JSON。您无需担心这些 HTTP 调用或者返回数据的细节,这是因为 Facebook 提供了 PHP、Java 和 Javascript 客户机程序库 —— REST 接口周围的封套处理 HTTP 请求的建造,并且将返回数据整理为在客户机程序语言中可用的数据。

使用客户机程序库

客户机程序库提供了一个 Facebook 客户机 API 对象,它是一个将我们的方法调用转换为向 Facebook 服务器的请求的一个代理对象。举例来说,要获得当前用户的朋友,您只需要调用一个 Facebook 对象上的函数即可(请参见列表 1 中所示)。

列表 1. 通过 PHP 客户机程序库获得当前用户的朋友
 $friends = $facebook->friends_get();

我们还可以将信息发送到 Facebook 中(对信息进行升级)。举例来说,剖面盒同画布页面的工作方式是不同的(请参见 剖面盒画布页面 小节)。您并不是等待 Facebook 查询您的服务器以获得一位用户的剖面盒的内容,而是必须在希望改变时发出明确地内容。Facebook 随后将剖面盒内容存储在它的服务器上。这样做的意义在于,如果剖面盒内容不存储在 Facebook 上面,那么 Facebook 将在每次查看包含您的应用程序的用户剖面时访问您的服务器,并且用户将在访问其他用户的剖面时花费大量的时间。对于一个受欢迎的应用程序来说,这将导致大量的服务器负载,并且在加载剖面页面时加长等待时间。为了改变用户剖面上的您的应用程序的剖面盒的内容,您只需要再次调用由 PHP 客户端程序库所提供的 $facebook 对象上面的一个方法(请参见列表 2 中所示)。

列表 2. 在当前用户的剖面页面设置您的应用程序的剖面的内容
 $facebook->profile_setFBML ('New profile box content', $user);

每一次方法调用都向 Facebook 发出一个明确地请求。随着您的应用程序变得愈加复杂,您的 PHP 代码也必须向 Facebook 查询越来越复杂的数据,并且这些数据依赖于先前功能调用的结果。举例来说,您可能希望取得当前用户相册中的所有人的名字,这需要您首先调用 Facebook 请求所有的用户相册,然后请求那些相册中的相片,然后请求那些相片中的相片标签,然后请求相片标签的用户 —— 大量的工作、大量的 Facebook 服务器请求、以及大量的 PHP 代码。

FQL

此外,您可以使用单一的 FQL 查询(Facebook 查询语言),它是 Facebook 提供的一种 SQL 的变体,用来直接查询数据库和核心应用程序的数据。FQL 只允许在 from 子句中出现一个数据表,但是允许在 select 和 where 子句中使用子查询,所以下面的 FQL 查询所得到的结果同上面所描述的一致(标签用户的名字),但是在一个单一的查询中,我们的代码将会更加简明和易于读写(请参见列表 3 中所示)。

列表 3. FQL 示例 —— 选择一个用户相册中的所有标签用户的名字
				 select first_name from user 
where uid in 
(select subject from photo_tag where pid in
    (select pid from photo where aid in
        (select aid from album where owner = 563830447)))

在列表 3 中,563830447 是作者的 Facebook 号码。这一 FQL 请求将返回一个 XML,并且作为 Facebook REST 响应的一个实例(请参见列表 4 中所示)。

列表 4. FQL 查询响应
<?xml version="1.0" encoding="UTF-8"?>
<fql_query_response xmlns="http://api.facebook.com/1.0/" 
     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" list="true">
<user>
            <first_name>Jake</first_name>
      </user>
</fql_query_response>

您可以对此进行检验,并且通过 FBML 片段进行实验。使用的工具是 Facebook 的开发器测试控制台:http://developers.facebook.com/tools.php?api (请参见图 31 所示)。

图 31. Facebook API 测试控制台
The Facebook API test console
The Facebook API test console

使用 FBML、FBJS、FQL 和 Facebook 客户机程序库,您可以开发出一个能够很好地被集成到环境之中,并且能够提供强大功能的应用程序。现在,我们可以开始创建我们的应用程序了。

启动 Facebook 应用程序的开发

要启动应用程序的开发,首先要告诉 Facebook 服务器有关您的应用程序的信息,设置必要的配置选项,在 DB2 中创建一些数据表,然后完成一个小型的应用程序的原型来确认其是否能在 Facebook 中被正确的安装。

告诉 Facebook 服务器有关您的应用程序的信息

如果您尚未拥有一个 Facebook 账号,那么请首先在 http://www.facebook.com 上面创建一个。Facebook 将向您的邮箱中发送一封确认邮件,请您点击邮件中的链接以完成注册过程。

接下来,将 Facebook 开发器应用程序添加到您的帐户中,从而您可以对您的 Facebook 应用程序进行添加和管理操作。当您登录您的 Facebook 账号时,进入 http://www.facebook.com/developers,请参见图 32 中所示。

图 32. 添加开发器应用程序
添加开发器应用程序
添加开发器应用程序

保持默认设置,并且点击 Add Developer。您已经准备好开发您的第一个应用程序(请参见图 33 中所示)。

图 33. 开发器应用程序
开发器应用程序
开发器应用程序

对于未来的应用程序来说,您可以通过安装在应用程序列表中的 Left Nav 链接进入开发器应用程序的画布页面。要添加一个应用程序,请点击 Apply,申请一个应用程序钥匙,并且启动配置操作(请参见图 34 中所示)。

图 34. 创建一个新的应用程序
创建一个新的应用程序
创建一个新的应用程序

尽管您只需要为应用程序提供一个名称,并且接受 Facebook 平台的术语,但是如果没有 Optional Fields 下(请参见图 35 中所示)所提供的信息,您的应用程序也将毫无用处。请记住,您可以在第一次保存这些设置之后,随时对其进行编辑和修改。所以,现在您只需要填入一些必要的信息即可。在第 2 部分中,当您开发应用程序时,您将再次返回这一设置页面。

图 35. 应用程序配置 —— 可选区域
应用程序配置—— 可选区域
应用程序配置—— 可选区域
  • Developer Contact E-mailUser Support E-mail:包含您的 Facebook 登陆邮箱;其作用是,第一、如果您的应用程序出现问题,Facebook 将如何同您取得联系;第二、广大用户如何通过您的应用程序的帮助页面同您取得联系。
  • Canvas Page URL:在 Facebook 上面的您的应用程序的画布页面的 URL,亦即 http://apps.facebook.com/MyUniquelyNamedApp。这个 URL 必须是唯一的,当您键入足够多的字符时,Javascript 指示器将告知您所键入的 URL 是否可用,从而使您无须在应用程序目录中事先搜索,就可以确保 URL 的唯一性(请参见图 36 中所示)。
    图 36. 输入一个唯一的画布页面 URL
    输入一个唯一的画布页面 UR
    输入一个唯一的画布页面 UR
  • Callback Url:它实际上是位于远程服务器上面的应用程序 URL。在我们的例子中,亦即在您的 Apache 2 服务器上面运行的 PHP 脚本的 URL,它负责输出画布页面区域的内容,也就是 http://someserver.com/facebook_app/index.php。

    画布页面 URL 和回调 URL 的联合作用,使得用户能够从他们的浏览器中访问画布页面 URL,从而查看您的应用程序的画布页面,并且 Facebook 通过调用您的远程 PHP 脚本填充该画布区域。Facebook 从不将 Callback URL 暴露给除应用程序开发者以外的任何人。
  • Use FBML / Use iframe:告知 Facebook 您的画布页面回调 URL 是否返回 FBML(并随后由 Facebook 将其转化为 HTML)或者 HTML(由 Facebook 直接显示),作为画布区域的内容。
    由于 FBML 提供了一个 <fb:iframe> 标签,并且在翻译 FBML 内容的同时提供了许多种访问 Facebook 环境的功能,所以我们应尽量使用 FBML。如果您拥有一个现有的 HTML/Javascript 组件,并且您希望将其嵌入,那么您可以将其作为您的 FBML 画布页面中的一个 <fb:iframe> 的源。
  • Application Type:选择 Website 来制定被嵌入的应用程序,亦即直接在 Facebook 网站上被使用的应用程序。桌面指定了该应用程序是一个桌面应用程序或者同 Facebook 服务器进行通讯的浏览器扩展。举例来说,一个上传和下载 Facebook 相册的桌面应用程序。
  • IP Addresses of Servers Making Requests:对于附加的安全性来说,指定您的远程服务器的 IP 地址,以便只有您的服务器能够对您的 Facebook 应用程序做出请求(接收或者发送数据)。如果您的应用程序运行在多个 IP 地址上,您可以在这里将这些地址全部指定出来。
  • Can your application be added on Facebook?:点击 Yes。这使得用户(包括开发者)能够向他们的帐户中添加您的应用程序。指定 Developer Mode 来限制此时刻到开发器的访问。当开发器模式出于开发器状态时,指定其他能够访问该应用程序的开发器的名称。
  • Default Iframe Canvas Size Option:这一选项仅当您选择 FBML 的 iframe 单选按钮作为回调 URL 返回内容的类型时有效。就选择 iframe 来说,Facebook 并不仅仅是将内容输出到一个画布区域中的 HTML <iframe> 标签上,它使用 FBML 相当的 <fb:iframe> 标签,这个标签提供某些附加的定制功能,其中包括两个共有的高级布尔属性、Smart Size 和可调整大小性。Smart size 告诉 Facebook 调整 iframe 的大小以满足画布区域,而 可调整大小性 指定 iframe 的大小以便使其能够使用 Javascript API。由于您选择了 FBML,所以这一选项和您的应用程序无关。

安装选项和集成点

当被询问“能否将您的应用程序添加到 Facebook 上”时,选择“是”。出现两个选项区域:安装选项和集成点(请参见图 37 和图 38 中所示)。

图 37. 应用程序配置 —— 安装选项
应用程序配置 —— 安装选项
应用程序配置 —— 安装选项
  • Who can add your application to their Facebook account?:对于您的应用程序来说,选择 Users,指定那些能够将您的应用程序添加到他们的帐户中的用户。您还可以指定那些可以被添加到指定页面或者 Facebook 中页面类型的应用程序。
  • Application Description:放置您希望当用户添加应用程序时,出现在应用程序的添加页面上的任何文本信息。
  • Default FBML:这是最初呈现在用户的剖面页面上的 FBML,知道您的应用程序使用 PHP 客户机程序库升级它们的剖面为止(更多内容请参见本教程的第 2 部分)。此时,您只需放置一个占位符以便使这个原型应用程序运行起来。
  • Default Profile Box Column:选择 Narrow。指定您的应用程序将会出现在剖面页面的左侧的窄栏中,而不是右侧的宽栏中。
  • Developer Mode:只允许应用程序的开发者将其添加到他们的帐户之中。应用程序尚未发布到产品目录,所以任何用户都无法找到它,除非他们知道 URL 地址。

集成点部分供您指定用户环境内部的更多辅助集成点。此时,仅指定 Side Nav URL,它是出现在您的应用程序列表中的 URL 链接。请确保该 URL 同画布页面 URL 保持一致,并且都用小写字母的形式表示。画布页面 URL 是大小写相关的,即使您指定一个混合大小写的画布页面 URL,它也会将其全部转化为小写形式,所以请确保此处的字母全部是小写,以避免“页面无法找到”的错误发生。

图 38. 应用程序配置 —— 集成点
应用程序配置 —— 集成点
应用程序配置 —— 集成点

提交设置,您将看到一个摘要页面(请参见图 39 中所示)。

图 39. 应用程序设置摘要页面
应用程序设置摘要页面
应用程序设置摘要页面

要改变设置,请点击右侧的 Edit Settings

最后,测试设置情况。创建一个无内容的 index.php 文件以确认 Facebook 能够正确地通过回调 URL 代理取得您的内容。您可以通过 PHP 客户机程序库连接到 Facebook,并且该 Facebook 处理您的 FBML。在您的 Apache 2 服务器下创建一个文件夹以供您的应用程序使用 C:\Program Files\Zend\Apache2\htdocs\fb_stock_demo。然后,进入 http://developers.facebook.com/resources.php 并且以 tar.gz 的形式下载 PHP 客户机程序库(请参见图 40 中所示)。

图 40. 下载 PHP 客户机程序库
下载 PHP 客户机程序库
下载 PHP 客户机程序库

内部的 Facebook 平台目录包含一个客户机程序目录,其中包括 Facebook PHP 客户机程序代码。将这一客户机程序目录复制到刚刚创建的 Apache 2 下面的目录中,即创建 C:\Program Files\Zend\Apache2\htdocs\fb_stock_demo\client。

接下来,您将在 C:\Program Files\Zend\Apache2\htdocs\fb_stock_demo 下创建 index.php (请参见列表 5 中所示)。

列表 5: 用于画布页面的一个简单的 index.php
				<?php

// the facebook client library
include_once './client/facebook.php';

// the values on our application's settings summary page
$api_key = 'YOUR_API_KEY';
$secret  = 'YOUR_SECRET';

// connect to Facebook, require app installation
$facebook = new Facebook($api_key, $secret);
$facebook->require_frame();
$facebook->require_install();

// obtain the user's id
$user = $facebook->require_login();

?>

<div style="border: solid black 1px; padding: 25px;">
  <h2>Hi <fb:name firstnameonly="true" uid="<?=$user?>" 
                                             useyou="false"/>!</h2>
  <br/>
  Welcome to the Developer Works Stock Broker Demo.  Coming soon... 
</div>

第一行包括 Facebook PHP 客户机程序库。在您的应用程序摘要页面上设置 $api_key$secret 为 API Key 和 Secret 值。下一行连接到 Facebook,创建一个代理对象,您将使用该对象同 Facebook 的服务器进行通讯。使用这个代理对象,您要求查看您的应用程序的用户必须登录到应用程序,并且获得他们的用户号码,以便在 <fb:name> 标签下面使用。FBML 本身是纯的 HTML。<fb:name> 标签提供了 FBML 的体验 —— Facebook 将这个标签转换到查看该应用程序的用户的名字(这是由于您已经获得了那个用户的 ID 号)。这一标签提供了关于哪些文本将被实际执行的许多选项和功能。在我们的例子中,指定 useyou="false" 取代默认值,因为默认值是传递单词 you 而不是用户的名字。在我们的例子中,您希望通过名字来处理和问候您的访问者。

将这个 index.php 放置在 Apache 2 下的您的应用程序的文件夹中(C:\Program Files\Zend\Apache2\htdocs\fb_stock_demo),并且在浏览器中输入您的应用程序的画布页面 URL (例如:http://apps.facebook.com/devworksstockdemo/),请参见图 41 中所示。

图 41. 将您的应用程序添加到画布页面中
将您的应用程序添加到画布页面中
将您的应用程序添加到画布页面中

选中所有复选框,点击底部的添加按钮,您将到达您的剖面页面。向下滚动鼠标,您将看到您的应用程序的剖面盒,其中包含您所提供的默认的 FBML 代码(请参见图 42 中所示)。

图 42. 您的应用程序的剖面盒
您的应用程序的剖面盒

查看您的应用程序列表,您将看到您的应用程序已经被添加到 Left Nav 链接中(请参见图 42 中所示)。您还可以点击“更多”按钮,显示完整的应用程序列表。

图 43. 您的应用程序的 Left Nav 链接
您的应用程序的 Left Nav 链接

点击应用程序链接,好好欣赏您新创建的画布页面吧(请参见图 44 中所示)。

图 44. 您的应用程序的画布页面
您的应用程序的画布页面
您的应用程序的画布页面

虽然此时它的友好性大于可用性,但是您仍然可以运行这个只具备基本功能的 Facebook 应用程序。

建立 DB2 数据库

现在,您需要为您的应用程序定义数据库中的数据表,这正是本小节所要完成的工作。

定义数据表

股票行业拥有经纪人和股票,经纪人买入和卖出股票从而保持他们的每一只股票上的“地位”——他们拥有多少股票或者卖出了多少股票。“经纪业”前缀被放在所有数据表名称的前面;否则,它们将使用默认的图表。

使用 DB2 的命令行接口创建数据表。在命令行提示窗口中,键入 db2cmd 打开一个 DB2 命令行提示窗口。然后键入 db2start 启动一个 DB2 会话。DB2 将会输出:SQL2063N DB2START processing was successful。

接下来,创建一个数据库,取名为“stocks”:键入 db2 create database stocks,输出信息是 The CREATE DATABASE command completed successfully

键入 db2 connect to stocks 建立到数据库的连接。DB2 将输出 Database Connection Information,DB2 的版本、SQL 的认证号、以及数据库的别名“stocks”。

开始创建您的数据表(请参见 下载资源 中本节所使用的所有 sql)。首先,创建一个经纪人(trader)表,不添加任何条目,用于演示应用程序(请参见列表 6 中所示)。

列表 6. 在 DB2 中创建 trader 数据表
db2 create table trader ( 
id int not null primary key generated always as identity,  
username varchar(30) not null unique,  
password varchar(30) not null)

总是作为表示被产生是 DB2 7.1 以后版本的新特性,它提供了一个简单序列机制;您不再需要在向数据表中插入行时指定键码的值。

使用同样的技术,创建一个股票(stock)数据表,如列表 7 中所示。

列表 7. 在 DB2 中创建 stock 数据表
				  db2 create table stock ( 
    id int not null primary key generated always as identity, 
    ticker varchar(5) not null unique)

接下来创建储存数据、股票交易的主要部分的数据表。每一个交易都反映一次股票份额的购买或者出售,并且同一个经纪人和股票相关联。一次交易保存有交易数额(正值代表买入,负值代表卖出或者减持),以及交易时的股票价格。请注意 share_price 是一个整数值,这是因为您将 share_price 的单位设定为每份,从而避免浮点运算的错误(请参见列表 8 中所示)。

列表 8. 在 DB2 中创建 trade 数据表
  db2 create table trade ( 
    id int not null primary key generated always as identity, 
    trader_id int not null references trader(id) on delete cascade, 
    stock_id int not null references stock(id) on delete cascade, 
    shares int not null, 
    share_price int not null, 
    created_on timestamp not null)

出于演示的目的,当您需要一位经纪人持有某种股票的状况时,您将通过计算这位经纪人在这种股票上所进行的交易,从而得到结果。而不是采用另一种方法(比如用单独的数据表保存经纪人持有每一种股票的当前信息)。

最后,我们并不是将 facebook_user_id 直接添加到 trader 数据表中,而是使用一个单独的 facebook_user 数据表,这是因为您将向一个现有的股票经纪业的在线系统添加一个 Facebook 应用程序(请参见列表 9 中所示)。

列表 9. 在 DB2 中创建一个单独的 facebook_user 数据表
				     db2 create table facebook_user (
    facebook_user_id int not null primary key,
    trader_id int not null references trader(id) on delete cascade,
created_on timestamp not null)

只有当一位 Facebook 用户将您的应用程序添加到他的 Facebook 帐户的时候,您才插入一个 facebook_user 行。那时,他们登录到您的系统中,所以您能够在您的系统中将他们的 Facebook ID 号同现有的经纪人记录相关联。如果他们不存在于现有的经纪人记录中,那么请他们在您的系统上创建一个记录;Facebook 应用程序会提供这方面的帮助和提示。

注入示例信息

为了给您的应用程序提供一些数据,我们向数据表中注入少量的信息。首先创建几个经纪人(请参见列表 10 中所示)。

列表 10. 在数据库中创建几位经纪人
db2 insert into trader (username, password) values ('jake1', 'password1')
db2 insert into trader (username, password) values ('jake2', 'password2')

接下来,在数据库中创建几支股票(请参见列表 11 中所示)。

列表 11. 在数据库中创建几支股票
				        db2 insert into stock (ticker) values ('JAKE')
    db2 insert into stock (ticker) values ('NYC')
db2 insert into stock (ticker) values ('ABC')
db2 insert into stock (ticker) values ('USB')
db2 insert into stock (ticker) values ('UCLA')
db2 insert into stock (ticker) values ('KRZY')

然后,开始交易进程,分别以不同的价格购买 3 支股票各 100 份(请参见列表 12 和 13 中所示)。

列表 12. 为经纪人 “jake1” 创建了几次交易
db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 4400, current timestamp 
        from trader, stock 
        where trader.username = 'jake1' 
        and stock.ticker = 'JAKE'

db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 2300, current timestamp 
        from trader, stock 
        where trader.username = 'jake1' 
        and stock.ticker = 'NYC'

db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 6400, current timestamp 
        from trader, stock 
        where trader.username = 'jake1' 
        and stock.ticker = 'ABC'

列表 13 为经纪人 “jake2” 创建了几次交易。

列表 13. 为经纪人 “jake2” 创建了几次交易
db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 1200, current timestamp 
        from trader, stock 
        where trader.username = 'jake2' 
        and stock.ticker = 'USB'

db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 10200, current timestamp 
        from trader, stock 
        where trader.username = 'jake2' 
        and stock.ticker = 'UCLA'

db2 insert into trade (trader_id, stock_id, shares, share_price, created_on) 
             select trader.id, stock.id, 100, 5200, current timestamp 
        from trader, stock 
        where trader.username = 'jake2' 
        and stock.ticker = 'KRZY'

为了确认您已经全部建立完毕,执行几条查询语句。键入 select * from trader。DB2 将输出 2 record(s) selected

然后键入 select * from stock。DB2 将输出 6 record(s) selected

然后键入 select * from trade。DB2 将输出 6 record(s) selected。由于您并没有任何一个用于 facebook_user 数据表的数据,所以也就没办法确认它了。

此时,您已经成功安装完毕各种工具了,您的 Facebook 应用程序也已经运行起来,并且数据库准备就绪。我们将在第 2 部分中开始开发您的 Facebook 应用程序!

总结

Facebook 提供了丰富的用户资源以及结合点资源,您可以通过它们开发出一个交互式的、社会化的应用程序。使用 IBM 的 DB2 数据库、Rational Application Developer 环境、以及 WebSphere Application Server 作为 Java 工具,并且使用 Zend Core 作为 PHP 工具,您就可以根据自身企业的需要对这两种技术加以运用。此处,您获得了 Facebook 的直观感受、安装了各个组件、浏览了 Facebook 的集成点从而指导应用程序的开发、了解了 FBML、FBJS 和 FQL、并且使用 PHP 进行了初步开发。现在,您已经为进入第 2 部分的学习做好了准备。在第 2 部分中,您将使用所有这些技术深入研究并且开发应用程序。


下载资源


相关主题


评论

添加或订阅评论,请先登录注册

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=10
Zone=Rational, WebSphere, Information Management, Open source
ArticleID=319709
ArticleTitle=掌握 Facebook 应用程序开发,使用 PHP、Rational Application Developer、WebSphere Application Server 和 DB2 进行实现,第 1 部分: 安装设置组件
publish-date=07102008