您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 项目/工程管理 > swfupload2.2.0中文使用手册和攻略教程
SWFUploadSWFUpload最初是由Vinterwebb.se开发的一个客户端的上传工具.它结合了FLASH和JavaScript的功能,以提供一种超越了传统的浏览器中inputtype=file/标签提供的文件上传功能。SWFUpload提供的主要功能:在文件选择对话框中能够进行文件多选页面无刷新的上传提供上传进度的事件回调,实时显示上传进度良好的浏览器兼容性采用了命名空间以兼容其它JS的库(例如jQuery,Prototype,等等)对FLASH8和FLASH9播放器的支持对FLASH9和FLASH10播放器的支持(V2.2.0版本放弃了对Flash8的支持)SWFUpload背后的设计思想和其它基于Flash的上传工具是不同的。它将浏览器的中UI交给开发人员来控制。开发人员能够利用XHTML,CSS,Javascript来定制符合他们网站风格的UI上传元素。然后使用它提供的一组简单的JS事件来更新上传状态,开发人员能够利用这些事件来及时更新页面中的上传进度UI。不幸的是FlashPlayer10更严格的安全机制迫使我们不得不将一个FlashButton放入Flash影片中。SWFUpload提供API供开发者通过图片、文字、CSS的方式来自定制更灵活的UI显示。SWFUploadv2SWFUploadv2包含了新的高级功能,改善了稳定性,解决了FlashPlayer中的一些bug,并且提供一套有用的插件。新的功能包括:兼容了FlashPlayer10的安全限制问题在文件上传的同时能够发送额外的POST数据针对每一个文件上传发送POST/GET数据更直观的事件回调动态修改实例设置接收服务端返回的数据非取消形式的停止文件上传自定义上传的顺序支持单文件、多文件的文件的选择文件入队数量,文件上传数量和文件大小的限制更合理地处理0字节的文件针对每个文件在上传前都提供一个最后确认的时间回调解决了v1.0.2版本中未描述到的关于Flash的bug解决的v1.0.2中的bug:在IE中,刷新的时候FLASH无法加载(详细可见我之前的debug过程)在FireFox中,如果窗口的滚动条没有回滚到顶部,那么Flash无法加载Race-conditionswhenfilesarecached兼容ASP.NetFormsSWFUploadv2延续了SWFUpload的设计目标,将UI分离以交给开发人员控制和后续扩展概述传统的HTML上传标准的HTML上传表单为用户提供一个文本框和按钮来选择文件,选中的文件是随着form表单提交的。整个文件上传完成之后,下一个页面才会显示,并且不能对选择的文件做预设的文件检验,例如文件大小限制,文件类型限制。当文件上传时,用户获得的可用的反馈信息很少。传统的HTML上传模式十分简单,线性的,几乎所有浏览器都支持它。SWFUploadSWFUpload使用一个隐藏的Flash影片来控制文件的选择和上传。JavaScript用来激活文件选择对话框。此文件选择对话框是可以设置允许用户选择一个单独的文件或者是多个文件。SWFUpload使用一个Flash影片来控制文件的选择和上传。此FLASH中包含一个用户自定制UI的按钮,点击该按钮能够激活Flash本身的高级文件上传对话框,它能够根据用户的设置来进行单文件或者是多文件的上传。选择的的文件类型也是可以被限制的,因此用户只能选择指定的适当的文件,例如*.jgp;*.gif。提醒:FlashPlayer10的安全机制更严格,类似打开文件上传的对话框的操作,一定需要用户交互才触发,如果用脚本触发,会报#2176的运行时错误。因此V2.2.0版本在SWF中添加了一个可定制的Button让用户交互来打开文件对话框。当选定文件以后,每个文件都会被验证和处理。当Flash上传文件的时候,由开发人员预定义的Javascript事件会被定时触发以便来更新页面中的UI,同时还提供上传状态和错误信息。选定的文件的上传和它所在页面、表单是独立的。每个文件都是单独上传的,这就保证了服务端脚本能够在一个时间点更容易地处理单个文件。虽然Flash提供了上传服务,但是页面并不会提交或者重新载入。相比于标准的HTMLForm,SWFUpload的使用方式更像是AJAX程序,页面中的Form会和FLASH控制的文件上传单独处理。入门SWFUpload并不是拖放式的上传控件,它需要JavaScript和DOM的知识。一些可用的演示展示了它能够完成什么事情以及它是如何完成这些常见的任务。SWFUpload由4部分组成:1.初始化和设置(Javascript)2.JavaScript库:SWFUpload.js3.Flash控制元素:SWFUpload_f8.swf或者SWFupload_f9.swfSWFUpload.swf(V2.2.0版本放弃了对flash8的支持)4.事件处理(Javascript)使用SWFUpload遇到的多数问题是由不正确地设置或者定义了糟糕的处理事件引起的。初始化和设置SWFpload必须在页面中初始化,一般可以在window.onload事件中完成此操作。它的构造函数需要一个Object类型的设置对象。这个设置对象一般是一个直接定义的Object类型变量,直接传递给SWFUpload的构造函数。初始化的SWFUpload对象的引用需要保留下来,因为当显示文件选择对话框和启动文件上传的时候需要这个实例的引用。例如:用直接定义的Object类型变量设置初始化SWFUpload对象varswfu;window.onload=function(){swfu=newSWFUpload({upload_url:::spanSWFUploadButton,file_size_limit:20480});};例如:用存储在变量中的设置对象初始化SWFUpload对象varswfu;window.onload=function(){varsettings_object={upload_url:::spanSWFUploadButton,file_size_limit:20480};swfu=newSWFUpload(settings_object);};JavaScript库该JavaScript库文件(swfupload.js)应该包含在需要上传功能的页面中。当SWFUpload创建完成并能访问它的一系列功能时,开发人员可以来控制此实例。例如:添加SWFUpload.js到页面中scripttype=text/javascriptsrc=例如:根据需要的设置来初始化SWFUpload,同时把它的seleteFiles方法绑定到一个按钮的Click事件上。varswfu=newSWFUpload({upload_url:::spanSWFUploadButton});document.getElementById(BrowseButton).onclick=function(){swfu.selectFiles();};Flash控制元素SWFUploadJavaScript库动态加载Flash控制元素(swfupload.swf)。该Flash控制元素有两个版本。swfupload_f8.swf支持FlashPlayer8以及更高版本。它在提供了更好的兼容性同时牺牲了一些功能。swfupload_f9.swf支持FlashPlayer9.0.28以及更高版本。它在提供了额外的功能同时牺牲了使用FlashPlayer8的用户。Flash控制元素的文件地址在初始化的时候就应该在SWFUpload设置对象中定义。Flash控制元素是一个很小的的Flash影片,它提供了文件浏览、检验和上传功能。它在页面中展现给用户的是一个UI可自定制的按钮,但该Flash会在需要时候通过与Javascript通信来通知浏览器处理更新。事件处理开发人员必须定义一系列JavaScript函数来处理SWFUpload事件回调,当一些不同的重要事件发生的时候,这些函数会被触发。通过处理SWFUpload的事件,开发人员能够提供关于上传进度、出错信息以及上传完成等的信息反馈。例如:swfupload的处理事件和初始化//uploadStart处理事件。该函数变量在设置对象中指定给了upload_start_handler属性。varuploadStartEventHandler=function(file){varcontinue_with_upload;if(file.name===theskyisblue){continue_with_upload=true;}else{continue_with_upload=false;}returncontinue_with_upload;};//uploadSuccess处理事件。该函数变量在设置对象中指定给了upload_success_handler属性。varuploadSuccessEventHandler=function(file,server_data){alert(Thefile+file.name+hasbeendeliveredtotheserver.);alert(Theserverrespondedwith+server_data);};//创建SWFUpload实例,设置事件回调函数varswfu=newSWFUpload({upload_url:::20480,upload_start_handler:uploadStartEventHandler,upload_success_handler:uploadSuccessEventHandler});SWFUploadJavaScript对象构造函数SWFUpload(settingsobject)返回:一个SWFUpload实例varswfupload_instance=newSWFUpload(settings_object);全局变量和常量SWFUpload定义了一些全局变量和常量,这对SWFUpload的高级应用程序和处理错误都是很有用的,它们都是只读的。SWFUpload.instancesSWFUpload.instances是一个存储了页面中所有SWFUpload实例引用的数组。Flash播放器依靠这个数组来调用正确的处理事件。该数组是由movieName属性来索引的关联数组。例如:SWFUpload.instances.SWFUpload_0访问的是第一个实例引用。注意:SWFUpload.instances不是一个真正的JavaScript数组,实际上它是一个对象(关联数组)。SWFUpload.movieCountSWFUpoad.movieCount是一个全局变量,用于记录页面中的SWFUpload
本文标题:swfupload2.2.0中文使用手册和攻略教程
链接地址:https://www.777doc.com/doc-2850939 .html