FileUpload 上传视频文件简单实例

我们都知道当Html input 标签类型为file时同时将from 表单元素的enctype属性设置为 multipart/form-data 这样就可以上传文件，但是这种方式只能上传文本文件不能上传视频文件。这时出现了功能强大的第三方js工具类 fileupload 实现了任何类型的文件都能上传例子如下：

  <form id="formId" action="" method="post" enctype="multipart/form-data" class="form-horizontal "><label class="col-md-3 control-label">视频上传</label><div class="col-md-5"><span style='color:blue;'>(支持'3gp','rmvb','flv','wmv','avi','mkv','mp4','mp3','wav'格式)</span><input type="file" class="file" name="file"></div>       </form>

<script src="../fileupload/jquery.ui.widget.js"></script>
<script src="../fileupload/jquery.iframe-transport.js"></script>
<script src="../fileupload/jquery.fileupload.js"></script>
<script src="../fileupload/jquery.xdr-transport.js"></script>
<script src="../fileupload/jquery.fileupload-process.js"></script>
<script src="../fileupload/jquery.fileupload-validate.js"></script>
<script>

$(".file").fileupload({url : "${context}/admin/video/upload/save",dataType : "json",acceptFileTypes: /(\.|\/)(3gp|flv|rmvb|mp4|wmv|avi|mkv|mp3|wav)$/i,maxFileSize: 500 * 1024 * 1024,minFileSize: 5,messages: {maxFileSize: '文件上传的最大大小为 500MB',acceptFileTypes: '此文件是不支持的视频格式'},formData : function (from) {
//当上传文件时需要传递其他参数时 可以通过以下方式进行赋值传递return [{name : "deviceCode",value : $('input[name="deviceCode"]').val()},{name : "type",value : $("select").val()}]},done : function(e, data){//当文件上传成功后调用这个回调函数console.log(data)},processfail: function (e, data) { //根据的定义的校验规则进行文件检验var currentFile = data.files[data.index];if (data.files.error && currentFile.error) {console.log(currentFile.error)}})

</script>

后台接收文件使用的SpringMVC 的multipartResolver

<!-- 上传文件拦截，设置最大上传文件大小   500M=500*1024*1024(B)=524288000 bytes --><bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"><property name="maxUploadSize" value="${web.maxUploadSize}" /></bean>

后台Controller 接收方法

 @RequestMapping("/save")@ResponseBodypublic Result save(@RequestParam MultipartFile file, @RequestParam  String deviceCode, @RequestParam int type, HttpServletRequest request){SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddhhmmss");Result result = new Result();try {String  fileName = file.getOriginalFilename();String extName = fileName.substring(fileName.lastIndexOf("."));String newFileName = deviceCode + "_" + type + "_" + sdf.format(new Date())  + extName;File newFile = new File(request.getSession().getServletContext().getRealPath("/opt/video/todo/"));if (! newFile.exists()) newFile.mkdirs();newFile = new File(newFile, newFileName);OutputStream out = new FileOutputStream(newFile);out.write(file.getBytes());out.flush();out.close();} catch (IOException e) {e.printStackTrace();result.setError(e);}result.setData("操作成功");return result;}

FileUpload 上传视频文件简单实例相关推荐

html5视频上传云,vue+七牛云上传视频文件
Qiniu-JavaScript-SDK基于七牛云存储官方 API 构建,其中上传功能基于 H5 File API.开发者基于 JS-SDK 可以方便的从浏览器端上传文件至七牛云存储,并对上传成功后的 ...
tp5.1 乐视云上传视频文件(https请求http乐视云上传接口)http网址下上传视频(https API接口)
一.sdk_php_v2.0.zip 上传视频网址:http://www.lecloud.com/zh-cn/help/api.html tp5.1 乐视云上传视频文件(https请求http乐视云 ...
【phpcms-v9】phpcms-v9上传视频文件时的解决方案
1.不建议直接在后台上传视频文件,因为视频文件一般都比较大,直接上传影响带宽:可先通过ftp工具将视频文件上传到指定目录,然后再后台引入视频文件的地址即可 2.如果在上传视频的时候,只想显示" ...
上传视频文件到又拍云，jsp内嵌window media player在线播放
上传视频文件到又拍云,jsp内嵌window media player在线播放完成上述功能的后台路径 filePath.jsp(ajax)->UpYunController.java--> ...
php上传视频文件代码,PHP视频文件上传完整示例代码
这里有新鲜揭晓的PHP面向对象编程,程序猫速率看过来! PHP开源脚本语言PHP(外文名: Hypertext Preprocessor,中文名:"超文本预处理器")是一种通用开源 ...
extjs插件开发上传下载文件简单案例
前台,extjs,框架,mybatis,spring,springMVC,简单的文件上传下载案例. 必要的jar包,commons-fileupload-1.3.1.jar,commons-io-2. ...
GitHub 支持上传视频文件啦！
大家好,我是若川.今天周六,分享一篇热点新闻.文章较短,预计5分钟可看完. 近日 Github 宣布支持了视频上传功能,意味着,大家在提 issue 时可以携带视频了,这极大地提高了开发者和维护者的效 ...
php上传视频文件怎么实现
我们平时经常做的是上传文件,上传文件夹与上传文件类似,但也有一些不同之处,这次做了上传文件夹就记录下以备后用. 首先我们需要了解的是上传文件三要素: 1.表单提交方式:post (get方式提交有大小 ...
fileUpload上传视频
FileUpload控件还有一个void SaveAs (string filename)的方法,这个方法用于将上传的文件保存到服务器上.一般来说,使用FileUpload控件上传文件一般有如下几个步 ...

FileUpload 上传视频文件简单实例

FileUpload 上传视频文件简单实例相关推荐

最新文章

热门文章