自己动手打造ajax图片上传(网上没有的)

图片上传新篇章：从零开始打造专属插件

在寻找图片上传插件的过程中，我发现市面上的选择似乎并不能完全满足我的需求。于是，我决定亲自编写一款符合我个人需求的图片上传插件。如果你也有同样的需求，或许你可以参考我的经验。

方法一的实践：jQuery的魔法

我尝试仅使用jQuery代码，无需第三方插件。这是一个基础的HTML结构和相应的jQuery脚本：

```html

上传图片

```

然后，我使用了jQuery的ajax方法来处理图片上传。这种方法的一个明显缺点是不支持IE9及以下版本，因为IE这些版本不支持FormData对象。所以如果你需要支持这些浏览器，你可能需要考虑其他方法。

方法二的：利用ajaxfileupload.js插件

接下来，我尝试使用ajaxfileupload.js插件来处理图片上传。HTML结构如下：

```html

使用ajax上传

$web.site$web.tpladminht/images/lb_head.jpg" 30px" 30px" class="img_upload" id="img" />

```

随着科技的不断发展，文件上传已成为日常生活中不可或缺的一部分。今天，我们将介绍一种支持多种浏览器的文件上传方法，尤其适用于IE8/9、谷歌等浏览器，兼容性更佳，推荐使用此方法。

我们来看前端文件上传的代码实现。使用`ajaxFileUpload`函数，可以轻松实现文件的异步上传。这个函数接收两个参数：`file_id`和`img_id`。`file_id`是文件上传域的ID，而`img_id`则是用于显示上传图片的元素ID。

在`ajaxFileUpload`函数中，我们使用了jQuery的`ajaxFileUpload`插件来实现文件的上传。其中，`url`参数指定了服务器端接收文件上传的请求地址。`secureuri`参数设置为`false`，表示不需要安全协议。`fileElementId`参数则是文件上传域的ID。返回值类型为`json`，便于处理服务器返回的响应数据。

当服务器成功响应时，我们会进入`suess`处理函数。如果数据中的`error`值为0，说明上传成功，我们会将上传的图片URL设置到指定的元素中。否则，会弹出提示框显示服务器返回的错误消息。

而在服务器端，我们使用了ASP.NET来处理文件上传。在`Upload`类中，我们实现了`IHttpHandler`接口。在`ProcessRequest`方法中，我们首先获取了文件保存目录的路径和URL。然后，通过判断上传的文件类型是否在允许的扩展名列表中，以及文件大小是否超过最大限制来验证上传的文件。

如果文件验证通过，我们将文件保存到指定的目录中，并返回相应的信息给前端。如果验证失败，我们会弹出提示框显示相应的错误信息。

这种文件上传方法不仅简单易用，而且兼容性强，能够很好地适应不同的浏览器。服务器端也进行了严格的验证和处理，确保文件的安全性和完整性。如果你正在寻找一种稳定、可靠的文件上传方法，不妨试试这种方法吧！

```csharp

//文件处理模块启动

当接收到上传的图像文件时，首先进行必要的检查。

String 文件名 = 图像文件.文件名; //获取上传文件的名称

String 文件扩展名 = Path.GetExtension(文件名).ToLower(); //获取文件的扩展名并转为小写

//检查文件大小与扩展名是否符合要求

如果 (图像文件.输入流为空 或者 图像文件.输入流长度 > 最大允许大小) {

展示错误信息：“上传的文件大小超过了限制。”

}

如果 (文件扩展名为空 或者 不在允许的扩展名列表中) {

展示错误信息：“上传的文件扩展名是不允许的扩展名。只允许 [允许的扩展名字符串] 格式。”

}

//构建保存路径

dirPath += 目录名称 + "/";

saveUrl += 目录名称 + "/";

如果 (目录不存在) {

创建目录; //像魔术师一样，凭空创建存放文件的文件夹

}

//构建带有日期的子目录并创建之，便于后续查找管理

String 当前日期 = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo); //获取今天的日期字符串

dirPath += 当前日期 + "/";

saveUrl += 当前日期 + "/";

如果 (日期目录不存在) {

创建日期目录; //继续创造奇迹，添加新的目录层次

}

//赋予文件一个新的名字并保存

String 新文件名 = DateTime.Now.ToString("yyyyMMddHHmmss_ffff") + 文件扩展名; //独特的文件名，确保独一无二

String 文件路径 = 目录路径 + 新文件名; //构建文件的完整路径

图像文件.保存至(文件路径); //将文件保存到指定路径

String 文件 = 保存 + 新文件名; //构建文件的访问链接

//创建一个哈希表并返回成功信息，包括文件访问链接等

Hashtable 数据表 = 新建一个Hashtable对象;

数据表["错误"] = 0; //标记操作成功

数据表["链接"] = 文件; //提供文件的访问链接信息

响应头部设置内容类型为UTF-8编码的HTML文本，然后返回JSON格式的响应信息。结束响应流程。

//错误展示方法，当发生错误时调用此方法展示错误信息并结束响应流程。当发生错误时，返回带有错误信息的JSON格式响应。

private void 展示错误信息(信息内容) {

Hashtable 错误数据表 = 新建一个Hashtable对象;

错误数据表["错误"] = 1; //标记操作失败

错误数据表["信息"] = 信息内容; //提供错误信息内容

响应头部设置内容类型为UTF-8编码的HTML文本，返回JSON格式的带有错误信息的响应信息。结束响应流程。

}

//询问是否可以重复使用此模块时，总是返回“可以”。因为我们的服务始终欢迎您的再次使用！