专栏首页hotqin888的专栏微信短视频小程序——视频封面,视频缩略图

微信短视频小程序——视频封面,视频缩略图

源码在:https://gitee.com/AtlantisChina/WeChat-Video,readme里有网盘的视频链接,需要的注意观看。

文字学习在:https://www.cnblogs.com/bozzzhdz/p/9716826.html

显示根据文字,将代码放到自己项目里,后来发现有源码,那直接改源码了。

我这里主要的贡献就是找到了视频封面(视频缩略图)的做法。

thumbTempFilePath

string

视频缩略图临时文件路径

https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html

网上旧的资料比如用什么mpeg啥的转换,微信小程序提供了choosemedia方法获取视频缩略图。

我思考着,视频数据表里存放了视频名称和路径,其实只要存放id和路径就行了。名称是多余的,因为路径里包含了名称。而视频缩略图jpg呢,其实不同存如数据库都行。比如,我上传了视频到硬盘中,同时写入视频数据表。当然,要修改名称为唯一。返回视频存储记录id,然后小程序端收到返回id,再上传缩略图到硬盘,此时根据刚才返回的id,查询视频路径,算出文件名称,将缩略图按这个名称存入硬盘中和视频同一个位置。结束。查询视频的时候,获得视频路径,算出名称,同时也得到缩略图的路径。

不过,我没采用这种方式。我在视频存储表中放了名称,放了视频路径,放了缩略图路径。第一次上传视频后,缩略图路径先空着。然后返回id,小程序再次上传缩略图,根据id查询得到路径和名称,将缩略图存入硬盘相同路径,更新数据表,填写封面缩略图路径。

小程序前端有个坑,就是要注释掉根目录下app.wxss里的container样式,否则播放页面里的各种图标的位置不对或无法显示全图标。

获取视频封面(缩略图)要用choosemedia,不能用choosevideo。

小程序上传文件uploadfile返回的golang的json格式有问题,当返回结构体数据时,无法取到具体值,返回一个值就可以。

服务的我用的是engineercms

主要就是提供视频存储和查询而已。。

服务端的视频播放可以参考上一篇,采用流媒体。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • win10 uwp 获得缩略图 文件缩略图视频小图

    有时候需要获得文件或视频的缩略图。 本文提供两个方法,用于获得文件的缩略图和截取视频指定时间的显示图片。

    林德熙
  • 微信小程序插入视频video标签

    其实效果很简单,原理就是使用video标签,插入一段视频链接即可。 视频链接是在网站上找到的。

    王小婷
  • 「小程序JAVA实战」小程序视频封面处理(48)

    PS:截图也是通过ffmpge的方式,小程序工具的坑很多,官网都没介绍返回截图,但是小程序工具就返回截图了,这就是个坑。

    IT架构圈
  • 微信小程序开发--视频教程系列

    最近,微信小程序特别火,身为拥有10年前后端开发经验的我,对其也是非常的感兴趣,自学摸索了一段时间,有一些经验和体会,准备录制一些的小程序开发的教学视频,分享给...

    一斤代码
  • 小视频app程序开发:抢答!短视频内容存储在哪里?

    不参与小视频app程序开发的小伙伴们可能会有这样的疑惑:当我们把短视频上传至小视频程序中,无论上传者以后在不在线,其他用户都能够及时查看到他发的小视频,这是为什...

    用户4372465
  • 8、微信小程序免费视频教程之for

    <text id="item-{{id}}"">{{content}}</text>

    用户1272076
  • 微信小程序|API音频与视频组件的插入使用

    1、音频组件控制 首先在微信小程序中插入音频组件需首先引入一个audioContext对象,之后再通过 audioId 跟一个audio组件绑定,通过它可以操作...

    算法与编程之美
  • 「小程序JAVA实战」小程序上传短视频(46)

    Page({ data: { poster: 'http://y.gtimg.cn/music/photonew/T002R300x300M000003rsKF...

    IT架构圈
  • 【视频教程】微信小程序开发【一个实例】

    这两天,抽空花了点时间,快速的写了个稍微那么实际一点的小程序代码,当做练手了。这个小程序带了一个比较简单的Node.js做的Server端(仍然用Sails.j...

    一斤代码
  • 9、微信小程序免费视频教程之模板

    需要使用template标签,然后给该标签指定一个name属性。接着就可以在该标签内写入一些代码片段。

    用户1272076
  • 从抖音到多闪,今日头条的短视频社交简史

    公元前400年,希波克拉提斯把那些过于害羞的人描述为“喜欢在黑暗中生活”,这就是「社交恐惧」的源头;

    mixlab
  • 5G时代来临,前端开发工程师必须了解的音视频入门基础知识

    本文将给大家进行音视频基础的常规知识点的梳理。当然,短短的一篇文章并不能让大家立即变成音视频领域的专家,但这些知识点已经基本涵盖了音视频的入门知识。我们将按照下...

    IMWeb前端团队
  • 新浪微博技术分享:微博短视频服务的优化实践之路

    本文来自新浪微博视频转码平台技术负责人李成亚在LiveVideoStackCon 2017上的分享,由LiveVideoStack整理成文。李成亚分享了微博短视...

    JackJiang
  • 视频编解码学习分享

    要解决视频存储难、传输难的问题,综合考虑软硬件成本,最有效的办法应该是压缩视频体积!

    MelonTeam
  • 微信小程序开发实战(15):视频组件(video)

    video组件用于播放网络或本地视频。video组件中最常用的属性是src,用于指定视频文件的路径,例如,下面的布局代码会播放一个网络视频文件。

    蒙娜丽宁
  • 短视频UGC常见问题(FAQ)

    快速开始:https://cloud.tencent.com/document/product/584/9457

    腾讯视频云-Zachary
  • 7、微信小程序免费视频教程之模块化

    <text id="item-{{id}}"">{{content}}</text>

    用户1272076
  • 视频播放优化浅析

    随着移动终端的普及和网络的提速,以短视频为媒介的内容成了大家普遍接受和喜欢的内容消费形式。但是短视频是如何从一个视频地址到我们能看见的音视频内容呢?我们都知道...

    微信终端开发团队
  • 计算机基础知识

    电子计算机在短短的50年内经历了:[1946~1958]电子管,[1968~1965]晶体管,[1965~1970]中、小规模集成电路(IC),[1970~]大...

    ellipse

扫码关注云+社区

领取腾讯云代金券