Maison >interface Web >js tutoriel >Solution à l'erreur Http Error 302 dans jQuery Uploadify upload plug-in_jquery

Solution à l'erreur Http Error 302 dans jQuery Uploadify upload plug-in_jquery

WBOY
WBOYoriginal
2016-05-16 15:26:092710parcourir

J'ai présenté comment utiliser le plug-in de téléchargement jquery uploadify il y a quelque temps. J'ai rencontré le problème d'erreur Http Error 302 lors de l'utilisation. De nombreuses personnes auraient dû le rencontrer lors de l'utilisation. Je vais l'enregistrer ici :
.

Tout d'abord, http 302 signifie que la demande a été redirigée, ce qui est facile à comprendre. Si votre script de téléchargement de traitement uploadify a une vérification de session, cette erreur se produira car Flash n'inclut pas les informations de cookie lors de l'exécution de la demande de publication. , et la session du serveur obtiendra le SESSIONID en fonction du cookie du client. Naturellement, la session ne peut pas être obtenue sans soumettre le cookie, et uploadify renvoie une erreur 302 (demande redirigée).

La solution est bien sûr de passer la valeur de session_id au serveur :

<script>
$(document).ready(function() { 
   $('#file_upload').uploadify({ 
    'uploader' : 'uploadify/uploadify.swf', 
    'script'  : 'uploadify.php',
    'folder'  : 'uploads/file', 
    'formData': { 'session': '<&#63;php echo session_id();&#63;>'}, 
    'onComplete' : function(event, ID, fileObj, response, data) { 
     alert(response); 
    } 
   }); 
}); 
</script> 

Puis avant la vérification de la session côté serveur :

if (isset($_POST['session'])){ 
  session_id($_POST['session']); 
  session_start();//注意此函数要在session_id之后 
} 

Bien sûr, vous pouvez également transmettre directement l'identifiant de session dans l'URL.

Le code dans yii est le suivant :

$('#<&#63;php echo $upload_name_id;&#63;>').uploadify({
      'buttonText': '选择文件..',
      'fileObjName': 'imgFile',
      'method': 'post',
      'multi': false,
      'queueID': 'fileQueue',
      /*'uploadLimit': 2,*/
      'fileTypeExts': '*.gif;*.png;*.jpg;*.bmp;*.jpeg;',
      'buttonImage': '<&#63;php echo $this->_static_public&#63;>/js/uploadify/select.png',
      'formData': {
        'sessionId'  : '<&#63;php echo Yii::app()->session->sessionID; &#63;>',
        'timestamp'  : '<&#63;php echo time();&#63;>',
        'token'    : '<&#63;php echo md5('unique_salt'.time()); &#63;>',
        'modelName' : '<&#63;php echo $modelName; &#63;>',
        'modelId' : '<&#63;php echo $model->id; &#63;>'
      },
      'swf': '<&#63;php echo $this->_static_public;&#63;>/js/uploadify/uploadify.swf',
      'uploader': '<&#63;php echo $this->createUrl('uploadify/basicExecute')&#63;>',
      'onUploadStart': function () {
        $('#<&#63;php echo $up_upload_name_id;&#63;> img').remove();
        $('#<&#63;php echo $up_upload_name_id;&#63;> a').remove();
        $imgHtml = '<img class="upload_load" src="static/images/upload.gif" align="absmiddle" />';
        $('#<&#63;php echo $up_upload_name_id;&#63;>').append($imgHtml);
      },  
      'onUploadSuccess': function(file, data, response) {
        $('.upload_load').remove(); 
        var json = $.parseJSON(data); 
        if (json.state == 'success') {
          $("#<&#63;php echo $d_upload_name_id;&#63;>").remove();
          $(yt_upload_name_id).val(json.fileId);
          $imgHtml ='<div id="<&#63;php echo $d_upload_name_id;&#63;>">';          
          $imgHtml += '<a href="<&#63;php echo $this->_baseUrl&#63;>/' + json.file + '" target="_blank">';
          $imgHtml += '<img src="<&#63;php echo $this->_baseUrl&#63;>/'+json.file+'" width="85" height="75" align="absmiddle"/>';
          $imgHtml += '</a>';
          $imgHtml += '<a href="javascript:uploadifyRemove("' + json.fileId + '","<&#63;php echo $d_upload_name_id;&#63;>","<&#63;php echo $yt_upload_name_id;&#63;>")">删除</a>';
          $imgHtml +='</div>';
          $('#<&#63;php echo $up_upload_name_id;&#63;>').append($imgHtml);
        } else {
          alert(json.message);
        }
      },
      'onQueueComplete':function () {
        $('.upload_load').remove();
      }
    }); 

Serveur :

if (isset($_POST['sessionId'])) {
  $session = Yii::app()->getSession();
  $session->close();
  $session->sessionID = $_POST['sessionId'];
  $session->open();
}

ps : expérience d'utilisation du plug-in de téléchargement jquery uploadify (résumé)

Utilisez-le vous-même :

1.page 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. Code du serveur

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();
 }}

Le contenu ci-dessus est la solution à l'erreur Http Error 302 dans le plug-in de téléchargement jQuery Uploadify introduit par l'éditeur. J'espère qu'il vous plaira.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn