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


Posted in Javascript onDecember 18, 2015

之前介绍过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传过去,这样Http Error 302错误就可以得到解决。

问题扩展:MVC使用uploadify3.1 IE下正常firefox、chrome也出现HTTPERROR 302错误,有什么解决办法?

jquery uploadify在ie下可以正常上传,在实现异步上传的时候,每一个文件在上传时都会提交给服务器一个请求。每个请求都需要安全验证,session 和cookie的校验。是的,就是这样。由于jquery uploadify是借助flash来实现上传的,每一次向后台发送数据流请求时,ie会自动把本地cookie存储捆绑在一起发送给服务器。但 firefox、chrome不会这样做,他们会认为这样不安全。

首先需要对global.asxa添加如下内容

protected void Application_BeginRequest(object sender, EventArgs e)
  {
   /* we guess at this point session is not already retrieved by application so we recreate cookie with the session id... */
   try
   {
    string session_param_name = "ASPSESSID";
    string session_cookie_name = "ASP.NET_SessionId";

    if (HttpContext.Current.Request.Form[session_param_name] != null)
    {
     UpdateCookie(session_cookie_name, HttpContext.Current.Request.Form[session_param_name]);
    }
    else if (HttpContext.Current.Request.QueryString[session_param_name] != null)
    {
     UpdateCookie(session_cookie_name, HttpContext.Current.Request.QueryString[session_param_name]);
    }
   }
   catch
   {
   }

   try
   {
    string auth_param_name = "AUTHID";
    string auth_cookie_name = FormsAuthentication.FormsCookieName;

    if (HttpContext.Current.Request.Form[auth_param_name] != null)
    {
     UpdateCookie(auth_cookie_name, HttpContext.Current.Request.Form[auth_param_name]);
    }
    else if (HttpContext.Current.Request.QueryString[auth_param_name] != null)
    {
     UpdateCookie(auth_cookie_name, HttpContext.Current.Request.QueryString[auth_param_name]);
    }

   }
   catch
   {
   }
  }

  private void UpdateCookie(string cookie_name, string cookie_value)
  {
   HttpCookie cookie = HttpContext.Current.Request.Cookies.Get(cookie_name);
   if (null == cookie)
   {
    cookie = new HttpCookie(cookie_name);
   }
   cookie.Value = cookie_value;
   HttpContext.Current.Request.Cookies.Set(cookie);
  }

初始化页面上传插件代码如下

<script type="text/javascript">
  var auth = "@(Request.Cookies[FormsAuthentication.FormsCookieName]==null ? string.Empty : Request.Cookies[FormsAuthentication.FormsCookieName].Value)";
  var ASPSESSID = "@Session.SessionID";

  $(function () {
   $('#upload').uploadify({
    'formData': { 'folder': '/Upload', 'ASPSESSID': ASPSESSID, 'AUTHID': auth },
    'buttonText': '浏览',
    'buttonClass': 'browser',
    'fileSizeLimit' : '100KB',
    'fileTypeExts': '*.xls;*.xlsx',
    'removeCompleted': false,
    'swf': '@Url.Content("~/Scripts/Uploadify/uploadify.swf")',
    'uploader': '/Upload',
    'onUploadSuccess': function (file, data, response) {}
   });
  });
 </script>

更多精彩内容请参考专题《ajax上传技术汇总》,《javascript文件上传操作汇总》和《jQuery上传操作汇总》进行学习。

 一个问题的研究可以是发散性的是多方面,我们要学会举一反三,这样才能灵活的学习专业知识,掌握专业技能,希望对大家的学习有所帮助。

Javascript 相关文章推荐
css把超出的部分显示为省略号的方法兼容火狐
Jul 23 Javascript
Javascript 鼠标移动上去小三角形滑块缓慢跟随效果
Apr 26 Javascript
JavaScript window.location对象
Nov 14 Javascript
JS给Textarea文本框添加行号的方法
Aug 20 Javascript
jQuery实现带动画效果的多级下拉菜单代码
Sep 08 Javascript
JavaScript+html5 canvas制作的圆中圆效果实例
Jan 27 Javascript
JQuery给select添加/删除节点的实现代码
Apr 26 Javascript
Angularjs单选改为多选的开发过程及问题解析
Feb 17 Javascript
vue数据双向绑定原理解析(get &amp; set)
Mar 08 Javascript
Vue中 key keep-alive的实现原理
Sep 18 Javascript
JS实现在线ps功能详解
Jul 31 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
Jul 20 Javascript
JavaScript Math.round() 方法
Dec 18 #Javascript
JavaScript如何实现对数字保留两位小数一位自动补零
Dec 18 #Javascript
js格式化时间的方法
Dec 18 #Javascript
谈谈我对JavaScript DOM事件的理解
Dec 18 #Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
Dec 18 #Javascript
jQuery Validation PlugIn的使用方法详解
Dec 18 #Javascript
最简单的JavaScript图片轮播代码(两种方法)
Dec 18 #Javascript
You might like
php入门学习知识点七 PHP函数的基本应用
2011/07/14 PHP
PHP之短标签开启设置
2013/06/17 PHP
如何使用PHP实现javascript的escape和unescape函数
2013/06/29 PHP
php-fpm配置详解
2014/02/12 PHP
PHP代码优化技巧小结
2015/09/29 PHP
header与缓冲区之间的深层次分析
2016/07/30 PHP
javascript 日历提醒系统( 兼容所有浏览器 )
2009/04/07 Javascript
html dom节点操作(获取/修改/添加或删除)
2014/01/23 Javascript
jquery datepicker参数介绍和示例
2014/04/15 Javascript
全面了解addEventListener和on的区别
2016/07/14 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
利用Node.js+Koa框架实现前后端交互的方法
2017/02/27 Javascript
vue2中filter()的实现代码
2017/07/09 Javascript
input file样式修改以及图片预览删除功能详细概括(推荐)
2017/08/17 Javascript
Node.js dgram模块实现UDP通信示例代码
2017/09/26 Javascript
bootstrap Table服务端处理分页(后台是.net)
2017/10/19 Javascript
JS中的JSON对象的定义和取值实现代码
2018/05/09 Javascript
jQuery使用动画队列自定义动画操作示例
2018/06/16 jQuery
vue 点击展开显示更多(点击收起部分隐藏)
2019/04/09 Javascript
JS中实现浅拷贝和深拷贝的代码详解
2019/06/05 Javascript
[46:57]EG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python下函数参数的传递(参数带星号的说明)
2010/09/19 Python
开源Web应用框架Django图文教程
2017/03/09 Python
详解python中asyncio模块
2018/03/03 Python
python3将视频流保存为本地视频文件
2018/06/20 Python
python-itchat 获取微信群用户信息的实例
2019/02/21 Python
django 自定义过滤器的实现
2019/02/26 Python
pygame实现俄罗斯方块游戏(基础篇3)
2019/10/29 Python
如何用PyPy让你的Python代码运行得更快
2020/12/02 Python
html5 input元素新特性_动力节点Java学院整理
2017/07/06 HTML / CSS
介绍一下JMS编程步骤
2015/09/22 面试题
办理居住证介绍信
2014/01/15 职场文书
小学教师听课制度
2014/02/01 职场文书
幼儿园教师培训方案
2014/02/04 职场文书
优秀家长事迹材料
2014/05/17 职场文书
Python实现仓库管理系统
2022/05/30 Python