Flex中文件的上传下载

 关键词:文件上传,文件下载,FileReference,FileReferenceList,FileFilter

 

在项目开发过程中,经常会遇到文件上传下载的问题。但在flex中由于安全沙箱的原因,flex程序不能直接访问本地文件。但是flex SDK中提供了FileReference和FileReferenceList两个类,可以通过这两个类来实现,这两个类位于flash.net包中。
一、 文件上传
上传文件flex端处理:
1、上传文件第一步——打开文件。
首先需要创建一个FileReference对象:
private var myFileReference:FileReference = new FileReference();
在FileReference中有一个browse()函数,这个函数的作用就是打开一个windows文件选择框,可以选择需要上传的文件。在打开的文件选择框中可以指定选择文件的类型,这是通过FileFilter来实现的。创建一个FileFilter对象,作为browse函数的参数,这样就可以指定选择文件的类型了:
var imagesFilter:FileFilter = new FileFilter("Images(*.jpg,*.gif,*.png)", "*.jpg;*.gif;*.png");
myFileReference.browse([imagesFilter]);
2、上传文件第二步——上传文件
文件选择了之后会触发Event.SELECT事件,所以需要在myFileReference对象上注册SELECT事件的监听:
myFileReference.addEventListener(Event.SELECT, onSelect);
onSelect是一个监听函数,在这个函数中可以得到选择的文件的名字。由于安全沙箱的原因,只能得到选择的文件名,不能得到完整的文件路径。选择了需要上传的文件后,需要调用upload()函数上传选择的文件:
myFileReference.upload(uploadURL,myFileReference.name);
upload的参数uploadURL是一个URLRequest对象,这个对象指定了上传文件用的URL,myFileReference.name就是选择的文件的文件名。
3、上传文件第三步——上传进度
一般情况下,在上传文件的过程中需要显示一个表示上传进度的进度条,这样可以有一个很好的用户体验。要想显示上传进度,可以有两种方式。第一种就是监听FileReference对象的process事件,在process事件的监听函数中可以得到上传的进度,然后可以设置进度条的进度。第二种方式就是把FileReference对象与进度条对象进行绑定,进度条会自动监听FileReference对象的process事件,来显示上传进度。
4、上传文件第四步——上传结束
有的时候需要在文件上传结束后给用户一个提示,告诉用户文件已经上传结束了。这就必须得对FileReference对象的COMPLETE事件进行监听,当文件上传结束后,会触发COMPLETE事件。用户提示或者文件上传结束后的处理需要在这个事件的监听函数中实现。
文件上传服务器端处理:
FileReference对象的upload函数上传到服务器端的格式如下:
POST /handler.cfm HTTP/1.1
Accept: text/*
Content-Type: multipart/form-data;
boundary=----------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
User-Agent: Shockwave Flash
Host: www.example.com
Content-Length: 421
Connection: Keep-Alive
Cache-Control: no-cache

------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="Filename"

MyFile.jpg
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="photo"; filename="MyFile.jpg"
Content-Type: application/octet-stream

上传文件的内容
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="Upload"

Submit Query
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7—
服务器端只需要解析这个结构,把“上传文件内容”部分解析出来,然后保存成文件就可以了。文件名就是MyFile.jpg。
服务器端java代码:

代码补充说明:
解析request内容,把文件内容解析出来,然后保存成文件,文件名可以从request内容中解析出来。上传文件时如果想控制上传文件的大小的话就设定fileSize变量的值来进行控制。
二、文件下载
文件下载相对来说是比较简单的。只需三步就可以完成。
1、创建一个URLRequest对象
var downLoadURL:URLRequest = new URLRequest();
2、指定下载文件的URL
downLoadURL.url = "http://localhost:8080/FlexRemotObject/download";
3、执行FileReference对象的download函数。download函数的第一个参数就是在1中创建的URLRequest对象,第二个参数是下载的文件的默认文件名。
myFileReference.download(downLoadURL,"image.png");
以上三步执行完毕后,FileReference对象会打开一个文件保存对话框,指定一个路径后,点击保存按钮,文件就下载完成了。

文件下载Java端代码:


结束语:如果想实现同时上传多个文件,那么可以使用FileReferenceList类来实现。

完整代码下载地址:http://download.csdn.net/source/1815266

### 应用场景介绍 该应用结合了FastAPI作为后端服务和Flet作为前端框架,实现了一个文件上传系统。用户可以通过前端界面选择多个文件进行上传,而后端负责接收并保存这些文件。具体应用场景包括但不限于: 1. **文档管理系统**:允许用户上传和管理各种类型的文档文件。 2. **媒体库**:支持用户上传图片、视频等多媒体文件。 3. **项目文件存储**:为开发团队提供一个集中的文件存储和分享平台。 4. **个人云存储**:用户可以上传个人文件到云端,方便随时访问和管理。 ### 特色说明 1. **前后端分离架构**: - **FastAPI**:高性能的异步Web框架,用于构建后端API。它提供了简洁的语法和强大的功能,支持自动化的API文档生成。 - **Flet**:一个现代的Python UI框架,允许开发者使用Python编写跨平台的桌面和Web应用程序。Flet提供了丰富的组件和灵活的布局选项,使得前端开发更加高效。 2. **文件上传功能**: - **多文件选择**:用户可以通过文件选择对话框一次性选择多个文件进行上传。 - **进度显示**:上传过程中,前端会实时显示每个文件的上传进度,提升用户体验。 - **自动保存**:文件上传完成后,后端会自动将文件保存到指定目录,并返回文件名作为响应。 3. **安全性**: - **环境变量配置**:通过设置环境变量 `FLET_SECRET_KEY` 来保护应用的安全性,避免敏感信息硬编码在代码中。 - **异步处理**:FastAPI的异步特性确保了即使在高并发情况下,服务器也能高效处理文件上传请求,减少资源占用。 4. **易于扩展**: - **模块化设计**:前后端代码分离,便于后续功能的扩展和维护。 - **自动文档**
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值