微信小程序-live-player-实时视频-截图并转文件流

最新推荐文章于 2024-07-19 17:51:05 发布

小螃蟹er

最新推荐文章于 2024-07-19 17:51:05 发布

阅读量2.6k

点赞数 1

分类专栏：小程序文章标签：小程序

本文链接：https://blog.csdn.net/jermyo/article/details/109072593

版权

小程序专栏收录该内容

1 篇文章 0 订阅

订阅专栏

该博客介绍了如何在微信小程序中使用LivePlayerContext的snapshot方法实现实时视频截取，并将截图转换为base64编码，进一步保存到本地。通过wx.getFileSystemManager读取并转换文件，调用saveImageToPhotosAlbum接口保存图片到相册。同时提到了使用canvas进行截图的另一种方法。

摘要由CSDN通过智能技术生成

<live-player id="players" src="http://h5player.bytedance.com/video/flv/xgplayer-demo-360p.flv" mode="live"  autoplay="true" style="width: 100%; height:500rpx;" />

this.videoContext = wx.createLivePlayerContext("players");
this.videoContext.snapshot({
    success(e) {
        console.log('success', e)
        let fsm = wx.getFileSystemManager()
        fsm.readFile({
            filePath: e.tempImagePath,
            encoding: "base64",
            success: function (data) {
                console.log(data)
                let bstr = atob(data.data),
                    n = bstr.length,
                    u8arr = new Uint8Array(n)
                while (n--) {
                    u8arr[n] = bstr.charCodeAt(n)
                }
                let files = new File([u8arr], '截图', { type: 'image/png' })

                this.screenShotSave(files)
            }
        })
        // 保存本地
        // wx.saveImageToPhotosAlbum({
        //     filePath: e.tempImagePath,
        //     success: function (e) {
        //         console.log('saveImageToPhotosAlbum', e)
        //     },
        //     fail: function (e) { }
        // })
    },
    fail(e) {
        console.log('fail', e)
    }
})