使用 PHP 和 Oracle 创建 Ajax 程序

link之家

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

Oracle Account

Manage your account and access personalized content. Sign up for an Oracle Account

Sign in to Cloud

Access your cloud dashboard, manage orders, and more. Sign up for a free trial

2007 年 2 月发表

近来一段时间，Ajax（异步 JavaScript 和 XML）风靡 Web 开发界。正如 Google 的一些特性（Suggest、Maps、Gmail 等）所展示的那样，Ajax 可以在无需用户提交表格或单击链接的情况下执行服务器请求。换句话说，Web 浏览器可以执行服务器请求并处理响应，无需用户进行任何操作，甚至感觉不到该操作正在发生。使用 Ajax 最直接的好处就是非常方便，而且相当酷。

在本文中，我将讨论使用 Ajax 创建简单的 Web 页到 JavaScript 函数、XMLHttpRequest、PHP 脚本，最后到 Oracle 数据库所需要的所有必要代码。对于代码，我将从整体角度讨论各段代码：每段代码的功能及其重要性。通过阅读该方法文档，您不仅可以获得一些示例代码，还希望您更深入地了解整个 Ajax 概念。

我将用到的示例是一个注册表单（或者说是其中的一小部分）。我必须确保 users 表中的电子邮件地址都是唯一的，从而使用户无法用同一地址多次注册。这通常是用户将表单提交给处理 PHP 脚本后验证过程的一部分。但用户为什么必须等待才能进行验证呢？相反，如果一旦用户输入其电子邮件地址并进入下一表单域，就立即验证该电子邮件地址那该多好呀。为此，我仍需查询该数据库，这就需要用到 Ajax 了。

本例简化的表结构可以使用以下 SQL 语句创建（无需其他表，我已经清除了标识键等内容）。

CREATE TABLE users ( email VARCHAR2(60) 显然，您可以以多种方式对此进行扩展。但目前，重要的是该示例代码假设您已经建立了这样的一个表并能够从 PHP 脚本连接它。该表必须包含一些记录才能使本示例完好运行，因此您应该按如下方式填充该表： INSERT INTO users (email) VALUES ('this@that.com') INSERT INTO users (email) VALUES ('me@school.edu') INSERT INTO users (email) VALUES ('fake@address.net') 当创建并填充该表之后，就可以开始进行编码了。正如我提到的，这里涉及到两个脚本。要开发和测试所有内容，您需要：

创建查询 Oracle 数据库的 PHP 脚本。

手动测试 PHP 脚本查看其运行情况。

编写与 PHP 脚本交互的 JavaScript 代码。

将 HTML 表单联接到 JavaScript。

测试整个程序。

第 1 步：编写数据库查询

整个 PHP 脚本称为 ajax.php。（参见示例代码 zip 。）该脚本的目的是在 Oracle 中运行一个查询并基于查询结果打印一条消息。这是非常基本的 Oracle、SQL 和 PHP 操作，但我将通过它来阐明正在进行的操作。

该脚本需要在该 URL 中接收一个电子邮件地址，它保存在变量 $_GET['email'] 中。然后该脚本连接到 Oracle 数据库。该查询还计算 users 表中有多少记录包含该电子邮件地址：

SELECT COUNT(*) AS NUM_ROWS FROM users WHERE email='{$_GET['email']}'

这应该返回 0 或 1（或者什么也不返回）。该查询在 Oracle 中执行，其结果绑定到 PHP $rows 变量。现在 $rows 表示数据库中有多少记录包含该电子邮件地址。对于 Ajax，该脚本的重要部分如下所示。

if ($rows > 0) { echo 'Email address has already been registered!'; } else { echo 'Email address is available!';

将基于 $rows 的值打印这两条消息中的一条。这就是该页面的全部内容了！其中完全不需要 HTML，因为该脚本不会用作标准的 Web 页面。

如果您想改进此脚本，可以检验该电子邮件地址是否匹配电子邮件地址的正则表达式模式。如果是这样，正常执行查询；否则，输出一个语句表明它不是有效的电子邮件地址。至少，您可能想防止 SQL 注入攻击。（也就是，在没有有效性保证时避免在查询中使用 $_GET 变量。）

第 2 步：测试 PHP 脚本

由于整个 Ajax 程序涉及几种技术（HTML、JavaScript、PHP、SQL 和 Oracle），您最好逐步测试每个部分。否则，您可能很难知道问题到底发生在哪里。测试这个 PHP 脚本应该相当容易：

确保您已经在 Oracle 中创建了该表并填充了它。

编辑 ajax.php，以便它针对您的 Oracle 安装使用有效的连接参数。

将脚本保存为 ajax.php。

将其放置在您 Web 服务器的适当目录中。

从您 Web 浏览器访问 http://yoururl/ajax.php?email=X。

将 X 替换为数据库中的一个现有电子邮件地址（例如，http://yoururl/ajax.php?email=this@that.com）。您应该看到“Email address has already been registered!”消息。然后使用一个还未存储的电子邮件地址。您应该看到“Email address is available!”。当这些正常运行后，您就可以进入本例的实际 Ajax 部分了。

第 3 步：编写 JavaScript

该过程的这一部分可能是最难的，除非您已经进行过大量的 JavaScript 编程。在任何情况中，JavaScript 代码都是 Ajax 过程的核心，因为是它在执行和处理 PHP 页面的请求。我将详细介绍该代码。

JavaScript 代码将定义三个函数。第一个函数创建一个请求对象变量：

function createRequestObject() { var ro; if (navigator.appName == "Microsoft Internet Explorer") { ro = new ActiveXObject("Microsoft.XMLHTTP"); } else { ro = new XMLHttpRequest(); return ro;

您无需任何修改就能将此代码用于任何 Ajax 应用程序。如果使用的 Web 浏览器是 Microsoft Internet Explorer，则 ro 变量初始化为类型 Microsoft.XMLHTTP 的 ActiveXObject。对于其他所有浏览器，ro 是直接的 XMLHttpRequest 对象类型。这对它来说实在没有其他意义。该 ro 变量现在是一个具有执行异步请求所需所有功能的对象。创建该请求对象变量之后，该函数将返回该变量。

当首次加载该页面时，该函数立即由 JavaScript 代码调用：

var http = createRequestObject();

现在 http 代表该对象，而且在其他函数中全局可用。

第二个是调用 PHP 脚本的函数：

function sendRequest(email) { http.open('get', 'ajax.php?email=' + encodeURIComponent(email)); http.onreadystatechange = handleResponse; http.send(null);

该函数接受一个参数（将验证的电子邮件地址）。然后它打开一个到 PHP 脚本的连接。正如 open() 方法中的第一个参数所示的，该请求的类型将是 get 而非 post。把该电子邮件地址附加到该 URL 后，得到一个诸如 ajax.php?email=this@that.com 的页面请求。如您所知，这是 PHP 脚本的正确调用方式。encodeURIComponent() 函数只是对提交的值进行编码以使它是 URL 安全的。该函数的第三行告诉该对象当发出请求后应该调用哪个 JavaScript 函数。最后一行实际发出请求。

再重复一下，第一个函数 createRequestObject() 创建所需的对象变量。第二个函数 sendRequest() 发出 PHP 脚本的实际请求。现在我们需要一个处理该请求的函数：

function handleResponse() { if (http.readyState == 4) { document.getElementById('email_label').innerHTML = http.responseText;

前一个函数告诉请求对象当发出请求后调用该函数。该函数首先检查请求是否成功发出。如果成功发出，http.readyState 将等于 4。它也可以等于 0 到 3 之间的整数（如果您感兴趣，可以在线搜索其实际含义），但等于 4 意味着请求成功。该请求的结果将存储在 http.responseText 属性中，结果是 PHP 脚本返回的两条消息之一。具体说来，如果该请求成功，则 http.responseText 将是“Email address has already been registered!”或“Email address is available!”。

此时，JavaScript 知道 PHP 脚本的结果是什么。您只需用 JavaScript 通知用户该结果。一个简单的方法是使用一个 alert() 对话框：

alert(http.responseText);

如果您将此置于该条件中，当您在测试整个应用程序时将看到该结果。（实际上，alert() 是一个极佳的调试工具，它可以揭示 JavaScript 代码的实际运行情况。）但是，我发现这些警告对于最终用户来讲有些烦人，我宁愿在该表单的电子邮件输入旁打印该消息。为此，我选用了 DOM（文档对象模型）。具体地讲，我将 http.responseText 指定给页面上一个称为 email_label 的元素。您将在第 4 步中看到这一点。

哟！希望您能跟得上。再说一遍，这是本系列最重要、最复杂的一部分。JavaScript 使用这三个函数进行以下三个操作：定义浏览器特定的请求对象；向 PHP 脚本发出请求；处理请求结果。如果您对其中的任何函数感到困惑，或者在需要创建更复杂的 Ajax 应用程序时，您可能需要研究一下 JavaScript 和 DOM。

第 4 步：创建一个具有 JavaScript 功能的 HTML 表单

正如我前面写到的，本例的前提是一个至少接受一个电子邮件地址的注册表单。最小的表单可能是：

<form action="somepage.php" method="post"> Email Address: <input name="email" type="text" size="30" maxlength="60" <//><br <//> First Name:<input name="first_name" type="text" size="20" maxlength="20"<//><br <//> （表格的其他内容……） </form>

就这样！嗯，内容不多。您可能想要更多的输入（一个“submit”按钮，等等）。但就本例而言已经足够了。为了避免混淆，需要注意这里的动作属性和方法属性与 ajax.php 脚本（不处理该表单的提交）毫无关系。

此外，还需要两个操作。首先，该表单必须设法调用发出请求的 JavaScript 代码。为此，可以使用若干技巧：创建一个可点击的链接，等待点击提交按钮，等等。我已经确定，当用户输入一个电子邮件地址并前进到下一表单元素时就调用该 JavaScript。这需要 onchange() 方法（我将把它添加到电子邮件输入中）：

Email Address: <input name="email" type="text" size="30" maxlength="60" onchange="sendRequest(this.form.email.value)" <//>

当用户在该输入中更改值时（包括首次输入任何内容，然后切换或点击到另一个输入），将调用 JavaScript sendRequest() 函数。它接受一个参数（电子邮件表单输入的值）。如果您回头看看 JavaScript 代码，可以了解这里键入的值是如何发送给该函数（该函数进而发送给 PHP 脚本）。

另外，该 HTML 表单还需要一个位置供 JavaScript“写”接收的消息以便用户能看到。正如 handleResponse() 函数所示的，将把该消息赋给一个称为 email_label 的元素的 innerHTML。为此，在电子邮件地址输入后我对该 ID 添加了一个 span 标记：

这是为了将 HTML 表单连接到 JavaScript。（有关最终代码，请查看示例代码 zip 中的清单 1。）现在我们来看一下它是如何工作的！

第 5 步：测试 Ajax 程序

完成 HTML 和 JavaScript 之后，您应该将它保存为 ajax.html（或其他任何实际内容），然后将其放在与 PHP 脚本相同的目录中。通过在您的 Web 浏览器中运行它来加载表格，注意这是通过 URL 来进行的，而非从文件系统打开它（例如，访问 http://yoururl/ajax.html）。在相应的输入中键入未使用过的电子邮件地址，然后切换或点击到下一输入。使用一个存储了的电子邮件地址重复操作。

以下两个屏幕快照显示了您应该看到的结果。非常神奇！

在本文中，您已经看到如何使用 PHP 和 Oracle 轻松实现一个 Ajax 程序。这样，服务器端验证将在客户端中实现（但如果禁用了 JavaScript，您仍需保留服务器端验证）。我认为，这个具体示例为最终用户演示了一个极佳的特性，使他们免于：

检查电子邮件地址是否已被注册

重复这个过程

此外，我认为该示例和概念总得来说都非常酷。而在 Web 上，这是个很重要的因素。

当然，您可以通过 Ajax、PHP 和 Oracle 进行其他大量工作。本文中的示例只将一段数据发送到 PHP 脚本，且只检索了一个字符串。其实，您可以发送和接收更多内容。如果您有大量数据要返回调用页面，您可以让 PHP 以 XML 格式返回数据，然后使用 JavaScript 分析并显示这些数据。如果您在线搜索，您将发现大量不同的示例。

Larry Ullman 是 DMC Insights Inc. （一家专门研究信息技术的公司）数字媒体技术部门的总监以及 Web 开发人员主管。Larry 居住在华盛顿特区的郊外，并曾经编写过多部有关 PHP、SQL、Web 开发和其他计算机技术方面的书籍。

将您的意见发送给我们