65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP.NET/C# 文件存储库

swprofile
starIconstarIcon
emptyStarIcon
starIcon
emptyStarIconemptyStarIcon

2.11/5 (5投票s)

2006年8月21日

CPOL

8分钟阅读

viewsIcon

102501

downloadIcon

1527

本文介绍如何使用 ASP.NET/C# 创建一个可重用的文件存储库，该存储库具有分层目录结构、文件上传、目录创建、文件预览以及支持文件类型的自定义功能。

Sample Image - aspnet_file_repository.jpg

引言

本文介绍如何使用 ASP.NET/C# 创建一个可重用的文件存储库，该存储库具有分层目录结构、文件上传、目录创建、文件预览以及支持文件类型的自定义功能。

背景

我被聘为当前职位的 Web 开发人员，其中一项任务是重构公司网站的后端，使其完全动态化，并且大部分内容都由数据库驱动。如果某个页面需要更改图片，营销人员可以使用我将要构建的工具来选择新图片并立即上线。我的项目目标是提供一个“交钥匙”的网站解决方案，让我们（IT 部门成员）无需管理或参与其中。如果营销人员想更改内容，他们将拥有执行此操作的工具，而无需了解 HTML、ASP.NET 或 C#。

我解决方案的一部分是一个内容管理系统 (CMS)，它允许非技术人员使用易于使用的 Web 界面从预构建的模板创建网页。在页面创建过程中，会选择一个模板，然后提示用户为模板所需的每个元素输入值。这篇文章就在这里派上用场了。页面上可用的“组件”之一是图像组件。我需要为非技术用户提供一种方法来上传、管理、预览和选择图像以在页面上使用。

我首先创建了一个“图像存储库”，它将显示图像，并允许用户从 Web 服务器上的单个目录预览、上传和选择图像。这是一个可行的解决方案，但显然在许多方面都非常有限。所有上传的图像都会被塞进一个目录。如果需要从一个大组中选择数百甚至数千张图像，这项任务会变得乏味。需要目录创建和上传目录指定。此外，还决定需要一种机制来上传和显示 Flash 文件。我需要为网站创建一个 Flash 组件，并像处理图像一样容纳它们，并将所有这些功能封装在我的 CMS 的一个可重用部分中。“图像存储库”很快就缺乏所需的功能，并已准备好进行彻底改革。这是我第一次尝试。

我的第二个版本将在此文章中讨论。“图像存储库”的代码被保留并修改以添加所需功能，现在称为“文件存储库”。该存储库是一个功能齐全的方法，非技术人员可以通过我的 CMS 管理和选择文件以供 Web 页面使用。

Using the Code

该存储库从需要文件类型作为参数的 CMS 页面启动。CMS 页面有一个文本框用于显示选定的文件名，以及一个“浏览文件存储库”按钮。单击该按钮将启动一个显示文件存储库的模态窗口。根据 CMS 所需的文件类型（Flash、图像等），模态窗口将使用名为“type”的查询字符串参数启动。

当前实现的类型如下

文件类型 查询字符串参数
图像 (.jpg, .png, .gif, .bmp) jpg
Flash swf
便携式文档格式 pdf

这是启动存储库的 JavaScript 代码片段

window.showModalDialog("FileRepository.aspx?type=" + extension + "","",
   "resizable:yes;help:no;edge:sunken;dialogWidth:625px;dialogHeight:650px")
  • FileRepository.aspx?type=jpg 将为图像启动文件存储库窗口。
  • FileRepository.aspx?type=swf 将为 Flash 文件启动文件存储库窗口。
  • FileRepository.aspx?type=pdf 将为 PDF 文件启动文件存储库窗口。

可以通过使用实现的查询字符串参数直接访问FileRepository.aspx 页面来启动文件存储库。这将显示正在运行的存储库，但单击特定文件的“选择”链接将不起作用，因为它不是从模态窗口启动的，并且没有父窗口可以向其发送返回值。

存储库有四个主要部分

  1. 上传新文件区域
  2. 创建新目录区域
  3. 目录结构树视图区域
  4. 文件信息/预览区域

不同的区域可以在上面的截图上看到。

上传新文件、创建新目录和文件信息/预览区域都依赖于目录结构的树视图区域。如果上传文件或创建目录，它将在目录树中当前选择的目录下面/里面创建。当前选择的目录可以在树中识别，因为其名称后面的背景颜色是浅棕色。文件信息/预览区域显示的文件是位于目录树中当前选择的目录中的文件。要查看每个目录中的不同文件，只需单击目录树中的目录名称。单击 + 和 – 符号来展开和折叠树节点，就像您在使用 Microsoft 的 Windows Explorer 时一样。

当为图像启动文件存储库时，单击缩略图时会弹出图像预览。缩略图为 100x100 像素，使用 HTTP 流创建，因此服务器硬盘上不会创建实际的缩略图图像。

单击“选择”链接按钮后，模态窗口将关闭，选定文件的路径将发送到父窗口并放入 CMS 页面上的文本框中，在本例中是 file_chooser.aspx。file_chooser.aspx 页面具有单选按钮，允许测试每个当前实现的​​文件类型。

我最终在 CMS 中使用的产品是一个支持分层目录结构的可重用组件，将来可以修改以支持更多文件类型。代码文档记录得相当好，除了 JavaScript。我是 C#/ASP.NET/SQL 开发人员，JavaScript 不是我的强项。此项目中的 JavaScript 代码可能不够完善。

要点和值得注意的项目

关于项目安装/配置的一些说明

  • 我的服务器上的“file_repository”目录需要为以下帐户启用写入权限：ASP.NET Machine Account、IIS_WPG（IIS 工作进程）和Internet Guest Account。
  • 我在实现中使用了 .NET 2.0。
  • 我的项目中添加了示例文件，仅用于演示目的。文件的命名约定不遵循我的代码强制执行的字母数字和下划线约定。我只是手动复制粘贴文件和目录以提供一些示例数据。

关于不同浏览器的几点说明

*我仅在 Firefox 和 Microsoft Internet Explorer 上进行了测试*

Firefox

  • 模态窗口仅适用于 IE，因此在 Firefox 中不起作用。基本上，使用 Firefox 对我来说没有意义，但如果修改我的代码用作文件上传机制，它也能正常工作。
  • 将浏览器指向 FileRepository.aspx?type=jpg（或 pdf 或 swf）即可看到存储库，但“选择”链接按钮不起作用……
  • 直接访问文件存储库时，状态栏鼠标悬停的图像缩略图文件名有效。当单击缩略图并显示预览窗口时，状态栏也会像应该的那样被移除。出于某种原因，当在模态窗口中使用时，这两个功能都不起作用。
  • ASP 文本框的 contentEditable=”false” 属性仅在 IE 中有效。Firefox 允许手动编辑该值……（实际上无关紧要，因为 Firefox 无法显示模态窗口……）

Internet Explorer

  • IE 可以使用模态窗口。
  • 如前所述，鼠标悬停在模态窗口中不起作用。
  • 图像缩略图弹出窗口不会隐藏状态栏。
  • 当单击目录树中的节点时，如果模态窗口在最初加载和单击之间被拖到屏幕的其他位置，它会“跳”到我屏幕的左侧（未在我的机器以外的其他地方进行测试……）。

错误/行为

  • JavaScript 图像预览弹出窗口是围绕 100 x 100 像素的图像编写的。如果图像接近该尺寸，例如 96 x 96 像素，它会显示在预览窗口中，但不会像应该的那样居中。再说一次，我**远非** JavaScript 程序员。
  • 我选择在当前选择的目录中没有当前选定类型文件时让 DataGrid 为空。这会导致显示标题文本，但没有行，并且显示一个“1”。这个“1”表示它是 DataGrid 的第一页。这是因为我对 DataGrid 启用了分页。更美观的处理此行为的方法是将 DataGrid 的 DataSource 设置为 null，然后调用 DataBind 使其不显示。然后，您可以显示一条消息，说明目录中没有文件或类似内容。

要实现这一点的一个简单方法是这样做

if(dgFiles.Items.Count == 0)
{
     //make the datagrid headers invisible by making it have a null datasrouce...
     dgFiles.DataSource = null;
     dgFile.DataBind();

     //show a message to the user...
     lblMessage.Text = “There are no files in this directory.”;
     lblMessage.Visble = true;
}

致谢

这个项目是许多其他出版物的想法的集合。我扩展了他人的想法，并将它们组合在一起形成了这个项目。以下内容应归功于他们的工作

致谢

本文献给俄亥俄北大学的 David Retterer 教授。在我的本科学习期间，他是我的教授、老板、学术顾问、高级项目主席，以及俄亥俄州 Ada 的市长。Retterer 先生应因他对我的持续成功产生的巨大影响而受到表彰。

© . All rights reserved.