解决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 相关文章推荐
zeroclipboard复制到剪切板的flash
Aug 04 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(二)人物行走的实现
Jan 23 Javascript
jQuery获取Select选择的Text和Value(详细汇总)
Jan 25 Javascript
HTTP 304错误的详细讲解
Nov 13 Javascript
javascript基于HTML5 canvas制作画箭头组件
Jun 25 Javascript
JavaScript中eval函数的问题
Jan 31 Javascript
JavaScript实现页面跳转的方式汇总
May 16 Javascript
jQuery使用JSONP实现跨域获取数据的三种方法详解
May 04 jQuery
Angular动画实现的2种方式以及添加购物车动画实例代码
Aug 09 Javascript
详解微信小程序-canvas绘制文字实现自动换行
Apr 26 Javascript
js中offset,client , scroll 三大元素知识点总结
Sep 11 Javascript
vue列表数据发生变化指令没有更新问题及解决方法
Jan 16 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
javascript 小型动画组件与实现代码
2010/06/02 PHP
深入理解PHP中的global
2014/08/19 PHP
PHP文件读取功能的应用实例
2015/05/08 PHP
Zend Framework教程之Application和Bootstrap用法详解
2016/03/10 PHP
PHP中使用foreach()遍历二维数组的简单实例
2016/06/13 PHP
详解Laravel设置多态关系模型别名的方式
2019/10/17 PHP
THINKPHP5分页数据对象处理过程解析
2020/10/28 PHP
jQuery+CSS 实现的超Sexy下拉菜单
2010/01/17 Javascript
从零开始学习jQuery (八) 插播:jQuery实施方案
2011/02/23 Javascript
js中判断数字\字母\中文的正则表达式 (实例)
2012/06/29 Javascript
jquery表单验证使用插件formValidator
2012/11/10 Javascript
javascript解决innerText浏览器兼容问题思路代码
2013/05/17 Javascript
javascript实现json页面分页实例代码
2014/02/20 Javascript
javascript常见操作汇总
2014/09/03 Javascript
AngularJS + Node.js + MongoDB开发的基于高德地图位置的通讯录
2015/01/02 Javascript
JS实现控制表格行文本对齐的方法
2015/03/30 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
2018/03/07 Javascript
npm 更改默认全局路径以及国内镜像的方法
2018/05/16 Javascript
JavaScript模拟实现自由落体效果
2018/08/28 Javascript
Jquery cookie插件实现原理代码解析
2020/08/04 jQuery
Vue封装Axios请求和拦截器的步骤
2020/09/16 Javascript
vue 数据操作相关总结
2020/12/17 Vue.js
python中的内置函数max()和min()及mas()函数的高级用法
2018/03/29 Python
Python返回数组/List长度的实例
2018/06/23 Python
python_opencv用线段画封闭矩形的实例
2018/12/05 Python
flask框架自定义过滤器示例【markdown文件读取和展示功能】
2019/11/08 Python
对python中assert、isinstance的用法详解
2019/11/27 Python
python实现四人制扑克牌游戏
2020/04/22 Python
is_file和file_exists效率比较
2021/03/14 PHP
台湾母婴用品购物网站:Infant婴之房
2018/06/15 全球购物
美津浓巴西官方网站:Mizuno巴西
2019/07/24 全球购物
给水排水工程专业毕业生推荐信
2013/10/28 职场文书
公司门卫的岗位职责
2014/02/19 职场文书
幼儿园植树节活动总结
2014/07/04 职场文书
财务人员岗位职责
2015/02/03 职场文书
高考1977观后感
2015/06/04 职场文书