swfupload(以下簡稱su)遇到的主要問題就是,版本不同造成的極大差異,現在的版本已經到2.1beta。我用的是2.02版
異具體體現在:
lash_url : “../swfupload/swfupload_f8.
swf
”
upload
_url: “../multiuploaddemo/upload
.php”,
function uploadSuccess(fileObj, server_data)
如果flash_url用的是f8.swf
,那麼upload
_url要使用相對SWF
的路徑;如果用的是f9.swf
,那麼upload
_url
要使用相對當前程式頁面(jsp,asp
)的路徑,就是這點,耽誤了我很長時間. 如果要使用server_data傳遞返回值,也必須用f9.swf
,這點也花
了我不少時間. 不管怎樣,su都提供的全部原始碼,有問題可以自己研究,前提是你能像我一樣看的懂,呵呵.
su使用的是flash的上傳功能(Flash.net.FileReference;),還用了ActionScript 和
Flash Player 的容器之間實現直接通訊的應用程式程式設計介面ExternalInterface(詳見後文附錄),
su超級好用,而且功能強大,可以一次上傳多個檔案,能在客戶端檢驗檔案型別和大小,還能在上傳進度中進行控制,能在檔案傳完後得到後臺反饋信
息,有較好的debug對話方塊,比如看看它的高階示例: http://demo.swfupload.org/featuresdemo/index.php
目前唯一不足的可能是對中文檔名支援不好.我研究了半天它的flash as指令碼,都沒弄明白中文問題怎麼改.
它的線上文件: http://demo.swfupload.org/Documentation/
下面具體講講su怎麼用。
假設有一個前臺頁面upload
.asp
,一個後
臺接收檔案的頁面save.asp
,還有su的核心檔案swfupload.js,輔助處理指令碼handlers.js。
1, 這兩個js,網上的原始碼裡就有,核心js不用改. handlers可以直接用,也可以自己寫,看各人本事了.
核心js裡,主要是看SWFUpload.prototype.initSettings 初始化設定,很多引數該怎麼寫,可以參考它.
2, 要在前臺頁面裡呼叫這兩個js,然後初始化swfu物件。 摺疊展開JavaScript複製程式碼
<script type=”text/javascript”>
var swfu;
window.onload = function () {
swfu = new SWFUpload({
// Backend Settings
upload
_url:
“upload
.asp
“,
// Relative to the SWF
file 就是這個地方誤導了我
file_post_name: “Filedata”, // 檔案物件的名稱,預設Filedata,可以自己改.後臺接收就靠它識別
post_params: {“SESSID” : “<%=session.SessionID%>”}, //
附加引數,版本2新功能
// File Upload
Settings
file_size_limit : “204”, // 單位kb, 限制檔案大小
file_types : “*.jpg”, //允許的檔案型別
file_types_description : “JPG Images”, //對話方塊裡的檔案型別
file_upload
_limit
: “0”,
// Event Handler Settings – these functions as defined in
Handlers.js
// The handlers are not part of SWFUpload but are part of my
website and control how
// my website reacts to the SWFUpload events.
// 事件處理,可以自己在handlers.js裡面擴充,極大的方便了開發者
// 就是要在handlers裡面定義如下的function,當然function裡面可以什麼也不幹,或者用原始碼自帶的也行
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
upload
_progress_handler
: uploadProgress,
upload
_error_handler
: uploadError,
upload
_success_handler
: uploadSuccess,
upload
_complete_handler
: uploadComplete,
// Flash Settings
flash_url : “js/swfupload_f9.swf
“, // Relative to this
file 注意是f8還是f9
custom_settings : {
upload
_target
: “divFileProgressContainer”
},
// Debug Settings 是否開啟除錯資訊,預設false
debug: true
});
}
</script>
下面是表單的寫法,無需input type=file的寫法 XML/HTML複製程式碼
<form>
<button id=”btnBrowse” type=”button” style=”padding: 5px;”
onclick=”swfu.selectFiles(); this.blur();”><img
src=”image/page_white_add.png” style=”padding-right: 3px;
vertical-align: bottom;”>Select Images <span style=”font-size:
7pt;”>(2 MB Max)</span></button>
</form>
3, 後臺save.asp
.
其實如果你做過普通的檔案上傳,這裡就很簡單,不管是jsp,asp
,php,基本原理都一樣. 前臺swf
得到檔案後,還是用post方式提交給後臺,檔案物件默
認名為Filedata. 比如用asp
的無元件檔案上傳的處理寫法如下 ASP
/Visual Basic複製程式碼
<!–#include FILE=”upload
_5xsoft.inc”–>
<%
set upload
=new
upload
_5xsoft
for each formName in upload
.objFile
set file=upload
.file(“Filedata”)
file.saveAs Server.mappath(file.FileName)
set file=nothing
next
set upload
=nothing
response.write “ok”
%>
java裡怎麼處理呢?
其實也已有,比如用struts,在actionform裡有一個名為Filedata的FileItem物件即可.
php和aspx就不講了,官方原始檔就是php的例子,也有aspx的例子.
4, 返回結果如何顯示?
比如上面第三步返回一個結果”ok”. 在handlers裡寫上 JavaScript複製程式碼
function uploadSuccess(fileObj, server_data) {
try {
document.write( server_data);
} catch (ex) { this.debug(ex); }
}
就這樣簡單.只要知道原理,你可以寫出更復雜的效果.官方原始碼提供了根據上傳圖片生成縮圖並馬上顯示的例子.
相關文章
- 在Windows 10中,您可以使用以下命令來轉換系統版本(例如,從家庭版升級到專業版)。主要使用的是 slmgr 和 DISM 工具。以下是相關命令:Windows
- 用筆記來記錄遇到的問題:釋出版本和非釋出版本遇到的問題筆記
- 升級到MySQL5.7版本需注意的問題MySql
- iOS 極光推送遇到的問題iOS
- 我在jsp中遇到的亂碼問題!JS
- Linux在桌面領域存在的主要問題(2013版)Linux
- air在go的其他版本上執行可能遇到的問題AIGo
- Vault 不同版本的API的異同API
- 移動端網頁版開發遇到的問題網頁
- 我曾經遇到過的一個SAP gateway系統cache的問題Gateway
- DP 6.1版本在linux Client上的問題解決方法Linuxclient
- Nokia PC 套件版本及在不同Windows 上的安裝問題套件Windows
- 如何分析因為 SAP UI5 版本差異帶來的問題試讀版UI
- AdDuplex:近30%的Windows 10 PC現在使用的是20H2版本Windows
- 客戶應用中遇到問題的地方就是國產資料庫的發力點資料庫
- linux5.6以下版本的不相容問題Linux
- 什麼是Segmentation fault(Core Dump)? + 我遇到的例項問題Segmentation
- 在FlashDevelop裡使用1.8版本的的TortoiseSVNdev
- php部署到nginx時遇到的問題PHPNginx
- 神奇解決NoClassDefFoundError版本不同的問題Error
- oracle10g安裝在RHEL5遇到的版本問題Oracle
- Topsec NG2.2版本的鏈路問題
- recyclebin造成的問題分析
- 一次詭異的Oracle使用者無法su問題Oracle
- 曾經遇到的一個另類的排序問題.排序
- EXP客戶端版本差異造成的錯誤客戶端
- 精通Oracle的關鍵是……(Ask Tom上最經常被問到的問題)Oracle
- 未用函式封裝造成的Julia和c相同演算法執行時間的巨大差異函式封裝演算法
- 解決在使用Amoeba遇到的問題
- Windows版本—— MSDN版、OEM版、RTM版有什麼不同Windows
- IOS面試經常被問到的問題iOS面試
- css中經遇到的文字換行問題CSS
- 我在Facebook學到的10個經驗
- 我面試遇到的智力題面試
- 2017開發者盤點:是我在解決AI的問題,不是AI解決我的問題AI
- 我勒個去,程式設計師在開發時遇到的靈異現象程式設計師
- Oracle企業版、標準版本、簡化版之間的區別Oracle
- 使用nagios所遇到的問題簡記iOS