重要声明：ASP 与 Dreamweaver 的时代背景

在开始之前,请务必了解：

dreamweaver asp教程
（图片来源网络，侵删）
  1. ASP (Active Server Pages) 是一项非常古老的技术，由微软开发，它通常与 VBScript 语言一起使用，运行在 Windows 的 IIS (Internet Information Services) 服务器上。
  2. Dreamweaver 的可视化编辑功能在 ASP/PHP 等服务器端技术的早期（约 2000-2010 年）非常流行,因为它能极大地简化开发流程。
  3. 现代替代方案：ASP 已被更现代、更安全的 ASP.NET (C# 语言) 所取代，对于动态网站开发，业界主流技术栈是：
    • 前端：HTML5, CSS3, JavaScript (配合 React, Vue, Angular 等框架)
    • 后端：Node.js, Python (Django/Flask), PHP (Laravel), Java (Spring Boot), C# (.NET Core)
    • 数据库：MySQL, PostgreSQL, MongoDB 等

这份教程主要面向以下人群：

  • 需要维护老旧的 ASP 网站项目。
  • 出于学习目的,想了解服务器端网页的工作原理。
  • 在特定环境下（如学校、某些政府机构）仍在使用这套技术。

第一部分：准备工作

在开始之前,你需要搭建一个本地的开发环境。

安装 Dreamweaver

确保你安装了 Adobe Dreamweaver 的较旧版本（如 CS6 或更早版本），因为新版本可能不再内置对经典 ASP 的完整支持，较新版本也可以使用,只是某些向导可能不可用。

安装 Web 服务器和运行环境

ASP 必须在服务器环境中运行，不能直接用浏览器打开 .asp 文件,你需要安装一个本地服务器。

dreamweaver asp教程
（图片来源网络，侵删）
  • 最佳选择 (推荐)：XAMPP for Windows 或 WampServer。
    • 注意：XAMPP 默认安装的是 Apache 服务器（PHP 环境），不直接支持 ASP,你需要进行额外配置或选择其他方案。
  • 微软官方方案：IIS (Internet Information Services)。
    • Windows 10/11：通过 "控制面板" -> "程序" -> "启用或关闭 Windows 功能" -> 勾选 "Internet Information Services" 及其子项（特别是 "ASP"）。
    • Windows 7：同样在 "控制面板" -> "程序和功能" -> "打开或关闭 Windows 功能" 中启用。
    • 优点：原生支持 ASP,配置最标准。
    • 缺点：配置相对复杂。

创建网站根目录

在你的电脑上创建一个文件夹，D:\MyASPWebsite,这个文件夹将作为你网站的根目录。

  • 如果你使用 IIS：你需要将这个文件夹在 IIS 管理器中配置为一个 "网站"，并指定端口号（如 8080）。
  • 如果你使用其他服务器：确保服务器配置指向这个文件夹。

第二部分：创建你的第一个 ASP 项目

步骤 1：在 Dreamweaver 中定义站点

这是最关键的一步，它告诉 Dreamweaver 你的网站文件在哪里,以及如何连接到服务器。

  1. 打开 Dreamweaver，选择 站点 -> 新建站点。
  2. 在弹出的窗口中，切换到 服务器 选项卡。
  3. 点击 号，选择 本地服务器。
  4. 填写服务器信息：
    • 服务器名称：起一个你喜欢的名字，如 "My Local ASP Server"。
    • 服务器文件夹：选择你刚才创建的网站根目录，D:\MyASPWebsite。
    • Web URL：输入你的本地访问地址，如果你使用 IIS 且端口号是 8080，就输入 http://localhost:8080。
  5. 勾选 "测试" 服务器：
    • 服务器模型：选择 ASP VBScript。
    • 访问：选择 本地/网络。
    • 测试服务器文件夹：同样指向你的网站根目录 D:\MyASPWebsite。
  6. 点击 保存，现在你已经成功定义了一个支持 ASP 的本地站点。

步骤 2：创建一个简单的 ASP 页面

  1. 在 Dreamweaver 中，选择 文件 -> 新建。
  2. 选择 动态页，然后在右侧的 服务器技术 中选择 ASP VBScript。
  3. 点击 创建，Dreamweaver 会生成一个基础的 ASP 页面模板。

你将看到类似下面的代码：

<%@ Language=VBScript %>
<%
' Option Explicit
' Session.CodePage = 65001 ' UTF-8
' Response.Charset = "utf-8"
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">无标题文档</title>
</head>
<body>
</body>
</html>

步骤 3：编写你的第一段 ASP 代码

ASP 代码写在 <% ... %> 标签之间。

dreamweaver asp教程
（图片来源网络，侵删）
  1. 将光标放在 <body> 和 </body> 之间。
  2. 输入以下代码：
<%
    ' 这是一个 VBScript 注释
    Dim myName ' 声明一个变量
    myName = "Dreamweaver ASP 教程"
    Response.Write("<h1>你好，" & myName & "!</h1>")
    Response.Write("<p>当前时间是：" & Now() & "</p>")
%>
  1. 保存文件，例如命名为 index.asp。

步骤 4：预览页面

  • 方法一（推荐）：在 Dreamweaver 中，直接按 F12 键，Dreamweaver 会自动通过你定义的测试服务器来预览页面，你应该会看到 "你好，Dreamweaver ASP 教程!" 和当前的服务器时间。
  • 方法二：打开浏览器，手动输入地址，如 http://localhost:8080/index.asp。

为什么不能直接双击文件打开？ 因为浏览器只能解析 HTML、CSS、JS 等。<% ... %> 里的代码是服务器端代码，必须先由服务器（IIS）执行，生成纯 HTML 后，再发送给浏览器，直接双击，服务器无法处理，浏览器会把 <% 和 %> 当作普通文本显示出来。

第三部分：核心 ASP 功能与 Dreamweaver 应用

连接数据库 (使用 Dreamweaver 可视化工具)

这是 Dreamweaver 最强大的功能之一。

准备工作：

  1. 安装一个数据库，如 Microsoft Access 或 SQL Server Express。
  2. 创建一个数据库，mydb。
  3. 在数据库中创建一个表，users，包含字段 id (自动编号), username (文本), email (文本)。
  4. 准备好数据库连接信息：
    • Access：提供 .mdb 或 .accdb 文件的物理路径。
    • SQL Server：提供服务器名、数据库名、用户名、密码。

在 Dreamweaver 中创建连接：

  1. 打开 Dreamweaver 的 数据库 面板（窗口 -> 数据库）。
  2. 点击 号，选择 数据源名称 (DSN) 或 自定义连接字符串。
    • DSN 方式：需要在 Windows 的 "ODBC 数据源管理器" 中预先创建一个 DSN，优点是配置简单,缺点是服务器环境可能不支持。
    • 自定义连接字符串 (推荐)：更灵活，不依赖系统 DSN。
  3. 以 Access 自定义连接 为例：
    • 连接名称：起一个名字，如 connDB。
    • 连接字符串：格式为 Provider=Microsoft.Jet.OLEDB.4.0;Data Source=你的数据库文件完整路径;。Provider=Microsoft.Jet.OLEDB.4.0;Data Source=D:\MyASPWebsite\data\mydb.mdb;。
    • 测试：点击 测试 按钮，如果成功，会提示 "成功创建连接"。
  4. 点击 确定，现在你的数据库连接 connDB 就会出现在 数据库 面板中,你可以展开它查看表和字段。

显示数据 (记录集)

  1. 将光标放在你想显示数据的位置（在 <body> 标签后）。
  2. 打开 绑定 面板（窗口 -> 绑定）。
  3. 点击 号，选择 记录集 (查询)。
  4. 填写记录集信息：
    • 名称：如 rsUsers。
    • 连接：选择你刚才创建的 connDB。
    • 表格：选择 users。
    • 列：选择 全部。
    • 筛选：暂时留空。
    • 排序：可以按 id 降序排列。
    • 显示：选择 10 条记录。
  5. 点击 测试，你应该能看到一个包含用户数据的表格，确认无误后点击 确定。
  6. 绑定 面板中会出现 rsUsers 记录集，展开它，你会看到 username 和 email 字段。
  7. 将 username 字段直接拖拽到你的 HTML 页面中，Dreamweaver 会自动生成重复区域代码,显示所有记录。

生成的代码会类似这样：

<%
While ((Repeat1__numRows <> 0) AND (NOT rsUsers.EOF))
%>
  <p><%=(rsUsers.Fields.Item("username").Value)%></p>
  <%
  Repeat1__index=Repeat1__index+1
  Repeat1__numRows=Repeat1__numRows-1
  rsUsers.MoveNext()
Wend
%>

插入、更新和删除数据

这些操作通常通过表单来完成。

  1. 创建表单：在页面上插入一个表单 (form)，包含输入框（input）和提交按钮。
  2. 使用服务器行为：
    • 选中表单，打开 服务器行为 面板（窗口 -> 服务器行为）。
    • 点击 号，你会看到 插入记录、更新记录、删除记录 等选项。
    • 点击相应的选项，Dreamweaver 会弹出一个向导，引导你完成配置：
      • 连接：选择你的数据库连接。
      • 插入到表格：选择目标表。
      • 获取值自：选择你的表单。
      • 列：将表单中的每个输入框与数据库表的字段对应起来。
  3. 完成配置后，Dreamweaver 会自动生成处理表单提交的 VBScript 代码。

第四部分：进阶与总结

  • 表单验证：Dreamweaver 也提供了 验证表单数据 的服务器行为，可以在提交前检查必填字段、邮箱格式等。
  • 用户登录：通过 服务器行为 -> 用户身份验证，可以轻松实现登录、注销、限制访问页面等功能。
  • 包含文件：为了代码复用，可以使用 <!--#include file="header.asp" --> 来将公共的头部、导航栏、页脚等包含进来。

总结与建议

这份教程带你重温了使用 Dreamweaver 开发 ASP 网站的经典流程，它的核心优势在于可视化和自动化,将复杂的数据库操作和服务器逻辑封装在简单的向导和拖拽操作中。

再次强调，这套技术栈已经过时，如果你是初学者,强烈建议你学习现代技术：

  • 前端：从 HTML, CSS, JavaScript 开始，然后选择一个主流框架（如 Vue 或 React）。
  • 后端：选择一门你感兴趣的语言，如 Python (Django/Flask) 或 Node.js (Express)，它们的社区更活跃，学习资源更丰富,开发效率也更高。

学习 Dreamweaver ASP 的价值在于理解“服务器如何处理请求并生成动态内容”这一核心概念,这个概念在任何后端技术中都是通用的。