java swf 上传文件_Flash上传组件之SWFUpload文件上传

SWFUpload是一个客户端文件上传工具,最初由Vinterwebb.se开发,它通过整合Flash与JavaScript技术为WEB开发者提供了一个具有丰富功能继而超越传统标签的文件上传模式。

由于SWFUpload是falsh和JavaScript结合开发的,这可能在HTML5流行的今天可能不太适合。而且SWFUpload和官网早就不更新了。推荐使用另一个插件Plupload,这个插件会自动检测当前浏览器适合的上传方式:HTML5、Flash、Silverlight。

SWFUpload的主要特点:

* 可以同时上传多个文件;

* 类似AJAX的无刷新上传;

* 可以显示上传进度;

* 良好的浏览器兼容性;

* 兼容其他JavaScript库 (例如:jQuery, Prototype等);

* 支持Flash 8和Flash 9;

SWFUpload不同于其他基于Flash构建的上传工具,它有着优雅的代码设计,开发者可以利用XHTML、CSS和JavaScript来随心所欲的定制它在浏览器下的外观;它还提供了一组简明的JavaScript事件,借助它们开发者可以方便的在文件上传过程中更新页面内容来营造各种动态效果。

二、一般的开发流程

1、引入对应的JS和CSS文件。

2、实例化SWFUpload对象,进行对象的初始化的配置。

3、浏览网页,打开并选取要上传的文件。

4、后台接收前台传送的文件流,进行处理。

5、后台返回对应的参数并进行前台提示。

这是我做的一个例子效果如下:

例一:

dd413b03bddcdf3358e088fe97a82c06.png

例二:

833d1b5e435bb6cd548498f8e45c32cc.png

例一的代码:

index.jsp

48304ba5e6f9fe08f3fa1abda7d326ab.png

swfUpload上传文件(Java和Jquery)

48304ba5e6f9fe08f3fa1abda7d326ab.png

swfuploadHandlers.js

48304ba5e6f9fe08f3fa1abda7d326ab.png

/**

* Created by zhang on 14-2-25.

*/

var queueErrorArray;

var setting = {

upload_url: "/upload", //后台处理的程序路径

flash_url: "swfupload/swfupload.swf", //swf程序路径

file_types: "*.jpg;*.png;*.gif;*.mp4;*.wmv", //允许上传文件种类

file_types_description: "Web Image", //对上传文件的描述

file_size_limit: "200MB", //文件上传的大小单位默认为KB

file_upload_limit: 0,

//debug

debug: false,

//handlers

file_dialog_start_handler: fileDialogStar, //打开选择对话框触发的事件

file_queued_handler: fileQueued, //把文件加入上传队列触发的事件

file_queue_error_handler: fileError, //文件加入队列错误时触发的事件

file_dialog_complete_handler: fileDialogComplete, //文件选择完成触发的事件

upload_start_handler: uploadStar, //文件上传触发的事件

upload_progress_handler: uploadprogress, //上传中触发的事件

upload_complete_handler: uploadComplete, //上传完成触发的事件

upload_success_handler: uploadSuccess, //上传成功时触发的事件

//button

button_placeholder_id: "swfPlaceHold",

button_text: "请选择上传文件",

button_width: 270,

button_height: 20,

button_cursor: SWFUpload.CURSOR.HAND,

button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT

};

var swfup = new SWFUpload(setting);

/*********************************************handler************************************/

/**

* 打开文件对话框时的触发的事件

*/

function fileDialogStar() {

if (queueErrorArray) {

queueErrorArray = null;

}

}

/**

* 文件加入上传队列时触发的事件

* @param 选择上传的文件对象

*/

function fileQueued(file) {

var swfup = this; //当前的swfupload实例对象

var listItem = "

";

listItem += "文件:" + file.name + "(" + Math.round(file.size / 1024) + "KB)";

listItem += "

listItem += "

";

$("#fileList").append(listItem);

//按钮的取消事件

$("li#" + file.id + " #cancle").click(function (e) {

swfup.cancelUpload(file.id);

$("li#" + file.id).remove();

});

}

/**

* 文件加入队列错误触发的事件

* @param file上传的文件对象

* @param errorCode返回的错误代码

* @param msg 错误信息

*/

function fileError(file, errorCode, msg) {

//错误队列数组

if (!queueErrorArray) {

queueErrorArray = [];

}

errorFile = {

file: file,

code: errorCode,

error: ''

};

switch (errorCode) {

case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:

errorFile.error = '文件大小超出限制';

break;

case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:

errorFile.error = '文件类型不允许';

break;

case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED:

errorFile.error = '超出文件数量限制.';

break;

case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:

errorFile.error = '你选择的文件是空的';

break;

case SWFUpload.UPLOAD_ERROR.HTTP_ERROR:

errorFile.error = '服务器出错';

break;

case SWFUpload.UPLOAD_ERROR.MISSING_UPLOAD_URL:

errorFile.error = '程序没有设置upload_url属性';

break;

case SWFUpload.UPLOAD_ERROR.IO_ERROR:

errorFile.error = '读取或传输文件时发生错误';

break;

case SWFUpload.UPLOAD_ERROR.ZERO_BYTE_FILE:

errorFile.error = '文件为空文件';

break;

case SWFUpload.UPLOAD_ERROR.SECURITY_ERROR:

errorFile.error = '上传受到了安全方面的限制';

break;

case SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED:

errorFile.error = '上传出现错误';

break;

default :

errorFile.error = '上传文件出错,错误代码:' + errorCode;

break;

}

queueErrorArray.push(errorFile);

}

/**

* 选择文件对话框关闭时触发,报告所选文件个数、加入上传队列文件数及上传队列文件总数

* @param numSelected 选择的文件数目

* @param numQueued 加入队列的文件数目

* @param numTotalInQueued 上传文件队列中文件总数

*/

function fileDialogComplete(numSelected, numQueued, numTotalInQueued) {

if (queueErrorArray && queueErrorArray.length) { //如果有错误文件

var table = $('

文件大小
');

for (var i in queueErrorArray) {

var tr = $('

');

var info = '

' + queueErrorArray[i].file.name + ' (' + queueErrorArray[i].error + ')'

+ '

' + queueErrorArray[i].file.size + 'bytes';

table.append(tr.append(info));

}

$('body').append(table);

} else {

this.startUpload(); //开始上传

}

}

/**

* 文件上传触发的事件

* @param file一个文件对象

*/

function uploadStar(file) {

if (file) {

$('#fileList li#' + file.id).find('p#statue').text("上传中。。。。。");

$('#fileList li#' + file.id).find('p#progress').width("0%");

}

}

/**

*文件上传过程Flash定时调用的方法用来返回当前上传的进度

* @param file 上传文件对象

* @param byteCompleted 上传的字节

* @param byteTotal 总的字节

*/

function uploadprogress(file, byteCompleted, byteTotal) {

var percentByte = Math.round((byteCompleted / byteTotal) * 100); //当前进度

$('#fileList li#' + file.id).find('span#progressValue').text(percentByte + "%");

$('#fileList li#' + file.id).find('div#progress').css('width', percentByte + '%');

}

/**

* 文件上传完毕并且服务器返回200状态码时触发

* @param file 上传的文件

* @param serverData

* @param response

*/

function uploadSuccess(file, serverData, response) {

var $item = $("#fileList li#" + file.id);

$item.find('div#progress').css('width', '100%');

$item.find('span#progressValue').css('color', 'blue').text('100%');

$item.find('p#statue').html('上传完成!').css('color', 'green');

}

/**

* 在一个上传周期结束后触发(uploadError及uploadSuccess均触发)

* 在此可以开始下一个文件上传(通过上传组件的uploadStart()方法)

* @param file 上传完成的文件对象

*/

function uploadComplete(file) {

//判断队列中还有没有文件

if (this.getStats().files_queued > 0) {

this.startUpload();

} else {

this.cancelUpload(this.fileProgressID);

$("#fileList li").remove();

}

}

/********************************按钮事件绑定*********************************************/

$('#submit').click(function () {

swfup.startUpload();

});

48304ba5e6f9fe08f3fa1abda7d326ab.png

后台对应处理的Servlet

48304ba5e6f9fe08f3fa1abda7d326ab.png

package com.zxd.tool;

import org.apache.commons.fileupload.FileItem;

import org.apache.commons.fileupload.FileUploadException;

import org.apache.commons.fileupload.disk.DiskFileItemFactory;

import org.apache.commons.fileupload.servlet.ServletFileUpload;

import javax.servlet.ServletConfig;

import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.io.*;

import java.util.List;

import java.util.UUID;

/**

* Created by zhang on 14-2-25.

*/

@WebServlet("/upload")

public class Upload extends HttpServlet {

private File tempDir; //临时路径

private File saveDir; //保存路径

/**

* servlet初始化事件

*

* @param config

* @throws ServletException

*/

public void init(ServletConfig config) throws ServletException {

String uploadPath = config.getServletContext().getRealPath("/");

StringBuffer sb = new StringBuffer(uploadPath);

saveDir = new File(sb.append("\\upload").toString());

tempDir = new File(sb.append("\\temp").toString());

if (!saveDir.exists()) {

saveDir.mkdir();

}

if (!tempDir.exists()) {

tempDir.mkdir();

}

}

public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {

this.doPost(request, response);

}

public void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {

DiskFileItemFactory factory = new DiskFileItemFactory();

factory.setSizeThreshold(1 * 1024 * 1024); //设置缓冲区大小

factory.setRepository(tempDir); //设置临时保存目录

ServletFileUpload sfu = new ServletFileUpload(factory); //Servelt文件上传对象

sfu.setFileSizeMax(200 * 1024 * 1024); //200M

sfu.setHeaderEncoding("utf-8");

List list = null;

try {

list = sfu.parseRequest(request); //得到文件

} catch (FileUploadException e) {

e.printStackTrace();

}

int size = list.size();

for (int i = 0; i < size; i++) {//循环保存文件

FileItem file = list.get(i);

if (file.isFormField()) { //如果是表单字段

String name = file.getFieldName(); // 获得该字段名称

String value = file.getString("utf-8"); //获得该字段值

} else {

String extName = file.getName().substring( //得到扩展名

file.getName().lastIndexOf("."));

String fname = UUID.randomUUID()+extName;

try {

file.write(new File(saveDir, fname)); // 写入文件

} catch (Exception e) {

e.printStackTrace();

}

}

}

}

48304ba5e6f9fe08f3fa1abda7d326ab.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值