The file is Refresh uploaded and retrieved to the server (swfUpload and uploadify), and swfuploaduploadify

Source: Internet
Author: User

The file is Refresh uploaded and retrieved to the server (swfUpload and uploadify), and swfuploaduploadify


 

Upload files without refreshing and obtain the path to the server.

When uploading files, combined with the previously used swfUpload, I found a jquery plug-in uploadify for refreshing new files. I wrote a blog record to introduce the implementation methods of the two.

  • Import the swfUpload Development Kit
  • Add js references and reference the swfUpload. js and handler. js files. If you do not know about swfUpload and have any questions, refer to this blog.
  • Page Initialization

  • Modify the successful upload event in the handler. js file. serverData is the server response.

  • Import the uploadify Development Kit, download it from the official website, official website documents, Chinese documents, and official website examples
  • Add references to js and css, jquery. uploadify. js 、uploadify.css

    (Note: In css, the upload of the uploadify-cancel.pngimage file is optional. You can change it in the uploadify.css file)

     

  • Page Initialization

    During page initialization, you can specify multiple settings and reload uploaded events. data indicates the server response.

  • Server-side upload Handler

1 /// <summary> 2 // Upload File 3 /// </summary> 4 public class UploadFileHandler: IHttpHandler, IRequiresSessionState 5 {6 public void ProcessRequest (HttpContext context) 7 {8 context. response. contentType = "text/plain"; 9 // verify the upload permission 10 if (context. session ["User"] = null) 11 {12 context. response. write ("no permission"); 13 context. response. end (); 14 return; 15} 16 try 17 {18 // get the uploaded file 19 // Filedata is The client has been defined. If you want to change it, change the configuration in the js file 20 HttpPostedFile image_upload = context. request. files ["Filedata"]; 21 // obtain the file extension 22 string fileExt = System. IO. path. getExtension (image_upload.FileName ). toLower (); 23 // verify whether the file extension meets the requirements, whether the image format is allowed 24 if (! FileTypes. isAllowed (fileExt) 25 {26 return; 27} 28 // current time string 29 string timeString = DateTime. now. toString ("yyyyMMddHHmmssfff"); 30 // Save the virtual path to build 31 string path = "/Upload/" + timeString + fileExt; 32 // obtain and construct the physical path of the file to be uploaded 33 string serverPath = context. server. mapPath ("~ /"+ Path); 34 // Save the image to the server 35 image_upload.SaveAs (serverPath); 36 // output the Save path 37 context. response. write (path); 38} 39 catch (Exception ex) 40 {41 context. response. write ("Error"); 42 // record log 43 new Common. logHelper (typeof (UploadFileHandler )). error (ex); 44} 45} 46 47 public bool IsReusable 48 {49 get 50 {51 return false; 52} 53} 54} 55 public static class FileTypes 56 {57 private static List <str Ing> allowedFileTypes = new List <string> (); 58 // obtain the json configuration file 59 private static string jsonFilePath = Common. PathHelper. MapPath ("~ /AllowedFileTypes. json "); 60 61 // <summary> 62 // allowed file types 63 /// </summary> 64 public static List <string> AllowedFileTypes 65 {66 get 67 {68 return allowedFileTypes; 69} 70 71 set 72 {73 allowedFileTypes = value; 74} 75} 76 77 // <summary> 78 // static constructor 79 // </summary> 80 static FileTypes () 81 {82 LoadFileTypesFromJson (); 83} 84 85 // <summary> 86 // read the file type that can be uploaded from the json file. 87 // </summary> 88 private static void LoadFileTypesFromJson () 89 {90 string types = File. readAllText (jsonFilePath); 91 AllowedFileTypes = Common. converterHelper. jsonToObject <List <string> (types); 92} 93 94 // <summary> 95 // when the file type is allowed, update to json file 96 // </summary> 97 public static void FileTypesToJson () 98 {99 string types = Common. converterHelper. objectToJson (AllowedFileTypes); 100 File. writeAllText (jsonFilePath, types ); 101} 102 103 // <summary> 104 // Add a file extension 105 /// </summary> 106 // <param name = "newFileType"> </param> 107 public static void AddNewFileType (string newFileType) 108 {109 AllowedFileTypes. add (newFileType); 110 FileTypesToJson (); 111} 112 113 // <summary> 114 // determine whether a certain file type is allowed to upload 115 /// </summary> 116 // <param name = "fileExt"> file extension </param> 117 // <returns> whether upload is allowed <code> true </code> </returns> 118 public static bool IsAllowed (string fileExt) 119 {120 foreach (string item in AllowedFileTypes) 121 {122 if (fileExt. equals (fileExt) 123 {124 return true; 125} 126} 127 return false; 128} 129}UploadFileHandler 1 // uploadify initializes 2 $ (function () {3 $ ('# file_upload '). uploadify ({4 // specify swf 5'swf ':'/uploadify/uploadify.swf ', 6 // server-side handler 7'upload':'/Admin/UploadFileHandler. ashx ', 8 // button text 9 buttonText: 'upload attachment', 10 // file type 11 fileTypeExts :"*. zip ;*. rar ;*. doc ;*. docx ;*. xls; * xlsx ", 12 onUploadSuccess: OnFileUploadSuccess13}); 14}); 15 function OnFileUploadSuccess (file, data, response) {16 // server Client response 17 if (data = 'nopermission') {18 alert ('no upload authorization'); 19} 20 if (data = 'error ') {21 alert ('upload failed'); 22} else if (response) {23 alert ('upload successful ~~~ '); 24 $ ("# filePath"). val (data); 25} 26}Uploadify

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.