[转帖]FLEX图片预览上传_Android, Python及开发编程讨论区_Weblogic技术|Tuxedo技术|中间件技术|Oracle论坛|JAVA论坛|Linux/Unix技术|hadoop论坛_联动北方技术论坛  
网站首页 | 关于我们 | 服务中心 | 经验交流 | 公司荣誉 | 成功案例 | 合作伙伴 | 联系我们 |
联动北方技术论坛-国内领先的Weblogic、Tuxedo中间件技术论坛
联动北方-国内领先的云技术服务提供商
»  游客             当前位置：  论坛首页 »  自由讨论区 »  Android, Python及开发编程讨论区 »
总帖数
1
每页帖数
101/1页1
返回列表
0
发起投票  发起投票 发新帖子
查看: 3452 | 回复: 0   主题： [转帖]FLEX图片预览上传        下一篇 
Leon
注册用户
等级：少校
经验：1436
发帖：116
精华：7
注册：2013-1-4
状态：离线
发送短消息息给Leon 加好友    发送短消息息给Leon 发消息
发表于： IP：您无权察看 2013-1-10 9:50:29 | [全部帖] [楼主帖] 楼主

这些天正在研究flex图片预览上传功能，于是找了一些资料进行了整理，形成了比较完整的示例，在此给自己留下参考资料。

       需要以下两个jar包：commons-fileupload-1.2.jar和commons-io-1.4.jar

       上代码，flex代码

      

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
  3.  layout="absolute" 
  4.  xmlns="*" 
  5.  creationComplete="init();"> 
  6.  <mx:Script> 
  7.  <![CDATA[ 
  8.  import flash.events.*; 
  10.  import mx.controls.Alert; 
  11.  import mx.events.CloseEvent; 
  12.  import mx.managers.CursorManager; 
  14.  private var file:FileReference; 
  15.  private var byteArray:ByteArray; 
  16.  private var bitmapData:BitmapData; 
  17.  private var loader:Loader=new Loader(); 
  19.  private function init():void 
  20.  { 
  21.  Security.allowDomain("*"); 
  22.  file=new FileReference(); 
  23.  file.addEventListener(Event.COMPLETE, fileReferenceCompleteHandler); 
  24.  file.addEventListener(Event.SELECT, fileReferenceSelectHandler); 
  25.  } 
  27.  //选择上传的图片 
  28.  private function choose():void 
  29.  { 
  30.  var imageTypes:FileFilter=new FileFilter("Images (*.jpg, *.jpeg, *.png)", "*.jpg;*.jpeg;*.png"); 
  31.  var allTypes:Array=new Array(imageTypes); 
  32.  file.browse(allTypes); 
  33.  // file.browse(); 
  34.  } 
  36.  private function toUpload():void 
  37.  { 
  38.  if (bitmapData == null) 
  39.  { 
  40.  Alert.show("请您先选择要上传的图片"); 
  41.  } 
  42.  else 
  43.  { 
  44.  Alert.show("上传 " + file.name + " (共 " + Math.round(file.size) + " 字节)?", "确认上传", Alert.YES | Alert.NO, null, proceedWithUpload); 
  45.  } 
  46.  } 
  48.  //监听文件上传状态 
  49.  private function onProgress(e:ProgressEvent):void 
  50.  { 
  51.  lbProgress.text=" 已上传 " + e.bytesLoaded + " 字节，共 " + e.bytesTotal + " 字节"; 
  52.  var proc:uint=e.bytesLoaded / e.bytesTotal * 100; 
  53.  bar.setProgress(proc, 100); 
  54.  bar.label="当前进度: " + " " + proc + "%"; 
  55.  if (e.bytesLoaded == e.bytesTotal) 
  56.  { 
  57.  CursorManager.removeBusyCursor(); 
  58.  } 
  59.  } 
  61.  //上传图片到服务器 
  62.  private function proceedWithUpload(e:CloseEvent):void 
  63.  { 
  64.  if (e.detail == Alert.YES) 
  65.  { 
  66.  //进度监听 
  67.  file.addEventListener(ProgressEvent.PROGRESS, onProgress); 
  68.  var request:URLRequest=new URLRequest("http://localhost:8080/upload_1/servlet/upload"); 
  69.  //设置鼠标忙状态 
  70.  CursorManager.setBusyCursor(); 
  71.  try 
  72.  { 
  73.  file.upload(request); 
  74.  Alert.show("恭喜你，上传成功"); 
  75.  } 
  76.  catch (error:Error) 
  77.  { 
  78.  Alert.show("上传失败"); 
  79.  trace("上传失败"); 
  80.  } 
  81.  
  82.  } 
  83.  } 
  85.  //上传完成调用 
  86.  private function completeHandle(event:Event):void 
  87.  { 
  88.  Alert.show("恭喜你，上传成功"); 
  89.  } 
  91.  //载入本地图片 
  92.  private function fileReferenceCompleteHandler(e:Event):void 
  93.  { 
  94.  byteArray=file.data; 
  95.  loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderCompleteHandler); 
  96.  loader.loadBytes(byteArray); 
  97.  } 
  99.  //图片载入完成显示在预览框中 
  100.  private function loaderCompleteHandler(e:Event):void 
  101.  { 
  102.  var bitmap:Bitmap=Bitmap(loader.content); 
  103.  bitmapData=bitmap.bitmapData; 
  104.  img.source=bitmap; 
  105.  } 
  107.  //选择文件动作监听 
  108.  private function fileReferenceSelectHandler(e:Event):void 
  109.  { 
  110.  file.removeEventListener(ProgressEvent.PROGRESS, onProgress); 
  111.  file.load(); 
  112.  } 
  113.  ]]> 
  114.  </mx:Script> 
  116.  <mx:Canvas width="100%" height="100%" x="10" y="10" fontSize="15"> 
  117.  <mx:Panel width="469" 
  118.  height="392" 
  119.  verticalGap="0" 
  120.  horizontalAlign="left" 
  121.  verticalAlign="top" 
  122.  x="0" 
  123.  y="0" 
  124.  layout="absolute"> 
  125.  <mx:Image id="img" width="400" height="300" x="36" y="44"/> 
  126.  </mx:Panel> 
  127.  <mx:Button label="选择文件" click="choose();" x="500" y="400"/> 
  128.  <mx:VBox id="shangchuan" width="100%" horizontalAlign="center" visible="true"> 
  129.  <mx:Label id="lbProgress" text="上传"/> 
  130.  <mx:ProgressBar id="bar" 
  131.  labelPlacement="bottom" 
  132.  minimum="0" 
  133.  visible="true" 
  134.  maximum="100" 
  135.  label="当前进度: 0%" 
  136.  direction="right" 
  137.  mode="manual" 
  138.  width="200"/> 
  139.  <mx:Button label="上传文件" click="toUpload();"/> 
  140.  </mx:VBox> 
  141.  </mx:Canvas> 
  142. </mx:Application> 

后台servlet:

  1. /** 
  2.  * get及post提交方式 
  3.  * 
  4.  * @param request 
  5.  * @param response 
  6.  * @throws ServletException 
  7.  * @throws IOException 
  8.  */ 
  9.  @SuppressWarnings({ "rawtypes", "unchecked" }) 
  10.  public void doGetAndPost(HttpServletRequest request, 
  11.  HttpServletResponse response) throws ServletException, IOException { 
  12.  request.setCharacterEncoding("GBK"); 
  13.  // 文件存放的目录 
  14.  //C:\\Documents and Settings\\jnzbht\\Workspaces\\MyEclipse 8.5\\upload\\WebRoot\\upload\\ 
  15.  File tempDirPath = new File(request.getSession().getServletContext().getRealPath("/")+ "\\upload\\"); 
  16.  if (!tempDirPath.exists()) { 
  17.  tempDirPath.mkdirs(); 
  18.  } 
  19.  
  20.  // 创建磁盘文件工厂 
  21.  DiskFileItemFactory fac = new DiskFileItemFactory(); 
  22.  
  23.  // 创建servlet文件上传组件 
  24.  ServletFileUpload upload = new ServletFileUpload(fac); 
  25.  
  26.  //使用utf-8的编码格式处理数据 
  27.  upload.setHeaderEncoding("utf-8"); 
  28.  
  29.  // 文件列表 
  30.  List fileList = null; 
  31.  
  32.  // 解析request从而得到前台传过来的文件 
  33.  try { 
  34.  fileList = upload.parseRequest(request); 
  35.  } catch (FileUploadException ex) { 
  36.  ex.printStackTrace(); 
  37.  return; 
  38.  } 
  39.  // 保存后的文件名 
  40.  String imageName = null; 
  41.  // 便利从前台得到的文件列表 
  42.  
  43.  Iterator<FileItem> it = fileList.iterator(); 
  44.  
  45.  
  46.  while (it.hasNext()) { 
  47.  
  48.  FileItem item = it.next(); 
  49.  // 如果不是普通表单域，当做文件域来处理 
  50.  if (!item.isFormField()) { 
  51.  //生成四位随机数 
  52.  Random r = new Random(); 
  53.  int rannum = (int) (r.nextDouble() * (9999 - 1000 + 1)) + 1000; 
  54.  
  55.  imageName = DateUtil.getNowStrDate() + rannum 
  56.  + item.getName(); 
  57.  
  58.  BufferedInputStream in = new BufferedInputStream(item 
  59.  .getInputStream()); 
  60.  BufferedOutputStream out = new BufferedOutputStream( 
  61.  new FileOutputStream(new File(tempDirPath + "\\" 
  62.  + imageName))); 
  63.  Streams.copy(in, out, true); 
  64.  
  65.  } 
  66.  } 
  67.  } 

源码见附件

访问路径为

http://localhost:8080/upload_1/upload/upload.html


本文出自 “GUI” 博客，请务必保留此出处http://xingfudehunpo.blog.51cto.com/1843260/1112981


赞(0)    操作        顶端 
总帖数
1
每页帖数
101/1页1
返回列表
发新帖子
请输入验证码： 点击刷新验证码
您需要登录后才可以回帖 登录 | 注册
技术讨论

Weblogic中间件技术论坛

 |

Tuxedo中间件技术论坛

 |

数据库论坛

 |

Java论坛

 |

Linux/unix论坛

 |

网站地图


Powered by LandingBJ     @ 2008-2018     联动北方   
京ICP证号090597    京ICP备案09017624号    京公网安备110112000093号    
400-810-2327     Email：service@landingbj.com   

Powered by landingbj @ 2008-2015 联动北方
京ICP证号090597 京ICP备案09017624号 京公网安备110112000093号
86-27-87056338 Email：service@landingbj.com