获取视频第一帧作为视频封面图

本文介绍了一种使用Java和FFmpeg库截取视频第一帧作为封面图的方法,解决了手机端上传视频时封面图可能翻转的问题,并提供了将图片转换为Base64编码的示例代码。

获取视频第一帧作为视频封面图

1.导包

		<dependency>
            <groupId>org.bytedeco</groupId>
            <artifactId>javacv</artifactId>
            <version>1.4.3</version>
        </dependency>
        
        <dependency>
            <groupId>org.bytedeco.javacpp-presets</groupId>
            <artifactId>ffmpeg-platform</artifactId>
            <version>4.0.2-1.4.3</version>
        </dependency>

2.截取视频封面代码

我这里返回的是图片的base64编码
处理了手机端上传视频截取封面图图片翻转问题

public static String fetchFrame(String videoName) {
        FFmpegFrameGrabber ff = null;
        byte[] data = null;
        ByteArrayOutputStream os = new ByteArrayOutputStream();
        String videoPath = videoName;
        try {
            ff = new FFmpegFrameGrabber(videoPath);
            ff.start();
            int lenght = ff.getLengthInFrames();
            int i = 0;
            Frame f = null;
            while (i < lenght) {
                // 过滤前5帧,避免出现全黑的图片
                f = ff.grabFrame();
                if ((i > 5) && (f.image != null)) {
                    break;
                }
                i++;
            }
            BufferedImage bi =  new Java2DFrameConverter().getBufferedImage(f);
            String rotate = ff.getVideoMetadata("rotate");
            if (rotate != null) {
                bi = rotate(bi, Integer.parseInt(rotate));
            }
            ImageIO.write(bi, "jpg", os);
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            try {
                if (ff != null) {
                    ff.stop();
                }
            } catch (FrameGrabber.Exception e) {
                e.printStackTrace();
            }
        }
        BASE64Encoder encoder = new BASE64Encoder();
        return "data:image/jpg;base64,"+encoder.encode(os.toByteArray());
    }
    public static BufferedImage rotate(BufferedImage src, int angel) {
        int src_width = src.getWidth(null);
        int src_height = src.getHeight(null);
        int type = src.getColorModel().getTransparency();
        Rectangle rect_des = calcRotatedSize(new Rectangle(new Dimension(src_width, src_height)), angel);
        BufferedImage bi = new BufferedImage(rect_des.width, rect_des.height, type);
        Graphics2D g2 = bi.createGraphics();
        g2.translate((rect_des.width - src_width) / 2, (rect_des.height - src_height) / 2);
        g2.rotate(Math.toRadians(angel), src_width / 2, src_height / 2);
        g2.drawImage(src, 0, 0, null);
        g2.dispose();
        return bi;
    }
    public static Rectangle calcRotatedSize(Rectangle src, int angel) {
        if (angel >= 90) {
            if(angel / 90 % 2 == 1) {
                int temp = src.height;
                src.height = src.width;
                src.width = temp;
            }
            angel = angel % 90;
        }
        double r = Math.sqrt(src.height * src.height + src.width * src.width) / 2;
        double len = 2 * Math.sin(Math.toRadians(angel) / 2) * r;
        double angel_alpha = (Math.PI - Math.toRadians(angel)) / 2;
        double angel_dalta_width = Math.atan((double) src.height / src.width);
        double angel_dalta_height = Math.atan((double) src.width / src.height);
        int len_dalta_width = (int) (len * Math.cos(Math.PI - angel_alpha - angel_dalta_width));
        int len_dalta_height = (int) (len * Math.cos(Math.PI - angel_alpha - angel_dalta_height));
        int des_width = src.width + len_dalta_width * 2;
        int des_height = src.height + len_dalta_height * 2;
        return new java.awt.Rectangle(new Dimension(des_width, des_height));
    }

3.参考

链接:https://blog.youkuaiyun.com/qq_37024898/article/details/87186670

前端开发获取视频第一帧作为封面通常会涉及到HTML5的一些API,特别是`HTMLVideoElement`对象。以下是基本步骤: 1. **创建 Video 元素**: 首先,在HTML中创建一个`<video>`元素,并设置其`src`属性指向你要提取封面视频文件。 ```html <video id="myVideo" width="200" height="200"></video> ``` 2. **监听 `canplaythrough` 事件**: 使用JavaScript,给视频元素添加`canplaythrough`事件监听器,这个事件会在视频加载完成后并且可以播放时触发。在该事件处理函数中,视频应该已经准备好进行读取了。 ```javascript document.getElementById('myVideo').addEventListener('canplaythrough', function() { // 接下来的操作... }, {once: true}); ``` 3. **获取第一帧**: 在`canplaythrough`事件回调中,使用`canvas`或`toDataURL`方法获取视频第一帧。这里我们使用`Canvas API`: ```javascript var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); canvas.width = this.video.videoWidth; canvas.height = this.video.videoHeight; // 获取视频解码后的数据 this.video.captureStream().then(function(stream) { var frameGenerator = stream.getVideoTracks()[0].getVideoFrame(); // 开始帧生成器并获取第一帧 var framePromise = new Promise((resolve) => { frameGenerator.onframe = function(frame) { ctx.drawImage(frame, 0, 0); resolve(canvas.toDataURL()); frameGenerator.stop(); // 结束帧生成,防止无限循环 }; }); return framePromise; }).then(function(dataURL) { // 设置视频预览的src属性 document.querySelector('#myVideo').poster = dataURL; }); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值