ASP.NET 内容编辑器控件用于基本内容管理

• 下载源代码 - 487 KB
• 下载演示 - 263 KB

引言

此 Web 控件使您能够维护网站页面的内容，而无需使用任何客户端软件或重量级服务器端内容管理系统。促使我开发此控件的动机是，我有一个现有的 ASP.NET 网站，并且我希望能够通过浏览器随时随地快速更新其内容。您可以访问 www.goodforyourecords.co.uk，其中演示了此控件的实际应用。它易于集成到您的站点，并且易于使用。该控件允许您通过使用 FreeTextBox 控件来编辑、预览和将内容保存到数据库，并提供全面的编辑功能。

此控件的设计目的

• 在 ASP.NET 页面中编辑和预览 HTML 内容
• 使用数据库（MS Access / SQL Server / SQL Express / SQL Compact Edition）保存和检索内容
• 允许通过使用查询字符串参数来更改控件显示的内容
• 允许多个控件实例驻留在单个页面上
• 轻松修改现有页面以集成内容控件
• 已在 IE7 和 Firefox 3.0.5 上测试

它不做什么

• 管理您网站的页面结构（它不是内容管理系统！)
• 允许多用户编辑（尚未实现锁定功能）

将此控件集成到您的页面之一非常简单

• 在 Visual Studio 中，将 ContentEditor 控件添加到工具箱，然后将该控件拖放到您的页面上
• 为控件分配内容 ID
• 将空的 WebSiteContent.mdb 数据库文件拖放到您的 Web 应用程序的 App_Data 目录中
• 在 web.config 中添加一些配置项
• 对当前用户进行身份验证以允许编辑开始...

就是这样 - 您现在拥有了一个可以通过 Web 浏览器在线编辑其内容的页面。

将 ContentEditor 控件添加到页面

演示项目提供了 ContentEditor 控件可以做什么的简单示例。Default.aspx 文件包含四个控件实例，其中三个演示了使用查询字符串参数切换内容的想法 - 稍后将详细介绍。还有一个演示登录页面，它提供了一种对用户进行身份验证的方法，以使其能够修改这些实例的内容。如果您的站点已具有用户身份验证机制，则您可能不需要此功能。如果您没有，您将需要至少将此页面添加到您的站点 - 别担心，这很简单。

将 ContentEditor 添加到网站的步骤

将控件添加到 Visual Studio

在 Visual Studio 中打开您的网站，然后将控件添加到工具箱。通过“视图”->“工具箱”完成此操作。右键单击工具箱面板，然后选择“选择项”。在“ .NET Framework 组件”选项卡上，单击“浏览”，然后找到源代码项目中的 ContentEditor.dll 的 bin 文件夹。单击“打开”，然后单击“确定”。控件 DLL 应该已被复制到您的 bin 文件夹，现在可以在您的工具箱中使用。您现在应该能够将控件拖放到页面的设计界面上。

在属性网格中，将控件的 ContentId 设置为唯一的字符串值。这标识了将由控件显示的内容。

将配置添加到 Web.Config

将以下配置添加到您的 web.config 文件中

<appSettings>
    <add key="ContentEditor.ContentDataProviderAssembly" value="ContentEditor"></add>
    <add key="ContentEditor.StyleSheetUrl" value="ContentEditor.css"></add>    
</appSettings>

您需要将 ContentEditor.css 样式表从演示项目复制到您的网站的根目录。如果您希望使用其他文件夹，请修改 ContentEditor.StyleSheetUrl 的值以指定适当的路径。

现在，您需要决定使用哪种数据库来存储内容。最简单的解决方案是使用内存数据库，如 MS Access 或 SQL Compact Edition。无需担心数据库管理，只需将一个文件放入 App_Data 文件夹即可。这是小型站点的最佳选择。并非所有 ISP 都支持 SQL Compact，如果您的 ISP 不支持，则选择 MS Access。如果您选择 MS Access，请将以下内容添加到 web.config 的 <appSettings> 元素中

<add key="ContentEditor.ContentDataProviderType" 
     value="ContentEditing.OleDb.OleDbContentDataProvider"></add>

如果您希望使用 SQL Compact、SQL Express 或 SQL Server，请改用以下内容

<add key="ContentEditor.ContentDataProviderType" 
     value="ContentEditing.LinqSql.LinqSqlContentDataProvider"></add>

如果使用 MS Access 或 SQL Compact，请将 .mdb 文件（MS Access）或 .sdf 文件（SQL Compact）复制到您的网站的 App_Data 文件夹。对于 MS Access，请将以下内容添加到 web.config 文件中的 <connectionStrings> 元素

<add name="ContentEditor.WebContentDatabase" 
     connectionString="provider=Microsoft.Jet.OLEDB.4.0;
                       data source=|DataDirectory|WebSiteContent.mdb"/>

对于 SQL Compact，使用

<add name="ContentEditor.WebContentDatabase" 
     connectionString="data source=|DataDirectory|WebSiteContent.sdf;
                       Persist Security Info=false"/>

对于 SQL Express 或 SQL Server，您需要使用 SQL Server Management Studio 手动设置数据库。ContentEditor 项目中的 CreateContentTable.sql SQL 脚本可用于创建所需的表。相应地设置连接字符串；例如，对于 SQL Server

<add name="ContentEditor.WebContentDatabase" 
     connectionString="Data Source=localhost;Initial Catalog=WebSiteContent;
                       Integrated Security=True"/>

身份验证用户以编辑内容

现在，您需要使经过身份验证的用户能够编辑内容。如前所述，您可以利用您网站现有的身份验证机制，或者如果您没有，则从演示站点复制登录页面 (Login.aspx)。ContentControl 类提供了两个静态方法来控制编辑行为

/// <summary>
/// Enables content editing for the current user session.
/// Once enabled, content can be edited and viewed in preview mode.
/// </summary>
public static void EnableEditingForCurrentSession()

/// <summary>
/// Disables content editing for the current user session.
/// Once disabled, the content is output without 
/// any modification by this control.
/// </summary>
public static void DisableEditingForCurrentSession()

一旦您的身份验证机制已确定用户有权编辑内容，您只需调用 EnableEditingForCurrentSession。这将允许用户在客户端会话期间编辑和预览内容。调用 DisableEditingForCurrentSession 会禁用客户端会话的任何编辑，并将控件切换到“查看”模式，此时，控件将直接呈现编辑后的内容 - 换句话说，就像最终用户看到的那样。在用户注销时调用此方法。

如果您选择使用演示项目中的登录页面，只需将其复制到您的网站。您需要将用户的用户名和密码添加到您的 web.config 中，如下所示

<authentication mode="Forms">
    <forms name="appNameAuth" protection="All" timeout="30">
        <credentials passwordFormat="Clear">
            <user name="user" password="password" />
        </credentials>
    </forms>
</authentication>

默认情况下，成功的身份验证将重定向到 Default.aspx。通过设置登录页面使用的 ASP.NET 登录控件的 DestinationPageUrl 属性，将其更改为您所需的页面。

在开始编辑之前，还需要进行最后一次更改。由于您允许在编辑通过控件进行的内容时将 HTML 发布回您的站点，因此 ASP.NET 会验证请求以确保它不包含任何恶意的跨站点脚本元素。您必须通过将页面指令上的 validateRequest 属性设置为 false 来禁用此功能，如下所示

<%@Page ValidateRequest="false" %>

编辑网站内容

调用 EnableEditingForCurrentSession 后，即可为当前客户端会话编辑内容。控件的所有实例都将显示如图 2 所示。这是“预览”模式。

此处，内容 ID、原始创建日期和最后修改日期显示在内容上方。内容显示为最终用户将看到的样式。单击“编辑”按钮会将控件切换到“编辑”模式，此时 FreeTextBox 控件接管，允许您在 HTML 和设计模式下修改内容，如图 3 所示。

单击“保存”将永久更新内容并恢复到“预览”模式，您可以在其中预览新内容。此时不再可能恢复到原始内容。单击“取消”将恢复到“预览”模式，但原始内容将保持不变。单击“预览”将恢复到“预览”模式，允许您查看更改，但在这种情况下，如果看到的不是您想要的，则可以恢复到原始内容。此外，最终用户尚未看到您的更改。

图 4 显示控件处于“预览”模式，此时内容尚未永久更新。这由红色边框表示。如果您对更改不满意，此时单击“取消”将使内容恢复到原始状态。如果您对看到的内容满意，单击“保存”将永久更新内容。在这两种情况下，您都将停留在“预览”模式。单击“编辑”允许对已修改的内容进行进一步修改。最终用户直到您单击“保存”永久更新更改后才能看到您的更新。

调用 DisableEditingForCurrentSession 时，控件会切换到“查看”模式。在这种情况下，控件呈现的内容与“预览”模式下的内容完全相同，只是移除了所有编辑功能。页面将按最终用户看到的样式呈现。

使用查询字符串参数修改内容 ID

该控件的一个非常有用的功能是能够通过在页面请求的查询字符串中传递参数来修改页面上任何实例的内容 ID。通过这样做，同一个控件实例可以在不同的页面访问中显示不同的内容。一个查询字符串可以指定多个重新映射，如果您在一个页面上有多个实例。通过在实际内容本身中创建包含此类查询字符串的超链接，可以实现一种分页形式，如演示项目所示。

在图 5 中，“下一步”超链接定义如下 URL

/Default.aspx?ids=ContentEditor1,Content%20A2

“ContentEditor1”的默认内容 ID 为“Content A”，如 ASPX 标记所示，因此如果未提供查询字符串，则显示的内容是为此 ID 的内容。通过指定“id=ContentEditor1,Content A2”，当页面加载时，将内容 ID“Content A2”分配给 ID 为“ContentEditor1”的实例，覆盖默认值并导致加载“Content A2”的内容。然后用户看到图 6。

在图 6 中，“上一步”超链接定义如下 URL

/Default.aspx?ids=ContentEditor1,Content%20A

这会将实例“ContentEditor1”的内容 ID 设置回原始值“Content A”。当用户单击此链接时，他们会看到图 5 中显示的内容。因此，我们现在有了基本的分页功能，允许用户在同一个控件实例中在“Content A”和“Content A2”之间移动。

当 PreserveIdRemapping 属性设置为 true 时，它允许您指定页面请求的查询字符串中收到的重新映射在用户会话期间有效。通过请求同一页面而不进行查询字符串覆盖，控件实例的任何先前重新映射都将保持有效 - ASPX 标记中指定的中性内容 ID 不会被使用。当设置为 false 时，如果请求页面且查询字符串中没有覆盖，则无论之前的重新映射如何，都会使用标记中的中性值。此功能旨在允许控件在用户从站点其他地方返回页面时显示用户上次查看的内容，而这些地方未在 URL 中定义内容重新映射。特别是，当一个页面上有多个内容控件实现分页时，此功能很有用。通过保留重新映射，单击一个实例中的“下一步”超链接不会导致另一个实例在返回页面时恢复到原始内容。

ContentEditor 控件的自定义

更改外观

您可能需要更改控件的外观，例如，更改预览边框的颜色或样式，以便在您使用的网站中可见。这是通过更改配置文件中 ContentEditor.StyleSheetUrl 属性定义的样式表中的样式来实现的。

创建新的内容提供程序

该控件采用策略模式设计，这意味着如果您需要将数据存储在 SQL Server 或 MS Access 数据库以外的数据源中，您可以插入一个不同的内容提供程序。为此，您需要创建一个实现 ContentEditor.IContentProvider 接口的类，并遵循源文件中的 XML 注释所描述的约定。然后，在配置文件中，只需更改 ContentEditor.ContentDataProviderAssembly 属性以指定包含新类型的程序集名称，并更改 ContentEditor.ContentDataProviderType 以指定新类型的名称。

未来发展

多用户访问

目前，多用户同时编辑内容是不安全的，存在被另一个用户覆盖更改的风险。因此，未来的增强功能将是引入某种锁定机制，一次只允许一个用户更改内容。

访问控制

可以为不同的用户分配不同的角色。因此，属于“编辑者”角色的用户可以更新内容，但只有属于“审批者”角色的用户才能批准更新供最终用户查看。

历史

• 1.0 - 2009 年 1 月 19 日 - 初始版本。