使用 CodeIgniter 创建 Facebook 应用程序

集成 Facebook SDK

了解如何将 Facebook SDK 合并到 CodeIgniter 框架中,使用可用函数创建应用程序。

Thomas Myer, 负责人, Triple Dog Dare Media

author Thomas Myer 是居住在奥斯汀的一位顾问、作者兼演讲家。他作为 @myerman 在 Twitter 上运行 Triple Dog Dare Media 和 tweet。



2011 年 7 月 11 日

本文向您演示了如何让 Facebook 示例应用程序与 PHP 框架 - CodeIgniter 共同工作。虽然有许多有关 Facebook 开发的好文章,当然,也有一些有关使用 CodeIgniter 来构建应用程序的好文章,但是本文关注于 Facebook 可用的最新 PHP SDK。

本文不是向您显示如何利用 Facebook SDK 的现有开发库,您将了解如何自己轻松地包装 SDK,然后再以一种快捷的方式使用它。本文还向您显示了进行以下操作所需的所有步骤:在 Facebook 中注册您的应用程序,以及如何设置 CodeIgniter 与 Facebook 一起工作。本文涵盖了在此过程中您可能会遇到的基本内容。

由于本文涵盖了相当多的领域,所以几个先决条件将有助于您更好地理解本文的内容。首先,您需要了解有关 PHP 和 CodeIgniter 的知识。您无需了解很多,但是一定程度上的熟悉将有助于您开始。您还需要访问您自己的公开可用的 web 服务器。应用程序(例如您将要创建的应用程序)总是位于它们自己的服务器上,然后在 Facebook 内的 iframe 中提供服务:仅来自 localhost 的编码在这里不起作用。最后很重要的是,您需要一个 Facebook 帐户,因为您需要在 Facebook 中注册您的应用程序。

基础知识

在进入细节以前,简要介绍了 Facebook 应用程序和 CodeIgniter。

Facebook 应用程序基础知识

您可以构建不同种类的 Facebook 应用程序,包括移动和 web 应用程序 — 这是本文的重点。基本上,所有 Facebook 应用程序都包含一个运行在 Facebook.com 上并调用您的服务器上的代码的 iframe。

为与 Facebook 会话集成并使用正确的函数来访问各种功能(如列出您已经回复的朋友和事件),服务器中的代码需要遵循一些规则,但仅此而已。您可以将所有种类的功能添加到您的应用程序中,如将不同数据保存到数据库表,以便将值添加到 Facebook 体验中。

如果您做的正确,Facebook 用户将注册您的 Facebook 应用程序并告诉其他人该应用程序,这意味着您将需要考虑有关带宽的问题。每次您获得新用户或某人同您的应用程序交互时,Facebook 服务器会向您的服务器发出请求,所以请为此做出计划。

您可以在 Facebook 上构建什么种类的应用程序?请看一下 Facebook 开发人员展示(请参考 参考资料 获得链接),您将看到数以百计的真实应用程序,它们处于各种不同的类别 — 新闻、体育、社会公益活动、公用事业、评论、本地,等等。例如,Pandora 应用程序将流行的个性化音乐服务与 Facebook 集成在一起。Facebook 用户现在可以轻松地将他们的音乐发现与他们的朋友共享并进一步个性化他们的音乐享受。同样,IMDb Facebook 应用程序允许 Facebook 用户进一步与他们喜爱的电影、演员和导演接触以及直接与 Facebook 中的朋友共享他们的想法。

SimplyHired 应用程序将 Facebook 朋友网络和推荐功能与工作搜索引擎合并在一起以便获得自定义的工作推荐。TripAdvisor 应用程序允许 Facebook 用户 “喜欢” 住所和目的地,并将他们旅行经验的关键方面与他们的朋友分享。

在本文中,仅能讲述和基本应用程序开发相关的内容,但是如果您想成为一名 Facebook 应用程序开发人员,您将要很好地研究市场并看看那里有什么。

CodeIgniter 基础知识

CodeIgniter 是一个由 EllisLab 创建的 PHP 模型视图控制器 (MVC) 框架。在撰写本文时,它的版本是 1.7.2。虽然许多 MVC 框架都可用于 PHP(如 Symfony 和 CakePHP),但是区别 CodeIgniter 的主要不同之处是灵活性,源自于它的轻巧。

使用 CodeIgniter,就如同使用其他 MVC 框架一样,您要将您的代码划分为不同的功能区域:

  • 模型 包含与您的数据库和其他数据结构相关的任何及所有代码。如果您拥有一个称为 pages 的表,则您应该据有一个针对它的模型且该模型内的函数用于选择、创建、更新以及删除来自该表的记录。
  • 视图 包含所有显示和 UI 元素 — 您的 JavaScript 代码、CSS 文件、HTML 甚至 PHP。
  • 控制器 将所有内存放在一起。控制器中的每一个函数代表一个目的地或路径。如果您有一个名为 /about 的目的地,则您的控制器将有一个名为 about() 的函数。

如果您以前没有使用过 MVC 框架,则这三个要点提供了关于此组织模式背后的功能的一些信息。一旦您开始考虑 MVC 方面,那么您对 PHP 开发的观点和态度将发生根本性地改变。

例如,您要将这一切都组织到模型中,而不是在一切可用的位置存放数据库查询代码。要从您的数据库表中选择页面,您需要使用来自页面模型的函数。

同样,如果您需要更新某一页面的外观和感觉,则您要处理视图。使用控制器您就不会产生混乱。同样地,您在控制器中为应用程序添加的目的地和其他控制代码;您不在您的模型中放入这些数据。

与其他 MVC 框架不同,在 CodeIgniter 中,对于您的模型、表和控制器来说没有严格的命名约定。例如,您不必用复数形式 (pages) 命名表,也不必用单数形式 (page) 命名模型以便将两者关联在一起。您的数据库表也不必包含具有特定名称的特定字段:如果您没有名为 id 的主键字段,也不会有什么问题。

此外,您可以根据需要选择尽可能多地或尽可能少地使用框架来完成工作。通常情况下,您的应用程序将具有一系列控制器,所有的控制器都将从模型中提取数据,然后在视图中显示。不过在某些情况下,您的项目将只具有控制器和视图 — 如果您正在没有数据库后端的情况下构建静态 web 站点,这将是一个完美的解决方案。

另外一个有关 CodeIgniter 的令人感兴趣的事实是它与其他代码集成的容易程度如何。在大多数情况下,如果您想集成外部 SDK,只需通过特定的命名约定将其添加到插件(plugins )文件夹中(例如,在本文中您将 facebook.php 库文件重新命名为 facebook_pi.php),这样您就已经准备就绪了。


入门

让我们开始使用 CodeIgniter 编写您的第一个 Facebook 应用程序。这是一个需要一些安装设置的多步骤过程;在结束时,您将具有创建 Facebook 应用程序所需的一切。

要安装并配置 CodeIgniter,请执行以下步骤:

  1. 下载并安装 CodeIgniter(请参考 参考资料)。
  2. 打开 downloaded .zip 文件,并将内容解压缩到公开可用的 web 服务器。

    您可以将 CodeIgniter 部署到现有域的根、子域或现有域的根的某个文件夹。

  3. 在文本编辑器中打开 system/application/config/config.php 文件,更新 $config['base_url'] 变量以便其指向您安装 CodeIgniter 的位置。请确保将这些变更上传到服务器。
  4. 通过打开浏览器并查看存放 CodeIgniter 的 URL(例如,example.com/test 或 test.example.com)来测试 CodeIgniter。

    您应该看到一条常规消息,即 “欢迎使用 CodeIgniter!”,如果您们没有看到此消息,那么您一定是漏掉了一些步骤。请重新安装 CodeIgniter 并重新开始。

    运行此测试非常重要。因为您需要能够确认您的 CodeIgniter 基础代码正在正常地工作并隔离可能出现在 Facebook 与您的服务器之间的连接问题。

    注意:如果您在查看来自 CodeIgniter 的消息时遇到困难,这可能是因为您遇到了 DNS 问题 — 特别是如果这是一个新的域或子域。如果是这种情况,您可能需要花费些时间,才能进入到下一个步骤。

  5. 转到 Facebook.com/developers 并建立新的应用程序。

    如果这是您第一次这样做,请执行以下步骤:

    1. 单击 Allow 以便提供对应用程序的访问。
    2. 在 Developer 页面上,单击 Set Up New Application
    3. 在 Create Application 页面上,为您的应用程序输入一个名称(它可以是任何您想要的名称),选择 Agree,然后单击 Create Application,如 图 1 所示。
      图 1. 创建应用程序
      Facebook 中的“Create Application”屏幕,显示了“Application name”字段、用于同意或不同意条款的单选按钮以及“Create Application”按钮
    4. 在 Edit Application 页面上的 Basic 选项卡中,请注意应用程序 ID、API 密钥和秘密 — 这些对于每一个 Facebook 应用程序来说都是惟一的,且您将需要此信息来工作。
      图 2. Basic 选项卡
      Edit Application 页面的 Basic 选项卡的截屏
    5. 为您的应用程序键入一个描述,并添加图标、徽标和其他信息。(您也可以稍后再返回做这一步。)
    6. 单击 Canvas(画布) 选项卡,并输入画布页面 URL(也就是说,为了访问您的应用程序,人们将要访问的 Facebook.com 上的目的地)和画布回调 URL(您安装 CodeIgniter 的 URL 加上指向控制器的目录路径。)

      图 3 的示例中,画布回调 URL 是 http://www.example.com/index.php/home/,这是您将要在安装时创建主控制器的位置以及应用程序将进行其繁重任务的位置。

      图 3. Canvas 选项卡
      编辑页面的 Canvas 选项卡的截屏,其显示了“Canvas Page URL”和“Canvas Callback URL”字段。
    7. 单击 Connect 选项卡(请参考 图 4),并输入您的连接 URL。

      此 URL 应该与您较早输入的画布回调 URL 相同。请注意如果您的应用程序位于子域中(例如,foo.example.com),则请在 Base Domain 字段中键入您的基础域(也就是说,example.com)。

      图 4. Connect 选项卡
      编辑页面的 Connect 选项卡,显示 Facebook 连接设置
    8. 单击 Save Changes。如果一切顺利您应该会看到一个摘要页面(请参考 图 5)。
      图 5. 摘要页面
      示例页面,在顶部指示您的更改已保存。
  6. 下载 PHP SDK(请查看 参考资料)。

    下载包含一个 a src/facebook.php 文件(这是主库)和一个 examples/example.php 文件。

  7. 在 CodeIgniter 上创建简单的应用程序:
    1. 将您刚刚下载的 facebook.php 文件重新命名为 facebook_pi.php,并将其放入您的 CodeIgniter 代码的 system/application/plugins 文件夹中。

      如果不存在 plugins 文件夹,则现在就创建该文件夹并将新重新命名的文件放入其中。

    2. 将 example.php 文件复制到 system/application/views 文件夹。
    3. 打开文本编辑器,并创建一个名为 Home 的简单控制器。将 清单 1 中的代码复制并粘贴到该文件中,然后在 system/application/controllers 目录中将其保存为 home.php
      清单 1. 控制器基本结构
      class Home extends Controller {
      
      	function Home()
      	{
      		parent::Controller();	
      		$this->load->plugin('facebook');
      	}
      
      	function index()
      	{
      		$this->load->view('example');
      	}
      }

      在这里,您正在创建主控制器以便正确激活您的路径。请记住 Facebook 应用程序正在寻找 example.com/index.php/home,所以此特定控制器将对此要求作出响应。index() 函数将直接加载任何请求到此控制器,就像静态服务器上的 index.html 或 index.php 文件。

      您启动类时,构造函数会加载您的 Facebook 插件。(等一下,您可能会问:我何时创建了 Facebook 插件?记得您对 facebook.php 文件所做的操作,即将其重新命名为 facebook_pi.php 并放入插件文件夹中吗?这就是您已经执行的操作,使其可作为插件用于 CodeIgniter。)

      index() 函数中,您只是加载示例视图(无需放入 .php 部分),所有剩下的操作就是对视图文件夹中的 example.php 文件进行两处小修改。

    4. 将 example.php 文件加载到文本编辑器,并删除第一行 — 该行包括 facebook.php 行。在您运行 $this->load->plugin('facebook'); 时,CodeIgniter 已经完成了此项工作。
    5. 更改 清单 2 中的行以便与您创建应用程序时从 Facebook 获得的应用程序 ID 和秘密相匹配。
      清单 2. 编辑视图
      // Create our Application instance.
      $facebook = new Facebook(array(
        'appId'  => 'some-value',
        'secret' => 'some-other-value',
        'cookie' => true,
      ));
    6. 保存您的工作,然后将更新传递到服务器。

您已经努力工作完成了初始安装,当您很好地休息之后,您需要进行测试以便确保您正确地进行了所有操作。


最终测试

作为对于您一直进行的操作的最终测试,您只需访问 Facebook 中分配给您的应用程序的 URL — 换句话说,就是 http://apps.facebook.com/YOUR_APP_NAME 地址。如果您所做的一切都正确,则您将在浏览器中看到如 图 6 中所示的页面一样(当然除了您将看到您自己的 Facebook 数据而不是我提供的!)。如果您没有看到这样一个页面或者如果出现错误,您可能需要启用 cURL 和/或运行支持 json_decode() 的 PHP 版本。如果在您的服务器中这些都不可用,则 Facebook SDK 将会出错。

图 6. 正在运行的应用程序
作者的 Facebook 应用程序的截屏,标题为 “PHP-SDK”

如果您想比较在 CodeIgniter 环境外的原始代码,您可以访问 fbtest.tripledogs.com— 我建立的一个小子域,可以在没有 CodeIgniter 的情况下运行的原始 SDK。如果您要与您现在运行的代码进行对比,您将看到它只需额外花费几分钟就会实现相同的结果,但是您现在已经可以使用 CodeIgniter 框架功能。


结束语

此时,您了解了如何开始您自己的 Facebook 应用程序。幸运的话,使用此方法,您可以很容易地转移到更复杂的任务上。

参考资料

学习

获得产品和技术

讨论

条评论

developerWorks: 登录

标有星(*)号的字段是必填字段。


需要一个 IBM ID?
忘记 IBM ID?


忘记密码?
更改您的密码

单击提交则表示您同意developerWorks 的条款和条件。 查看条款和条件

 


在您首次登录 developerWorks 时,会为您创建一份个人概要。您的个人概要中的信息(您的姓名、国家/地区,以及公司名称)是公开显示的,而且会随着您发布的任何内容一起显示,除非您选择隐藏您的公司名称。您可以随时更新您的 IBM 帐户。

所有提交的信息确保安全。

选择您的昵称



当您初次登录到 developerWorks 时,将会为您创建一份概要信息,您需要指定一个昵称。您的昵称将和您在 developerWorks 发布的内容显示在一起。

昵称长度在 3 至 31 个字符之间。 您的昵称在 developerWorks 社区中必须是唯一的,并且出于隐私保护的原因,不能是您的电子邮件地址。

标有星(*)号的字段是必填字段。

(昵称长度在 3 至 31 个字符之间)

单击提交则表示您同意developerWorks 的条款和条件。 查看条款和条件.

 


所有提交的信息确保安全。


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=10
Zone=Web development
ArticleID=715427
ArticleTitle=使用 CodeIgniter 创建 Facebook 应用程序
publish-date=07112011