Uploadify 參數說明javascript
1、uploadify使用詳解php
1.在html中的file標籤能夠用來上傳文件,可是在文件較大或者多文件上傳的時候,file標籤就不太適合了。而uploadify插件是基於js的jQuery庫寫的,結合ajax和flash,實現多文件上傳功能。css
2.主要文件:
jquery.uploadify.js (主要插件)
jquery-1.7.2.min.js (jquery主件)
uploadify.swf (flash上傳插件)
uploadify.css (上傳樣式表)
uploadify-cancel.png (flash上傳按鈕圖標)
uploadify.php (上傳處理數據)
uploads文件夾 (默認保存上傳文件目錄)html
3.在上傳的頁面引入js/css文件,而後初始化一些參數變量java
$(function () { $('#file_upload').uploadify({ buttonText:'選擇文件', swf: '{$smarty.const.SITE_PUBLIC_URL}Admin/uploadify/uploadify.swf', uploader: '{$smarty.const.__CONTROLLER__}/Upload', method:'get', onSWFReady:function(){ $('#file_upload').uploadify('disable', true); }, onUploadStart:function(file){ var spot=$('#spot').val(); var coid={$arrData['coid']}; var session_id={$smarty.session.session_id}; $("#file_upload").uploadify("settings", "formData", { 'spot' : spot,'coid':coid,'session_id':session_id}); }, onUploadSuccess:function(file, data, response){ } }); });
接着就是在body裏面添加調用標籤jquery
<p><i>多圖上傳<span class="must">*</span></i></p> <br><br> <input id="file_upload" name="file_upload" type="file" multiple="true">
最後就是在後臺處理上傳的文件。。。。。。ajax
2、出現的問題thinkphp
1.因爲jquery uploadify是藉助flash來實現上傳的,因此可能在瀏覽器禁止網站運行flash是會出現以下這個狀況:瀏覽器
正常的狀況:安全
2.Jquery Uploadify在IE瀏覽器能夠正常上傳,在Chrome瀏覽器使用也是正常的,只有在Firefox瀏覽器使用纔會出現HTTP 302報錯。
在實現異步上傳的時候,每個文件在上傳時都會提交給服務器一個請求。每一個請求都須要安全驗證,session和cookie的校驗。因爲jquery uploadify是藉助flash來實現上傳的,每一次向後臺發送數據流請求時,IE會自動把本地cookie存儲捆綁在一塊兒發送給服務器。可是firefox不會這樣作,因此在進行驗證登陸的時候就出現了HTTP 302 報錯。若是把這個模塊放在不須要驗證的地方是不會出現這種報錯的。
Session又稱爲會話狀態,是Web系統中最經常使用的狀態,用於維護和當前瀏覽器實例相關的一些信息。Session對於每個客戶端是不同的,用戶首次與Web服務器創建鏈接的時候,服務器會給用戶分發一個 SessionID做爲標識。SessionID是一個由24個字符組成的隨機字符串。用戶每次提交頁面,瀏覽器都會把這個SessionID包含在 HTTP頭中提交給Web服務器,這樣Web服務器就能區分當前請求頁面的是哪個客戶端。
三.解決問題
1.解決方案一:
在插件初始化的時候,把本地記錄下來的session值,以及身份驗證值傳給初始化方法,進行參數賦值,這樣,每次異步請求上傳文件的時候,相應的 session值就包含在請求文件中了。
onUploadStart:function(file){ var spot=$('#spot').val(); var coid={$arrData['coid']}; var session_id={$smarty.session.session_id}; $("#file_upload").uploadify("settings", "formData", {'spot' : spot,'coid':coid,'session_id':session_id}); },
服務器端(ThinkPHP控制器)代碼
public function _initialize(){ //此處爲解決Uploadify在火狐下出現http 302錯誤 從新設置SESSION $session_name= session_name(); if(isset($_GET['session_id'])) { session_id($_GET['session_id']); session_start(); } //執行登錄驗證檢測函數 $this->powerverify(); }
2.解決方案二:
onUploadStart:function(file){ var spot=$('#spot').val(); var coid={$arrData['coid']}; var session_id={$smarty.session.session_id}; $("#file_upload").uploadify("settings", "formData", {'spot' : spot,'coid':coid,'session_id':session_id}); },
服務器端(ThinkPHP控制器)代碼
在覈心類文件夾裏下的Conf/convention.php中 將 VAR_SESSION_ID打開(建議在模塊的conf文件中添加配置,如在模塊下的Conf/config.php中添加 ‘VAR_SESSION_ID’ => ‘session_id’,)
<?php return array( 'VAR_SESSION_ID' => 'session_id',//sessionID的提交變量 );
在解決了問題以後,我再上Firefox瀏覽器去上傳圖片就成功了!
查看原文>> 曼巴童鞋 - 博客 - ThinkPHP 解決使用uploadify 在Firefox瀏覽器上傳圖片出現HTTP 302報錯