资讯专栏INFORMATION COLUMN

web项目中视频的上传和展示

nidaye / 3282人阅读

摘要:展示标签展示属性发送请求使用字节流将视频绑定到响应并返回。二展示请求注意要加才会有播放按钮显示,其他属性不一一介绍使用字节流将视频绑定到响应并返回文件路径名称文件的后缀等响应返回成功后标签就显示了视频,效果如下我做的手机端的,所以比较小

思路:
上传:
表单提交视频-->后台使用字节流保存到本地。 展示:

这条思路适用于所有文件(包括图片,音频,视频,压缩包),下面只是视频的实例。

一上传

1.form表单提交视频


    
    


注意使用 type="file" MULTIPLE 属性
    
使用 enctype="multipart/form-data"

2.controller接收

@RequestMapping("/addMovie")
public  String addMovie(MultipartFile movie){
   ..................;
}

3.使用字节流保存到本地

/**
 *
 * @param file
 * @param path  保存的路径
 * @param fileName  保存的文件名
 */
  public static void saveFile(MultipartFile file, String path, String fileName) {
  
    InputStream inputStream = null;
    OutputStream outputStream = null;
    try {
        inputStream = file.getInputStream();
    } catch (IOException e) {
        e.printStackTrace();
    }
    try {
        byte[] bs = new byte[1024];        // 读取到的数据长度
        int len;                           // 输出的文件流保存到本地文件
        File tempFile = new File(path);    // 保存到临时文件 1K的数据缓冲
        if (!tempFile.exists()) {
            tempFile.mkdirs();
        }
        outputStream = new FileOutputStream(tempFile.getPath() + File.separator + fileName);

        while ((len = inputStream.read(bs)) != -1) {    // 开始读取
            outputStream.write(bs, 0, len);
        }

    } catch (Exception e) {
        e.printStackTrace();
    } finally {                 // 完毕,关闭所有链接
        try {
            outputStream.close();
            inputStream.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

以上步骤视频就通过程序保存到电脑的指定位置了,一般我会新建一个视频类,先用uuid给视频重命名,视频类的路径是视频的名字,取的时候使用视频的名字去请求。

二 展示

1.video请求

    
    
注意:video要加controls="controls"才会有播放按钮显示,其他属性不一一介绍

2.使用字节流将视频绑定到响应并返回

@Controller
@RequestMapping("/file")
public class FileController {
/**
 *
 * @param response
 * @param filePath 文件路径+名称
 * @param suffix 文件的后缀
 * @return
 */
@RequestMapping("/{filePath}/{suffix}")
public String getFile(HttpServletResponse response, @PathVariable String filePath, @PathVariable String suffix) {
    FileInputStream fis = null;
    ServletOutputStream outputStream = null;
    int len = 0;
    try {
        File file = new File(FileUtils.getFileMainPath() + filePath + "." + suffix);
        fis = new FileInputStream(file);
        byte[] b = new byte[1024 * 2];
        outputStream = response.getOutputStream();
        while ((len = fis.read(b)) != -1) {
            outputStream.write(b, 0, len);
        }
        outputStream.flush();
    } catch (FileNotFoundException e) {
        e.printStackTrace();
    } catch (IOException e) {
        e.printStackTrace();
    } finally {
        try {
            if (fis != null)
                fis.close();
            if (outputStream != null)
                outputStream.close();
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            fis = null;
            outputStream = null;
        }
    }
    return null;
}

}
等响应返回成功后video标签就显示了视频,

效果如下(我做的手机端的,所以比较小)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/68032.html

相关文章

  • 好程序员React精品项目全集:商城管理后台(视频+源码+笔记)

    摘要:今天给大家带来了好程序员实战项目商城管理后台。配合项目学习会让你更快掌握它的使用方法下面就来看看好程序员这套实战项目课程介绍好程序员项目本项目是一个使用开发的商城系统的管理后台,里面登录判断,接口调用,数据展示和编辑,文件上传等后台功能。 众所周知,项目经验对于一个程序员变得越来越重要。在面...

    李世赞 评论0 收藏0
  • eyoucms v1.4.9授权破解版 易优cms企业建站系统去版权版 v1.4.9

    摘要:授权破解版易优企业建站系统易优企业建站系统是一款十分优秀专业的为企业创建网站服务的软件。去版权破解版强大好用,为企业创建网站提供很多帮助和便利。直接去易优官网,购买商业授权即可去除版权。eyoucms v1.4.9授权破解版(易优企业建站系统)是一款十分优秀专业的为企业创建网站服务的软件。eyoucms v1.4.9去版权破解版 强大好用,为企业创建网站提供很多帮助和便利。易优cms破解授权...

    番茄西红柿 评论0 收藏2637
  • 精彩文章大合集- 收藏集 - 掘金

    摘要:发布应用市场的平台抢红包工具红包精灵开源啦掘金红包精灵,如果喜欢,点个开源不易。作者将原素材文章进行了新内容的添加和重新排列,但是因为文章高效的代码编写技巧总结前端掘金本文总结了代码编写技巧,来提升你的和代码。 收藏安卓开发中非常实用优秀的库! 有图有真相! - Android - 掘金本来是打算收藏工具类的,但转念一想,已经有这么多优秀的库了,就没必要再去重复造轮子了,便归纳工作中比...

    ermaoL 评论0 收藏0

发表评论

0条评论

nidaye

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<