bootstrap-fileinput视频上传

在页面编写一个input框:

<input id="input-repl-3a" name="videoFileAddress" type="file" accept="mp4,avi,dat,3gp,mov,rmvb" />

页面导入的css文件:

<link href="/static/bootstrap-fileinput-4.4.8/css/fileinput.min.css" rel="stylesheet" />
<link href="/static/bootstrap-fileinput-4.4.8/css/fileinput-rtl.min.css" rel="stylesheet" />

页面导入的js文件:

<script src="/static/bootstrap-fileinput-4.4.8/js/fileinput.min.js"></script>
<script src="/static/bootstrap-fileinput-4.4.8/js/zh.js"></script>

javascript代码放在body的后面: 

<script th:inline="javascript">
 $("#input-repl-3a").fileinput({
dropZoneTitle : "请上传小于150M的视频!",
uploadUrl : "saveVideoAddress",
language : "zh",
autoReplace : true,
showCaption : false,
showUpload : true,
overwriteInitial : true,
showUploadedThumbs : true,
//showPreview:false, //显示上传图片的大小信息
maxFileCount : 1,
minFileCount:1,
maxFileSize : 153600,//文件最大153600kb=150M
initialPreviewShowDelete : false,
showRemove : false,//是否显示删除按钮
showClose : false,
layoutTemplates : {
actionUpload:'',
},
allowedFileExtensions : [ "mp4","avi","dat","3gp","mov","rmvb"],
previewSettings : {
image : {
width : "100%",
height : "100%"
},
}
});</script>

视频上传到ftp服务器的后台java代码:

public ModelMap saveVideoAddress(@RequestParam("videoFileAddress") MultipartFile videoFileAddress,
HttpServletRequest request, HttpServletResponse response) {
ModelMap map = new ModelMap();
String paFileName = videoFileAddress.getOriginalFilename();
try {
FtpUtil ftpUtil = new FtpUtil();
FTPClient ftp = ftpUtil.getConnectionFTP(UploadFileUrlUtil.HOST_NAEM, UploadFileUrlUtil.PORT,
UploadFileUrlUtil.USER_NAME, UploadFileUrlUtil.PASSWORD);
String filename = FtpUtil.getFileName(videoFileAddress);
boolean bool = ftpUtil.uploadFile(ftp,UploadFileUrlUtil.GetPath(UploadFileUrlUtil.VIDEO_PATH) , filename,
videoFileAddress.getInputStream());
if (bool) {
String url =UploadFileUrlUtil.GetPath(UploadFileUrlUtil.VIDEO_PATH) + filename;
map.put("videoAddress", url);
map.put("videoName", paFileName);
System.out.println("上传成功!");
boolean boolClose = ftpUtil.closeFTP(ftp);
if (boolClose) {
System.out.println("关闭ftp连接成功!");
} else {
System.out.println("关闭ftp连接失败!");
}
} else {
System.out.println("上传失败!");
} } catch (Exception e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
}
return ReturnUtil.Success("加载成功", map, null);
}

远程服务器的配置信息:

public class UploadFileUrlUtil {
// 远程服务器的配置信息
public final static String HOST_NAEM="127.0.0.1";
public final static Integer PORT=21;
public final static String USER_NAME="123456"; //ftpuser
public final static String PASSWORD="123456";
public final static int LOCALHOST= 8080; public final static String BIG_PATH="/upload/picture/big/"; //主图路径
public final static String SMALL_PATH="/upload/picture/small/"; //副图的路径
public final static String VIDEO_PATH="/upload/picture/video/"; //视频的路径
public final static String HOST= "http://192.168.0.140:8080";// 上传的端口 public static String GetPath(String path) {
SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd");
String date=sdf.format(new Date());
return path+date+"/";
}
}

视频上传的js文件下载链接:  https://pan.baidu.com/s/1zwfJB00oKplfZIImLN6BWw 密码: atb6

上一篇:OSI七层&TCP&IP协议


下一篇:Android SDK Manager配置