Webuploader uploads videos and webuploader uploads videos.

Webuploader uploads videos and webuploader uploads videos.

Someone asked me to create a webuploader to upload a video, but there was no time. Now I have taken the time. To complete the following simple demo

Step 1: What is the difference between uploading a video and uploading an image?

In fact, there is no such thing. Because all the operations are uploaded, we do not need to worry about uploading.

However, webuploader actually limits the parameters you upload (here it refers to limiting your file extension)

Find extensions in accept, the js parameter in webuploader.

Accept :{
Title: 'images ',
Extensions: 'gif, jpg, jpeg, bmp, png ',
MimeTypes: 'image /*'
}

Here, we only need to change the suffixes such as gif to the format you need to upload (MP4, AVI, etc)

After this is changed, we need to modify the background.

 

[HttpPost] public ActionResult upload (HttpPostedFileBase file) {if (file! = Null & file. ContentLength> 0) {string folderpath = "/UploadFile/"; // if (! Directory. Exists (folderpath) {Directory. CreateDirectory (Server. MapPath (folderpath);} string ext1 = Path. GetExtension (file. FileName); if (ext1! = ". Mp4" & ext1! = ". Rmvb" & ext1! = ". Avi" & ext1! = ". Flv") // The author modifies the suffix judgment {return Json (new {statu = 201, msg = "the file format is incorrect! "});} Else {string name = DateTime. now. toString ("yyyyMMddHHmmssff"); string ext = Path. getExtension (file. fileName); string downpath = folderpath + name + ext; string filepath = Server. mapPath (folderpath) + name + ext; file. saveAs (filepath); return Json (new {statu = 200, src = downpath, id = name}) ;}} else {return Json (new {statu = 202, msg = "upload a file! "});}}

 

Remember to update the background judgment.
After completing these steps, we basically have no problem uploading.
Now open the front-end code

<Tr> <td> upload video </td> <div id = "upl"> upload video </div> // This will be instantiated using js immediately </td> </tr> <script> var uploader; $ (function () {uploader = WebUploader. create ({auto: true, swf: '/Scripts/Uploader.swf', server: '@ Url. action ("Upload") ', // controller pick:' # upl ', accept: {title: 'images', extensions: 'mp4, flv, jpeg, bmp, doc, docx, rar, pdf ', }})}); </script>

You can also see that uploader not only uploads some basic image videos, but also uploads documents and other things.