jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法

前段时间介绍过jquery uploadify上传插件的使用方法,我在使用中遇到过Http Error 302错误问题,应该会有很多人在使用中遇到过,在此记录下来:

首先http 302是请求被重定向的意思,这就很容易理解了,如果你的uploadify处理上传脚本有session验证,就会出现此错误,因为flash在执行post请求的时候没有包含cookie信息,而服务器的session会根据客户端的cookie来得到SESSIONID。没有提交cookie自然就不能获取到session,然后uploadify就返回了302(请求被重定向)的错误。

解决办法当然是把session_id的值传到服务端:

<script>

$(document).ready(function() {

$('#file_upload').uploadify({

'uploader' : 'uploadify/uploadify.swf',

'script' : 'uploadify.php',

'folder' : 'uploads/file',

'formData': { 'session': '<?php echo session_id();?>'},

'onComplete' : function(event, ID, fileObj, response, data) {

alert(response);

}

});

});

</script>

然后在服务器端session验证之前:

if (isset($_POST['session'])){

session_id($_POST['session']);

session_start();//注意此函数要在session_id之后

}

当然,你也可以直接在url中将session id传过去。

yii中代码如下:

$('#<?php echo $upload_name_id;?>').uploadify({

'buttonText': '选择文件..',

'fileObjName': 'imgFile',

'method': 'post',

'multi': false,

'queueID': 'fileQueue',

/*'uploadLimit': 2,*/

'fileTypeExts': '*.gif;*.png;*.jpg;*.bmp;*.jpeg;',

'buttonImage': '<?php echo $this->_static_public?>/js/uploadify/select.png',

'formData': {

'sessionId' : '<?php echo Yii::app()->session->sessionID; ?>',

'timestamp' : '<?php echo time();?>',

'token' : '<?php echo md5('unique_salt'.time()); ?>',

'modelName' : '<?php echo $modelName; ?>',

'modelId' : '<?php echo $model->id; ?>'

},

'swf': '<?php echo $this->_static_public;?>/js/uploadify/uploadify.swf',

'uploader': '<?php echo $this->createUrl('uploadify/basicExecute')?>',

'onUploadStart': function () {

$('#<?php echo $up_upload_name_id;?> img').remove();

$('#<?php echo $up_upload_name_id;?> a').remove();

$imgHtml = '<img class="upload_load" src="static/images/upload.gif" align="absmiddle" />';

$('#<?php echo $up_upload_name_id;?>').append($imgHtml);

},

'onUploadSuccess': function(file, data, response) {

$('.upload_load').remove();

var json = $.parseJSON(data);

if (json.state == 'success') {

$("#<?php echo $d_upload_name_id;?>").remove();

$(yt_upload_name_id).val(json.fileId);

$imgHtml ='<div id="<?php echo $d_upload_name_id;?>">';

$imgHtml += '<a href="<?php echo $this->_baseUrl?>/' + json.file + '" target="_blank">';

$imgHtml += '<img src="<?php echo $this->_baseUrl?>/'+json.file+'" width="85" height="75" align="absmiddle"/>';

$imgHtml += '</a>';

$imgHtml += '<a href="javascript:uploadifyRemove(&quot;' + json.fileId + '&quot;,&quot;<?php echo $d_upload_name_id;?>&quot;,&quot;<?php echo $yt_upload_name_id;?>&quot;)">删除</a>';

$imgHtml +='</div>';

$('#<?php echo $up_upload_name_id;?>').append($imgHtml);

} else {

alert(json.message);

}

},

'onQueueComplete':function () {

$('.upload_load').remove();

}

});

服务端:

if (isset($_POST['sessionId'])) {

$session = Yii::app()->getSession();

$session->close();

$session->sessionID = $_POST['sessionId'];

$session->open();

}

ps:jquery上传插件uploadify使用心得(总结)

自己使用实例:

1、jsp页面:

<link href="jsp/js/jquery_upload/uploadify.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="jsp/js/jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="jsp/js/jquery_upload/swfobject.js"></script>

<script type="text/javascript" src="jsp/js/jquery_upload/jquery.uploadify.v2.1.4.min.js"></script>

//jquery文件上传

$(document).ready(function()

{

$("#uploadify").uploadify({

'uploader': 'jsp/js/jquery_upload/uploadify.swf',

'script': 'uploadFile.svl',

'cancelImg': 'jsp/js/jquery_upload/cancel.png',

'queueID': 'fileQueue',

'auto': false,

'multi': true,

'method':'POST',

'scriptData':{'saveFolder':'stuPhotos'},//GET方式才可生效

'fileExt' :'*.jpg;*.gif;*.png', //控制可上传文件的扩展名

'fileDesc': 'jpg、gif、png文件', //控制可上传文件的扩展名描述,两者需要同时使用

'buttonImg':'jsp/js/jquery_upload/selectBtn.gif',

'width':80,//"浏览"按钮宽度

'onComplete':function(event,ID,fileObj,response,data){

//alert(response) //response为服务器响应数据

},

});

});

<td width="200" class="tabIndex" style="height:10px">照片:</td>

<td>

<input type="file" name="uploadify" id="uploadify" />

<p>

<a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>|

<a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>

</p>

<div id="fileQueue" ></div>

<input type="hidden" name="stuPhoto" id="stuPhoto" />

</td>

2、服务端代码

public class UploadFileUtil extends HttpServlet {

private static final long serialVersionUID = 1L;

File tmpDir = null;// 初始化上传文件的临时存放目录

File saveDir = null;// 初始化上传文件后的保存目录

public UploadFileUtil() {

super();

}

protected void doGet(HttpServletRequest request,

HttpServletResponse response) throws ServletException, IOException {

doPost(request, response);

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

try{

if(ServletFileUpload.isMultipartContent(request)){

response.setCharacterEncoding("utf-8");//务必,防止返回文件名是乱码

DiskFileItemFactory dff = new DiskFileItemFactory();//创建该对象

dff.setRepository(tmpDir);//指定上传文件的临时目录

dff.setSizeThreshold(1024000);//指定在内存中缓存数据大小,单位为byte

ServletFileUpload sfu = new ServletFileUpload(dff);//创建该对象

sfu.setFileSizeMax(5000000);//指定单个上传文件的最大尺寸

sfu.setSizeMax(10000000);//指定一次上传多个文件的总尺寸

FileItemIterator fii = sfu.getItemIterator(request);//解析request 请求,并返回FileItemIterator集合

while(fii.hasNext()){

FileItemStream fis = fii.next();//从集合中获得一个文件流

if(!fis.isFormField() && fis.getName().length()>0){//过滤掉表单中非文件域

String fileName = fis.getName();//获取文件名

String extName = "";

if (fileName.lastIndexOf(".") >= 0) {

extName = fileName.substring(fileName.lastIndexOf("."));

}

BufferedInputStream in = new BufferedInputStream(fis.openStream());//获得文件输入流

String uuidName = UUID.randomUUID().toString().replaceAll("-", "").toUpperCase();//用UUID生成文件名

BufferedOutputStream out = new BufferedOutputStream(new FileOutputStream(new File(saveDir+"/"+uuidName+extName)));//获得文件输出流

Streams.copy(in, out, true);//开始把文件写到你指定的上传文件夹

}

}

//jquery上传方式返回

response.getWriter().print("upload success");//成功

}

}catch(Exception e){

response.getWriter().print("upload fail");//失败

e.printStackTrace();

}

} public void init() throws ServletException {

super.init();

String serverPath = this.getServletConfig().getServletContext().getRealPath("/");//获取服务器路径

String tmpPath = serverPath+"/tmpUploadsFolder/";

String savePath = serverPath+"/uploadsFolder/";

tmpDir = new File(tmpPath);

saveDir = new File(savePath);

if(!tmpDir.isDirectory())

tmpDir.mkdir();

if(!saveDir.isDirectory())

saveDir.mkdir();

}}

以上内容是小编给大家介绍的jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法,希望大家喜欢。

以上是 jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法 的全部内容, 来源链接: utcz.com/z/314951.html

回到顶部