uniapp 将流转化为视频并播放 微信小程序

这篇具有很好参考价值的文章主要介绍了uniapp 将流转化为视频并播放 微信小程序。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

该问题最关键的一步是将后端传回来的流,转化成视频,并播放。

1、从服务器请求数据流到前端

2、新建一个临时文件,将数据流写入这个文件里面,并自定义路径+命名。

 const fs = wx.getFileSystemManager(); //获取全局唯一的文件管理器
          fs.writeFile({ })

3、可以将该文件保存到相册(这一步也可以不保存)

 wx.saveVideoToPhotosAlbum({ // 新开页面打开文档
                filePath: wx.env.USER_DATA_PATH + "/myvideo.mp4",  //拿上面存入的文件路径
                success: function (res) {
                  
                }
              })

4、直接用video播放这个临时文件路径即可。

直接上代码:文章来源地址https://www.toymoban.com/news/detail-740908.html

<video :src="src"></video>

                        uni.request({
                        url: 服务器地址,
                        method: 'GET',
                        responseType: 'arraybuffer',
                        header: {
                            Authorization: 'Bearer ' + user.DEFAULT_USER.access_token
                        },
                        success: res => {
                            const fs = wx.getFileSystemManager(); 
                               //获取全局唯一的文件管理器
                            fs.writeFile({ // 写文件
                                filePath: wx.env.USER_DATA_PATH + "/myvideo.mp4", 
                                // 指定临时文件存入的路径,后面字符串自定义
                                data: res.data,
                                encoding: "binary", //二进制流文件必须是 binary
                                success(res) {
                                    console.log('写入成功', res)
                                    this.src = wx.env.USER_DATA_PATH + "/myvideo.mp4"
                                    })
                                }
                            });
                        },
                    });

到了这里,关于uniapp 将流转化为视频并播放 微信小程序的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp - 微信小程序接入腾讯视频播放器功能插件,uniapp开发微信小程序端调用引入并使用腾讯视频播放组件完整全流程(详细示例源码,一键复制开箱即用)

    在uniapp 微信小程序项目中,集成腾讯视频功能插件,实现播放腾讯视频效果,附带详细示例源码及注释, 你可以跟着步骤一步步来,保证几分钟就能快速在uniapp小程序项目中植入腾讯视频功能!

    2024年02月12日
    浏览(68)
  • 微信小程序视频播放

    官方地址: https://developers.weixin.qq.com/miniprogram/dev/component/video.html binderror 视频错误信息 show-play-btn 是否显示视频底部控制栏的播放按钮 show-fullscreen-btn 是否显示全屏按钮 controls 是否显示默认播放控件 enable-play-gesture 是否开启播放手势,即双击切换播放/暂停

    2024年02月10日
    浏览(40)
  • 微信小程序实现视频播放

     博主介绍: 本人专注于Android/java/数据库/微信小程序技术领域的开发,以及有好几年的计算机毕业设计方面的实战开发经验和技术积累;尤其是在安卓(Android)的app的开发和微信小程序的开发,很是熟悉和了解;本人也是多年的Android开发人员;希望我发布的此篇文件可以帮

    2024年02月02日
    浏览(35)
  • uniapp微信小程序video不显示,无法播放

    微信小程序开发者工具video不显示,无法播放 微信开发者工具调试基础库版本太高 将微信开发者工具调试基础库改为低版本

    2024年04月10日
    浏览(81)
  • 微信小程序视频调整播放倍速

    创建 video 上下文 设置视频倍数

    2024年02月13日
    浏览(48)
  • 微信小程序安卓视频播放卡顿问题

    在微信小程序开发中遇到在video组件的两个问题 刚开始以为是网络问题,或者是视频文件问题。排查了一下发现都没问题 最后加了个属性就OK了 uniapp和原生小程序方法 video组件兼容iOS手机 custom-cache加了这个属性会让 因此我加了当前手机型号的判断 获取当前设备api 当为iPho

    2023年04月16日
    浏览(41)
  • uniapp 仿网易云音乐播放器 微信小程序

    uniapp 仿照网易云播放器功能

    2024年02月12日
    浏览(119)
  • uniapp—— 微信小程序ios上音频播放没有声音

    uniapp 打包小程序后发现 播放音频文件  没有报错, 一切正常只是没有声音,后来发现是ios手机开启了静音模式导致听不到声音,查看uniapp 文档:  发现的确有这个属性,但是设置了 之后发现并没有起作用 后来发现想要实现ios静音模式下也可以播放音频要用另一个api全局配

    2024年02月13日
    浏览(159)
  • 使用微信小程序播放视频直播

    观众端使用live-player进行直播视频的播放,live-player组件从视频云拉流,并用于实时音视频播放。live-player支持两种模式:Live和RTC,前者用于直播播放,后者用于实时音视频通话。在使用live-player组件实现直播播放前先看看live-player组件的属性以及方法。 属性定义 Src 用于音视

    2023年04月15日
    浏览(62)
  • uni-app 微信小程序 激励视频广告

    封装激励视频-Ad.js 调用上面写的方法:

    2024年02月12日
    浏览(83)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包