jQuery uploadify在谷歌和火狐瀏覽器上傳失敗的解決方案

2020-01-24 01:34:06

字體：大中小

來源：轉載

供稿：網友

jquery.uploadify插件是一個基于jquery來實現上傳的，這個插件很好用，每一次向后臺發送數據流請求時，ie會自動把本地cookie存儲捆綁在一起發送給服務器。但firefox、chrome不會這樣做，他們會認為這樣不安全，下面小編給大家分享有關jQuery uploadify在谷歌和火狐瀏覽器上傳失敗的解決方案。

我是這樣解決的，這樣所有上傳文件的代碼都不需要修改，改動量最小，但是有安全隱患：

if (this.LoginInfo == null){ // 解決uploadify兼容火狐谷歌瀏覽器上傳問題 // 但是，此代碼使系統有安全隱患，Flash程序請求該系統不需要驗證 // 要解決此安全隱患，需要Flash程序傳用戶名和密碼過來驗證，但是該用戶名和密碼不能寫在前端以便被不法用戶看到 if (Request.UserAgent == "Shockwave Flash") {  return; } else {  filterContext.Result = RedirectToAction("LoginAgain", "Account", new { Area = "Auth" });  return; }}

我們的系統是ASP.NET MVC的，雖說通過加密的方式可以讓用戶看不到敏感信息，但惡意用戶不需要把敏感信息解密出來就可繞過系統驗證。
驗證信息不能直接寫前臺，可以用ajax從后臺獲取驗證信息，然后傳給flash，然后在攔截器中驗證。
修改后：
JS代碼：
ajax請求后臺獲取用戶名，傳給flash

$(function () { $.ajax({  url: "/Auth/Account/GetUserNamePwd",  type: "POST",  dataType: "json",  data: {},  success: function (data) {   $("#uploadify").uploadify({    height: 25,    width: 100,    swf: '/Content/Plugins/UploadifyJs/uploadify.swf',    uploader: 'UploadFile',    formData: {     userName: data.data.userName, //ajax獲取的用戶名     pwd: data.data.pwd //ajax獲取的密碼    },    buttonText: '選擇文件上傳',    fileSizeLimit: '4MB',    fileTypeDesc: '文件',    fileTypeExts: '*.*',    queueID: 'fileQueue',    multi: true,    onUploadSuccess: function (fileObj, data, response) {     var d = eval("(" + data + ")");     $(".uploadify-queue-item").find(".data").html("  上傳完成");     $("#url").val(d.url);     $("#name").val(d.name);    },    onUploadError: function (event, ID, fileObj, errorObj) {     if (event.size > 4 * 1024 * 1024) {      alert('超過文件上傳大小限制（4M）！');      return;     }     alert('上傳失敗');    }   }); //end uploadify  } });});  //end $

攔截器中代碼：
......

if (this.LoginInfo == null){  // 解決uploadify兼容火狐谷歌瀏覽器上傳問題 // 但是，此代碼使系統有安全隱患，Flash程序請求該系統不需要驗證 // 要解決此安全隱患，需要Flash程序傳用戶名和密碼過來驗證，但是該用戶名和密碼不能寫在前端以便被不法用戶看到 if (Request.UserAgent == "Shockwave Flash") {  string userName = Request.Params["userName"];  string pwd = Request.Params["pwd"];  if (!string.IsNullOrWhiteSpace(userName) && !string.IsNullOrWhiteSpace(pwd))  {   AuthDAL authDAL = new AuthDAL();   sys_user user = authDAL.GetUserInfoByName(userName);   if (user != null && user.password == pwd)   {    return;   }  } } else {  filterContext.Result = RedirectToAction("LoginAgain", "Account", new { Area = "Auth" });  return; }}

最近還總結個問題在jquery.uploadify上傳插件導致google崩潰 ，很讓人惱火，最后抓包看看到底什么原因，才發現原來谷歌在第一次請求時，它會把所有需要引用的文件放入本地緩存，而uploadify需要每次都能請求，所以最后導致了崩潰出現...

如何解決jquery.uploadify上傳插件導致google崩潰的問題呢？

解決辦法，可以在每個引用的文件后面加個隨機數，讓它每次請求都帶個參數，該問題則自動解決