使用SWFUpload实现多文件无刷新上传

"SWFUpload1是一个用于实现多文件无刷新上传的技术，它利用Flash技术来实现客户端的文件选择和上传。此技术适用于Struts、Servlet、JSP等多种服务器端框架，本示例中主要使用Struts1.x进行后端处理。SWFUpload的核心文件包括样式、图片、JavaScript库和Flash文件，以及处理各种上传事件的JavaScript文件。通过创建文件队列并逐一上传，SWFUpload提供了一种高效、用户友好的上传体验。客户端的HTML页面（sample.html）与JavaScript配合，调用SWFUpload的相关函数来实现上传功能。" 在SWFUpload的实现过程中，以下是一些关键知识点： 1. **目录结构**： - `SWFUpload`：包含所有核心文件，包括JavaScript、CSS、图片和Flash文件。 - `css`：存放样式表，允许自定义上传界面的样式。 - `images`：存放与上传相关的图片资源。 - `jslib`：存放JavaScript库，如`swfupload.js`、`swfupload.queue.js`和`fileprogress.js`，分别用于核心功能、文件队列管理和进度显示。 - `handlers.js`：定义上传过程中的事件处理器，例如开始上传、取消、暂停等。 - `swfupload.swf`：Flash文件，用于显示上传按钮。 - `sample.html`：演示示例，展示如何使用SWFUpload进行文件上传。 2. **客户端实现**： - `sample.html`：包含HTML和JavaScript代码，引入必要的CSS和JS库。`<script>`标签加载了SWFUpload的各个组件，并定义了一个全局变量`swfUpload`用于实例化SWFUpload对象。 - `JavaScript`：设置SWFUpload实例，配置参数如上传URL、文件类型限制、文件大小限制等，并注册事件处理函数。例如，`SWFUpload.prototype.uploadStart_handler`处理开始上传的事件，`SWFUpload.prototype.fileQueued_handler`则处理文件加入队列的事件。 3. **文件队列管理**： - `swfupload.queue.js`：管理用户选择的多个文件，将它们组织成队列，按照顺序逐个上传，确保上传流程有序进行。 4. **服务器端处理**： - 使用Struts1.x作为后端框架，需要编写Action来接收和处理上传的文件。这通常涉及到文件的接收、存储以及可能的数据验证。 5. **事件处理**： - `handlers.js`中的事件处理函数可以根据需求定制，例如，可以通过`SWFUpload.prototype.uploadComplete_handler`处理每个文件上传完成的事件，或者`SWFUpload.prototype.fileProgress_handler`来更新上传进度。 6. **Flash交互**： - Flash文件`swfupload.swf`在页面上显示为上传按钮，用户点击后启动文件选择对话框，选择的文件会被添加到队列中。 7. **兼容性考虑**： - 虽然SWFUpload利用Flash实现，但在移动设备或不支持Flash的现代浏览器中可能无法正常工作，因此在设计时需要考虑使用HTML5的File API作为备选方案。 SWFUpload是一个功能强大的多文件上传解决方案，通过JavaScript和Flash实现了无刷新上传，结合服务器端的处理，可以为用户提供流畅的文件上传体验。在实际应用中，开发者需要根据具体需求对配置和事件处理进行定制。