springspringboot实现视频网站oot视频网站开发背景(springboot实现视频网站)

介绍

最近因为想做个在手机上播放电脑上视频的软件,所以就去了解了一下springboot播放视频流的技术实现。网上查了很多资料,发现都有问题:

  1. 最低级的,直接在springboot中读取了整个视频文件,然后把读取到的文件流,写入HttpServletResponse的OutputStream。这种方案问题很大,服务器耗内存,客户端卡顿,因为客户端得把整个视频下载好才能播放。
  2. 稍好一点的,意识到要使用http的range来实现分片加载,就是客户端无需下载整个视频了,可以拖动进度条,分段请求服务器。但是,网上的教程,都是自己动手实现的,代码逻辑大概是这样:根据客户端要的文件片段,springboot加载本地文件,切分出具体那段文件,返回给客户端。逻辑没问题,就是没必要这么干~因为,springboot自己本身就有这方面的代码。自己写又不稳定,又麻烦。

ResourceHttpRequestHandler

ResourceHttpRequestHandler是springboot加载静态资源的一个类,平时是用来从你resources/statics等目录加载文件的。所以,这个类本身就是支持range请求数据的。我们要做的,就是把要播放的文件File传递给ResourceHttpRequestHandler就行,三五行代码搞定!

springboot服务端代码

第一步,先自定义实现一个ResourceHttpRequestHandler。代码如下:

package com.tec666.moviebar.config;

import org.springframework.core.io.FileSystemResource;
import org.springframework.core.io.Resource;
import org.springframework.stereotype.Component;
import org.springframework.web.servlet.resource.ResourceHttpRequestHandler;

import javax.servlet.http.HttpServletRequest;

/**
 * @author longge93
 */
@Component
public class NonstaticResourceHttpRequestHandler extends ResourceHttpRequestHandler {

    public final static String ATTR_FILE = "NON-STATIC-FILE";

    @Override
    protected Resource getResource(HttpServletRequest request) {
        String filePath =  (String) request.getAttribute(ATTR_FILE);
        return new FileSystemResource(filePath);
    }
}

上面代码的意思是:从HttpServletRequest的attribute中读取文件path,然后返回给ResourceHttpRequestHandler处理。当然,这个attribute是我们后面传进来的。

第二步,在视频播放controller中,把本地文件路径传入ResourceHttpRequestHandler。代码如下:

@Controller
@RequestMapping(value = "/api/baseResource")
public class BaseSourceApiController {

  
    @Autowired
    private NonStaticResourceHttpRequestHandler nonStaticResourceHttpRequestHandler;


    private final Logger logger = LoggerFactory.getLogger(this.getClass());

    @RequestMapping(value = "/video", method = RequestMethod.GET)
    public void video(
            HttpServletRequest request,
            HttpServletResponse response
    ) {
        try {
            String path = "D:/abc.mp4";
            File file = new File(path);
            if (file.exists()) {
                request.setAttribute(NonStaticResourceHttpRequestHandler.ATTR_FILE, path);
                nonStaticResourceHttpRequestHandler.handleRequest(request, response);
            } else {
                response.setStatus(HttpServletResponse.SC_NOT_FOUND);
                response.setCharacterEncoding(StandardCharsets.UTF_8.toString());
            }
        } catch (Exception e) {

        }
    }
}

参数解释:记得把上面代码中的path替换成你的路径,或者从controller请求参数里获取。

到此,整个springboot播放视频流的功能就实现了,感觉是全网最最简便的了。因为可以根据range返回视频流片段,所以客户端是可以随意拖动进度条,可以倍速播放的。相比把整个视频下载好再播放,这个方案才是yyds!

Vue前端播放器

我使用的是vue-video-player这个开源组件,你可以自己用npm安装一下,然后在你的项目中直接用就行。配置参数的时候,视频地址就填上面springboot的这个controller地址。

java截取视频生成图片封面、GIF封面

主要分为两个功能:

  1. java截取视频,把视频帧拆分成几张图片,用作视频封面。
  2. java把几张图片拼接成一个gif图片。

这两个功能是在做播放器的时候,一起顺手实现的,网上的教程相对挺多的,如果有需要请点击右侧“联系作者”联系我,我再开单独的文章介绍。

播放器效果展示

springspringboot实现视频网站oot视频网站开发背景(springboot实现视频网站)

我们打开chrome开发者工具,查看播放视频时的网络请求,可以发现视频是被切分成小片段,根据你当前的播放进度,分片下载的。请看下图:

springspringboot实现视频网站oot视频网站开发背景(springboot实现视频网站)

版权声明:《springboot+vue播放视频流(无需下载视频,可以拖动进度、倍速播放)》为CoderBBB作者「???」的原创文章,转载请附上原文出处链接及本声明。

原文链接:https://www.coderbbb.com/articles/39

本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 sumchina520@foxmail.com 举报,一经查实,本站将立刻删除。
如若转载,请注明出处:https://www.yiheng8.com/157153.html