java实现视频流断点续传-前端ReactPlayer播放

ReactPlayer

import React from 'react'
import ReactPlayer from 'react-player'
export default class OperationEdit extends React.Component {

    render() {
        return (
            <ReactPlayer
                className='react-player'
                // url='https://stream7.iqilu.com/10339/upload_transcode/202002/18/20200218093206z8V1JuPlpe.mp4'
                url='/api/baseInfo/file/videoPlayback'
                width='100%'
                height='100%'
                playing={true}
                controls
            />

        )
    }
}

java

    @ApiOperation("视频流播放")
    @RequestMapping(value = "/videoPlayback", method = RequestMethod.GET)
    void videoPlayback() throws IOException;
    @Override
    public void videoPlayback() throws IOException {

        String filepath = "C:\\Users\\admin\\Pictures\\测试视频\\16MSize.mp4";

        //检查是否是Range请求
        if (request.getHeader("Range") != null) {
            //读取文件
            File targetFile = new File(filepath);
            BufferedInputStream in = new BufferedInputStream(new FileInputStream(targetFile));
            Long fileSize = targetFile.length();

            //解析Range
            Map<String, Integer> range = this.analyzeRange(request.getHeader("Range"), fileSize.intValue());

            //设置响应头
            response.setContentType("video/mp4");
            response.setHeader("Content-Length", String.valueOf(fileSize.intValue()));
            response.setHeader("Content-Range", "bytes " + range.get("startByte") + "-" + range.get("endByte") + "/" + fileSize.intValue());
            response.setHeader("Access-Control-Allow-Origin", "*");
            response.setHeader("Accept-Ranges", "bytes");
            response.setStatus(HttpServletResponse.SC_PARTIAL_CONTENT);

            //开始输出
            OutputStream os = response.getOutputStream();
            int length = range.get("endByte") - range.get("startByte");
            System.out.println("length:" + length);
            byte[] buffer = new byte[length < 1024 ? length : 1024];
            in.skip(range.get("startByte"));
            int i = in.read(buffer);
            length = length - buffer.length;
            while (i != -1) {
                os.write(buffer, 0, i);
                if (length <= 0) {
                    break;
                }
                i = in.read(buffer);
                length = length - buffer.length;
            }
            os.flush();
            //关闭
            os.close();
            in.close();
            return;
        }
    }

    /**
     * 解析range,解析出起始byte(startByte)和结束byte(endBytes)
     *
     * @param range    请求发来的range
     * @param fileSize 目标文件的大小
     * @return
     */
    private Map<String, Integer> analyzeRange(String range, Integer fileSize) {
        String[] split = range.split("-");
        Map<String, Integer> result = new HashMap<>();
        if (split.length == 1) {
            //从xxx长度读取到结尾
            Integer startBytes = new Integer(range.replaceAll("bytes=", "").replaceAll("-", ""));
            result.put("startByte", startBytes);
            result.put("endByte", fileSize - 1);
        } else if (split.length == 2) {
            //从xxx长度读取到yyy长度
            Integer startBytes = new Integer(split[0].replaceAll("bytes=", "").replaceAll("-", ""));
            Integer endBytes = new Integer(split[1].replaceAll("bytes=", "").replaceAll("-", ""));
            result.put("startByte", startBytes);
            result.put("endByte", endBytes > fileSize ? fileSize : endBytes);
        } else {
            log.info("未识别的range:", range);
        }
        return result;
    }

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ljt-tiger

thanks

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值