当前位置: 首页 > news >正文

微信小程序 - 使用七牛云 API 截取第 n 秒图像为封面图

为什么80%的码农都做不了架构师?>>>   hot3.png

前面分享过七牛的上传操作,在这里说下使用七牛 api 对视频在页面的处理,比如你的视频上传之后获取七牛视频链接,这时候你怎么展示它呢?

在页面可以使用小程序提供的原生组件 video ,可以自己配置视频的播放按钮和封面等等。使用 poster  属性时候需要注意了,这时候我们可以使用视频在七牛的外链,它可以获取指定时刻的单帧画面,具体到精确到毫秒 , 这样是不是很灵活了。使用七牛关于视频截图的接口 :https://developer.qiniu.com/dora/manual/1313/video-frame-thumbnails-vframe

e07a643c6cdeb65b541845279ad9e785877.jpg

4d118d0800a220cd104bf915eb9a740cf38.jpg

参考代码如下

<view class='ve'>
    <video class='tu2' id="myVideo" autoplay="{{autoplay}}" poster='{{videoUrl}}?vframe/jpg/offset/1' src='{{videoUrl}}'></video>
</view>

方法很简单,更多操作参考 api 都可以试试,这里我就不都列出来了。

 

水平有限,若有问题请留言交流!

互相学习,共同进步 :) 转载请注明出处谢谢!

转载于:https://my.oschina.net/hp2017/blog/2249965

相关文章:

  • 《netty入门与实战》笔记-03:数据传输载体 ByteBuf 介绍
  • 【转】使用 lsof 查找打开的文件
  • 实验报告五201521460014 综合渗透
  • EDMA3浅析
  • Lua与C/C++的交互
  • java网络编程之IO
  • 最好用的中间人***工具mitmproxy
  • linuxcentos忘记root管理用户密码 单用户模式维护重置密码操作指引
  • go语言学习初探(一)
  • 神经网络_1
  • 2.0解析系列 | 如何在分布式架构下完美实现“全局数据一致性”?
  • 阿里云中间件推出全新开发者服务
  • H5之VIDEO 标签 视频播放不了MP4视频的问题
  • 作业五:结对项目-四则运算 “软件”之升级版
  • EOS 开发终极神器-vscode (你绝对找不到的干货)
  • ES6系列(二)变量的解构赋值
  • Git学习与使用心得(1)—— 初始化
  • HTML5新特性总结
  • java第三方包学习之lombok
  • Java反射-动态类加载和重新加载
  • js算法-归并排序(merge_sort)
  • MQ框架的比较
  • Node 版本管理
  • SegmentFault 社区上线小程序开发频道,助力小程序开发者生态
  • vue总结
  • 从零开始的无人驾驶 1
  • 代理模式
  • 等保2.0 | 几维安全发布等保检测、等保加固专版 加速企业等保合规
  • 爬虫模拟登陆 SegmentFault
  • 前端面试总结(at, md)
  • 如何使用 OAuth 2.0 将 LinkedIn 集成入 iOS 应用
  • 实现简单的正则表达式引擎
  • 使用docker-compose进行多节点部署
  • 我从编程教室毕业
  • 线性表及其算法(java实现)
  • 学习笔记TF060:图像语音结合,看图说话
  • 移动端解决方案学习记录
  • 用element的upload组件实现多图片上传和压缩
  • 做一名精致的JavaScripter 01:JavaScript简介
  • 宾利慕尚创始人典藏版国内首秀,2025年前实现全系车型电动化 | 2019上海车展 ...
  • ​flutter 代码混淆
  • #pragam once 和 #ifndef 预编译头
  • %3cscript放入php,跟bWAPP学WEB安全(PHP代码)--XSS跨站脚本攻击
  • (2021|NIPS,扩散,无条件分数估计,条件分数估计)无分类器引导扩散
  • (JS基础)String 类型
  • (Redis使用系列) Springboot 使用redis实现接口幂等性拦截 十一
  • (TipsTricks)用客户端模板精简JavaScript代码
  • (zt)基于Facebook和Flash平台的应用架构解析
  • (算法)Game
  • (一)SpringBoot3---尚硅谷总结
  • (一)搭建springboot+vue前后端分离项目--前端vue搭建
  • (原创)攻击方式学习之(4) - 拒绝服务(DOS/DDOS/DRDOS)
  • (转)socket Aio demo
  • (转)程序员疫苗:代码注入
  • (转贴)用VML开发工作流设计器 UCML.NET工作流管理系统