flex上传组建

1.java后端的servlet:

FileUploadServlet.java

package com.topinfo.upload;

import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.Iterator;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
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 org.springframework.stereotype.Service;
@Service
public class FileUploadServlet extends HttpServlet {
	/**
	 * 
	 */
	private static final long serialVersionUID = 2713969028284025936L;
	// 限制文件的上传大小
	private int maxPostSize = 100 * 1024 * 1024;

	public FileUploadServlet() {
		super();
	}

	public void destroy() {
		super.destroy();
	}
	private String uploadPath="";
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		int status = 0;
		// 定义文件的上传路径
		uploadPath = this.getServletConfig().getServletContext()
				.getRealPath("/")
				+ "\\upload\\";
		// 得到用户需要保存的服装的id
		String dressId = request.getParameter("dressID");
//		System.out.println(dressId);

		// 保存文件到服务器中
		response.setContentType("text/html; charset=UTF-8");
		DiskFileItemFactory factory = new DiskFileItemFactory();
		factory.setSizeThreshold(4096);
		ServletFileUpload upload = new ServletFileUpload(factory);
		upload.setSizeMax(maxPostSize);
		try {
			List fileItems = upload.parseRequest(request);
			Iterator iter = fileItems.iterator();
			while (iter.hasNext()) {
				FileItem item = (FileItem) iter.next();
				if (!item.isFormField()) {
					String name = item.getName();
					name = request.getParameter("filename");
					//System.out.println(name);
					try {
						item.write(new File(uploadPath + name));
					} catch (Exception e) {
						e.printStackTrace();
					}
				}
			}
			
		} catch (FileUploadException e) {
			e.printStackTrace();
			status = -1;
		}
		String show=  "";
		if(status==0){ 
			show="企业概述图片上传成功!";
		}else if(status==1){
			show="企业概述图片上传失败!";
		}
		  PrintWriter out = response.getWriter();
          out.print(show);
          out.close();
		
	}

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

	public void init() throws ServletException {
		// Put your code here
	}
	public boolean delImge(String value){
		boolean b = true;
		try{
			String path = this.getClass().getResource("/").toString();
			path = path.substring(path.indexOf("file:/")+6,path.indexOf("WEB-INF"));
			path+="upload/";
			File file = new File(path + value);
			if(file!=null&&file.exists()){
				file.delete();
			}else{
				b = false;
			}
		}catch(Exception e){
			System.out.println(e);
			b = false;
		}
		return b;
	}
}

2.flex端的组建：

文件upLoader.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
		  xmlns:s="library://ns.adobe.com/flex/spark" 
		  xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="module1_creationCompleteHandler(event)" xmlns:components="com.topinfo.components.*">
	<fx:Script>
		<![CDATA[
			import flash.globalization.DateTimeFormatter;
			
			import mx.controls.Alert;
			import mx.controls.DateField;
			import mx.core.FlexGlobals;
			import mx.events.CloseEvent;
			import mx.events.FlexEvent;
			import mx.formatters.DateFormatter;
			import mx.rpc.events.FaultEvent;
			import mx.rpc.events.ResultEvent;
			
			import spark.formatters.DateTimeFormatter;
			
			private var file:FileReference;
			private var _filepath:String;
			private var filename:String;
			
			public function set filepath(value:String):void{
				this._filepath = value;
				getfilepath = "http://"+FlexGlobals.topLevelApplication.fullUrl+"/fysupervise/upload/"+value;
				imgshow.source = getfilepath;
			}
			
			public function get filepath():String{
				if(_filepath!=null){
					getfilepath = "http://"+FlexGlobals.topLevelApplication.fullUrl+"/fysupervise/upload/"+_filepath;
					imgshow.source = getfilepath;
				}
				return this._filepath;
			}
			
			[Bindable]
			private var getfilepath:String;
			
			
			protected function module1_creationCompleteHandler(event:FlexEvent):void
			{
				// TODO Auto-generated method stub
				Security.allowDomain("*");
				file = new FileReference();  
				file.addEventListener(ProgressEvent.PROGRESS, onProgress);  
				file.addEventListener(Event.SELECT, onSelect);
				file.addEventListener(DataEvent.UPLOAD_COMPLETE_DATA,show);
			}
			
			//---------------------上传部分开始--------------------
			private function onSelect(e:Event): void{  
				proceedWithUpload();
				//Alert.show("上传 " + file.name + " (共 "+Math.round(file.size)+" 字节)?",  
				//	"确认上传",  
				//	Alert.YES|Alert.NO,  
				//	null,  
				//	proceedWithUpload);  
			}  
			
			private function onProgress(e:ProgressEvent): void{  
				var proc: uint = e.bytesLoaded / e.bytesTotal * 100;  
				bar.setProgress(proc, 100);  
				bar.label= "当前进度: " + " " + proc + "%";
				if(proc == 100){
					bar.visible = false;
					bar.label= "当前进度: 0%";
					this.filepath = filename;
				}
			}
			
			private function proceedWithUpload(): void{  
				
					filename = createFileName(file.name);
					var request: URLRequest = new URLRequest("http://"+FlexGlobals.topLevelApplication.fullUrl+"/fysupervise/FileUploadServlet?filename="+filename);
					try {  
						file.upload(request);
						bar.visible = true;
					} catch (error:Error) {  
						trace("上传失败");  
					}  
					
				
			}
			
			protected function createFileName(value:String):String{
				var df:DateFormatter = new DateFormatter();
				df.formatString = "YYYYMMDDJJNNSS"
				var lastname:String = value.substr(value.indexOf("."),4);
				var firstname:String = df.format(new Date());
				return firstname+lastname;
			}
			
			protected function add_dwqj_clickHandler(event:MouseEvent):void
			{
				// TODO Auto-generated method stub
				file.browse();
			}
			//---------------------上传部分结束--------------------
			private function show(event:DataEvent):void{
				Alert.show(event.data.toString());
			}
			private function deleteImg():void{
				if(_filepath!=null)
				fileService.delImge(_filepath);
				
			}

			protected function fileService_resultHandler(event:ResultEvent):void
			{
				// TODO Auto-generated method stub
				var b:Boolean = event.result as Boolean;
				if(b){
					Alert.show("删除成功");
					imgshow.source = null;
					_filepath=null;
				}else{
					Alert.show("删除失败");
				}
			}
			private function delFault(event:FaultEvent):void{
				Alert.show("删除失败"+event);  
			}
		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
		<s:RemoteObject id="fileService" destination="fileUploadService" result="fileService_resultHandler(event)"  fault="delFault(event)" />
	</fx:Declarations>
	<s:VGroup horizontalAlign="center" verticalAlign="middle" gap="10">
		<s:SkinnableContainer backgroundColor="#ffffff" width="330" height="228">
			<s:HGroup width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
				<s:Image id="imgshow" source="{getfilepath}" width="305" height="200" />
			</s:HGroup>
		</s:SkinnableContainer>
		<s:Label text="请选择jpg、png格式，且文件尺寸为305×200的图片" />
		<s:HGroup width="100%" height="30" horizontalAlign="center" verticalAlign="middle">
			<mx:ProgressBar id="bar" labelPlacement="bottom" minimum="0" maximum="100" label="当前进度: 0%"     
							direction="right" mode="manual" width="170" visible="false"/>
			<components:functionButton image="/res/images/shanchu.png" imagenormal="/res/images/shanchuhover.png" id="del_dwqj" text="清除" click="deleteImg()" />
			<components:functionButton image="/res/images/queding.png" imagenormal="/res/images/quedinghover.png" id="add_dwqj" text="上传" click="add_dwqj_clickHandler(event)" />
		</s:HGroup>
	</s:VGroup>
</s:Group>

通过这2个文件结合就可以在flex端界面上实现上传功能了，这里给的例子是上传图片示范。