返回顶部
首页 > 资讯 > 精选 >【uniapp】视频分享预览小程序
  • 142
分享到

【uniapp】视频分享预览小程序

uni-app音视频小程序 2023-08-17 09:08:01 142人浏览 泡泡鱼
摘要

六一收到个不同以往的需求,我的指导老师最近有点忙,让我们帮忙做一个可以通过二维码预览视频的小程序 收到需求后,因为只是临时用一下,不打算写一套完整的系统,所以大概的思路就是,其他成员将视频通过ftp传入我的服务器上,我通过uniapp将视

六一收到个不同以往的需求,我的指导老师最近有点忙,让我们帮忙做一个可以通过二维码预览视频的小程序
在这里插入图片描述

收到需求后,因为只是临时用一下,不打算写一套完整的系统,所以大概的思路就是,其他成员将视频通过ftp传入我的服务器上,我通过uniapp将视频路径写死在index页面上,跳转时将url中的参数传入到下一个页面即可,视频播放页面通过拼接路径最后得到完整的src资源文件,在写入data完成渲染即可,同理在点击生成二维码时将参数带着去新的页面进行处理,得到该视频播放页面的url后利用qrcode进行渲染输出二维码

basic:[{"name":"蔡晓东英雄事迹","url":"/pages/video/video?url=1.mp4"},{"name":"云南传统手工业银器制作","url":"/pages/video/video?url=2.mp4"},{"name":"高山流水的典故","url":"/pages/video/video?url=3.mp4"}''''''

index页面

点击预览,跳转到视频播放页面
点击qrcode,跳转到二维码生成页面
在这里插入图片描述

视频播放页面

资源渲染后即可直接播放,这部分的代码找了好久,起初以为uniapp没有支持网页播放的能力,需要用第三方的。

在这里插入图片描述

qrcode页面

可自定义中心图标logo
在这里插入图片描述

完整代码包,已经打包上传,需要的请后面看评论区!

来源地址:https://blog.csdn.net/qq_35230125/article/details/130996407

--结束END--

本文标题: 【uniapp】视频分享预览小程序

本文链接: https://lsjlt.com/news/372588.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 【uniapp】视频分享预览小程序
    六一收到个不同以往的需求,我的指导老师最近有点忙,让我们帮忙做一个可以通过二维码预览视频的小程序 收到需求后,因为只是临时用一下,不打算写一套完整的系统,所以大概的思路就是,其他成员将视频通过ftp传入我的服务器上,我通过uniapp将视...
    99+
    2023-08-17
    uni-app 音视频 小程序
  • uniapp小程序分享uni.share给好友
    用uniapp写这个功能的时候最重要的点是:要把uni.share写在一个button按钮上,否则不生效。 分享给好友(示例图片) 代码实现 html代码 分享 js代码 shareFriends() {uni.share({provid...
    99+
    2023-08-17
    uni-app 小程序 javascript
  • uniapp小程序分享功能onShareAppMessage函数传参数
    使用onShareAppMessage函数。在页面的js文件中定义了 onShareAppMessage 函数时,页面可以表示该页面可以转发。可以在函数中设置页面转发的信息。 (1)只有定义了该函数,小程序右上角的菜单中才会有转发按钮 (2...
    99+
    2023-09-13
    uni-app 小程序 前端
  • 【uniapp小程序】视图容器cover-view
    🍒观众老爷们好呀,这里是前端小刘不怕牛牛频道,小程序系列又更新新文章啦,今天的内容是uniapp小程序的视图容器,cover-view 🍒准备好了吗?那我们就发车啦...
    99+
    2023-09-03
    小程序 前端 微信小程序
  • uniapp微信小程序分包
    目录 一. 分包的概念 1. 什么是分包 2. 分包的好处 3. 分包后项目的构成 4. 分包加载规则 5. 分包体积限制 二. 分包的方法 1. 分包后的目录结构 2. 配置manifest.json 3. 配置pages.json 4....
    99+
    2023-09-10
    微信小程序 uni-app 小程序
  • 微信小程序和uniapp高频面试题
    一.微信小程序主要目录和文件的作用? 1.project.config.json项目配置文件,做一些个性化配置,例如界面颜色、编译配置等等 2.app.json当前小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 ...
    99+
    2023-09-07
    微信小程序 uni-app 小程序
  • 小程序预览码怎么生成
    本篇内容主要讲解“小程序预览码怎么生成”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“小程序预览码怎么生成”吧!撸起袖子从后端开始为了省事,直接把前后端的东西放在一起。先看看入口文件index.j...
    99+
    2023-06-26
  • 基于java微信小程序视频分享平台系统设计与实现
    开发概要 小程序开发:微信开发者工具(MINA框架) 后台环境:JDK1.8 + Tomcat8 后台开发语言:Java 后台开发框架:springboot 后台模板引擎:Thymeleaf 后台开发工具:Idea2020 ...
    99+
    2023-09-05
    java 微信小程序 开发语言 Powered by 金山文档
  • 如何搭建小程序音视频
    这篇文章主要介绍了如何搭建小程序音视频的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇如何搭建小程序音视频文章都会有所收获,下面我们一起来看看吧。升级微信到最新版本,发现页卡 => 小程序 => 搜索...
    99+
    2023-06-26
  • 微信小程序——video视频播放
    1、功能介绍 可以实现视频的播放暂停,发送弹幕,获取视频所处位置等。 2、video组件 1、用处 video组件常用于视频的播放,默认宽度为300px,高度为225px。 2、属性       3、index.js中的数据部分 data:...
    99+
    2023-09-13
    音视频 小程序 微信小程序 微信 前端
  • 7分钟视频:Win10预览版不容错过的重点
     北京时间1月22日凌晨,微软正式发布适用于桌面系统的全新Win10预览版, 在视频中,Windows 10 For Phone部门主管Joe Belfiore(乔北峰)将详细为大家介绍Windows 10和...
    99+
    2023-06-10
    Win10 视频 预览 重点
  • 分享两个小程序
      小编也不知道大家能不能用的到,我只是把我学到的知识分享出来,有需要的可以看一下。python本身就是一个不断更新改进的语言,不存在抄袭,有需要就可以拿过来用,在用的过程中,你发现可以用另外一种方法把它实现,就可以把代码做进一步的优化,...
    99+
    2023-01-30
    两个 程序
  • uniapp实现小程序页面转发和分享到朋友圈
    借助uniapp中页面生命周期钩子onShareAppMessage(OBJECT)用户点击右上角分享 在 js 中定义 onShareAppMessage 处理函数(和 onLoad 等生命周期函数...
    99+
    2023-09-25
    小程序 uni-app 微信小程序
  • uniapp实现微信小程序全局分享的示例代码
    目录创建全局分享内容文件引入并全局注册该文件自定义页面分享内容 uniapp 实现微信小程序的全局转发给好友/分享到朋友圈的功能。主要使用 Vue.js 的 全局混入 概念。 下面直...
    99+
    2024-04-02
  • 音频视频剪辑小程序有哪些作用
    这篇文章主要介绍“音频视频剪辑小程序有哪些作用”,在日常操作中,相信很多人在音频视频剪辑小程序有哪些作用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”音频视频剪辑小程序有哪些作用”的疑惑有所帮助!接下来,请跟...
    99+
    2023-06-26
  • uniapp介绍与使用以及小程序实时获取视频播放时间
    目录一、uni-app介绍1、诞生背景2、uni-app是什么(what、where)3、uni-app的优势(why)二、使用uni-app(how)1、下载安装&...
    99+
    2023-02-18
    小程序实时获取视频播放时间的方法 uniapp发布小程序 小程序获取视频时长
  • uniapp-微信小程序 分包--详解
    uniapp-微信小程序 分包–详解 实际环境(用business举例,可以创建很多个分包) 先说好,如果代码模块多,就一个一个模块搞(照着做不会错) 直入主题,我代码写完了,一真机运行,g,发现超过...
    99+
    2023-09-03
    微信小程序 uni-app 小程序 前端
  • 微信小程序怎么调用视频
    这篇文章主要介绍了微信小程序怎么调用视频的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇微信小程序怎么调用视频文章都会有所收获,下面我们一起来看看吧。wx.chooseVideo(OBJECT)拍摄视频或从手机相...
    99+
    2023-06-26
  • 微信小程序跳转到视频号
    微信小程序跳转到视频号 前言打开视频号主页前提: 若小程序与视频号的主体相同或为关联主体,可以通过wx.openChannelsUserProfile跳转到视频号主页。主体判断逻辑: 相关api:wx.openChanne...
    99+
    2023-08-17
    微信小程序 小程序打开视频号 小程序跳转视频号 小程序打开视频号直播
  • Python视频教程百度云免费分享
      与现在流行的编程语言Java、C、C++等相比较,同样是完成一个功能,Python编写的代码短小精干,开发的效率是其它语言的好几倍。所以如果你想尝试成为程序员,Python将会是一个重要的选择,Python是最适合的入门语言。接下来...
    99+
    2023-01-31
    视频教程 Python
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作