微信小程序H5 uniapp

       最近微信小程序对有视频播放的审核严,需要提供“文娱类资质”。而申请这个资质比较繁琐。所以我们在小程序上用web-view做跳转到H5,H5使用uniapp编写。这是小程序关于web-view文档说明。https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

开发前配置,需要到微信公众平台,登入小程序的开发管理页面配置业务域名,仅支持https

下面直接上代码:

  1. 小程序wxml页面     
  2. 小程序js,注意这里我们跳转的是h5的页面地址,开始调试时,真机预览时打开小程序设置“开发调试”,这样就不会校验域名。
  3. uniapp页面
    <video id="myVideo" ref="myVideo" :src="pageData.ware_url" :muted="false":autoplay="true":http-cache ="false":show-mute-btn="true":style="{'width':'100%','height':type == 2 ? '95rpx': '360rpx'}"errorTip=""@play="doPlay" @pause="doPause"@ended="doEnd" @error="videoErrorCallback" controls></video>

  4. 这里使用的是uniapp打包成H5,然后用nginx配置该工程打包后的页面路径

  5. 在调试播放视频这块,因ios和android兼容问题调试了很久,过程中有出现如下几个问题

         5.1、视频设置自动播放,ios可以,安卓不行,已经设置了静音播放

         5.2、视频不设置自动播放,设置初始播放位置,android可以。ios不行,点击开始播放后进度条不会变,一直停留在开始位置。

         5.3、试过用uniapp插件市场上的 "x-video"、腾讯视频播放器“tcplayer”,均不能解决ios和android都能满足 指定视频播放初始位置和自动播放

      6.最终还是使用uniapp的“video”组件。利用“@play”时间判断是否有在播放。想过业务逻辑可以用“isPause”字段判断当前是否有在播放中

        写这边文章是为了有需要的朋友提供一下调试的思路,也尽量能避免踩坑,和在坑里白耗费时间。我从开始接入web-view到最终确定方案并测试成功花了四天半,期中周末占了一天半。不过前面两天是因为我们播放视频的问题,一直在ios真机上播放不了,还找了各种编码资料,最后才发现是这个视频有问题,重新下载在上传到七牛,解决了。找对思路真的很重要。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/147438.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

硬件工程师基础能力课

第一课时--基本定理、电阻、电容等 首先了解下面几个概念&#xff0c;基尔霍夫定理&#xff1a;KCL & KVL&#xff0c;叠加定理&#xff0c;戴维南定理&#xff08;电压源等效&#xff09;和诺顿定理&#xff08;电流源等效&#xff09;、奈奎斯特采样定理。 上面说的这些东…

vue的生命周期分别是什么?

Vue的生命周期分为8个阶段&#xff0c;分别是&#xff1a; beforeCreate&#xff1a;实例初始化之后&#xff0c;数据观测 (data observer) 和 event/watcher 事件配置之前被调用。 created&#xff1a;实例已经创建完成后被调用&#xff0c;这时候实例已完成以下的配置&#…

asp.net core EF Sqlserver

一、EF CORE的使用 1、使用NuGet来安装EF CORE 使用程序包管理器控制台&#xff0c;进行命令安装 //安装 Microsoft.EntityFrameworkCoreInstall-Package Microsoft.EntityFrameworkCore //安装 Microsoft.EntityFrameworkCore.SqlServer Install-Package Microsoft.EntityF…

Uniapp有奖猜歌游戏系统源码 带流量主

有奖猜歌游戏是一款基于uni-app、uniCloud、uniAD 开发的小游戏,通过猜歌曲、观看广告赚取现金奖励。 本游戏基本特征如下: 1、玩家可以通过猜歌、做任务等方式直接获取现金奖励 2、玩家可以通过猜歌、拆红包、做任务等方式获取金币奖励,当金币累积到一定数量可以兑换现金 3…

产品运营的场景和运营策略

一、启动屏 1&#xff0e;概念 启动屏&#xff0c;特指 APP 产品启动时即显示的界面&#xff0c;这个界面一般会停留几秒钟时间&#xff0c;在这个时间内 APP 会在后台加载服务框架、启动各种服务 SDK 、获取用户地理位置、判断有无新版本、判断用户账户状态以及其他系统级别的…

微机原理_12

一、单项选择题(本大题共15小题,每小题3分&#xff0c;共45分。在每小题给出的四个备选项中&#xff0c;选出一个正确的答案。〕 十进制正数56的 8位二进制补码是()。 A. 00011001 B. 10100110 C. 10011001 D. 00100110 若栈顶的物理地址为20100H&#xff0c;当执行完指令PUSH…

qt 重载信号,使用““方式进行connect()调用解决方案

问题 在Qt中&#xff0c;重载的信号默认是无法使用&这种方式调用的。 因为&只能绑定到一个具体的信号&#xff0c;而重载的信号名称相同&#xff0c;编译器无法确定要绑定哪一个信号。 解决方案 如果非要使用&绑定重载的信号&#xff0c;可以使用函数指针进行转…

2023年道路运输企业主要负责人证考试题库及道路运输企业主要负责人试题解析

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 2023年道路运输企业主要负责人证考试题库及道路运输企业主要负责人试题解析是安全生产模拟考试一点通结合&#xff08;安监局&#xff09;特种作业人员操作证考试大纲和&#xff08;质检局&#xff09;特种设备作业人…

2023-11-18

早上把 kernel pwn 相关的总结的差不多了. 然后下午主要就学习了一下 ebpf 相关的知识, 晚上然后复现了两道 pwn 题. 一天就这样过去了...... 明日计划: 早上做一道 qemu 逃逸题目, 然后肝作业

基于SpringBoot的SSMP整合案例(消息一致性处理与表现层开发)

消息一致性处理 在后端执行完相应的操作后&#xff0c;我们需要将执行操作后的结果与数据返回前端&#xff0c;前端 调用我们传回去的数据&#xff0c;前端是如何知道我们传回去的数据名称的&#xff1f; 答&#xff1a;前后端遵循了同一个"协议"。这个协议就是定义…

【STM32】CRC(循环冗余校验)

一、CRC的背景知识 1、什么是CRC (1)CRC&#xff08;Cyclic Redundancy Check&#xff09;&#xff0c;循环冗余校验 (2)什么是校验&#xff0c;为什么需要校验&#xff1a;数据传输&#xff0c;数据存储过程中需要使用到的 (3)什么是冗余&#xff1a;表示比实际上要传输的数据…

docker 安装mongodb 实现 数据,日志,配置文件外挂

docker 安装mongodb 实现数据&#xff0c;日志&#xff0c;配置文件外挂 1 背景 最近开发了一个评论系统之前用mysql来存储数据&#xff0c;但是考虑到后期业务增大访问量也会增大&#xff0c;为了兼容这种高并发的场景&#xff0c;因此经过多方面的考虑&#xff0c;我们最终…

C语言--每日五道练习题--Day18

第一题 1.设a为整型变量&#xff0c;不能正确表达数学关系&#xff1a;10<a<15的C语言表达式是&#xff08;&#xff09; A&#xff1a;10<a<15 B&#xff1a;a11|| a12 || a13 || a14 C&#xff1a;a>10 && a<15 D&#xff1a;!(a<10) &&…

2023年咸阳市《网络建设与运维》赛题解析------四、安全配置

安全配置 说明:IP地址按照题目给定的顺序用“ip/mask”表示,IPv4 any地址用0.0.0.0/0,IPv6 any地址用::/0,禁止用地址条目,否则按零分处理。 1.FW1配置IPv4 nat,实现集团产品1段IPv4访问Internet IPv4,转换ip/mask为200.200.200.16/28,保证每一个源IP产生的所有会话将…

Spring+Mybatis整合

整合代码 源码执行流程

Java拼图游戏

运行出的游戏界面如下&#xff1a; 按住A不松开&#xff0c;显示完整图片&#xff1b;松开A显示随机打乱的图片。 User类 package domain;/*** ClassName: User* Author: Kox* Data: 2023/2/2* Sketch:*/ public class User {private String username;private String password…

超详细 | 萤火虫算法原理及其实现(Matlab)

群智能(Swarm Intelligence&#xff0c;SI)是一类分散自组织系统的集体智能行为的总称&#xff0c;该表述最早在1989年由Gerardo Beni在分子自动机系统中提出。SI系统可视作一组简单的个体&#xff0c;其个体与个体、个体与环境之间存在交互作用&#xff0c;最终表征出智能行为…

MPN – 制造零件号

S/4 1610 中的 MPN – 基于 NAST 的输出管理 我试图查找有关 MPN 设置的信息&#xff0c;但找不到详细的配置步骤。在浏览了一些信息和 help.sap 链接后&#xff0c;我能够在 S/4 1610 系统中配置 MPN 设置&#xff0c;这与使用旧输出类型&#xff08;Nast 和输出类型 NEU&…

【 云原生 | K8S 】kubeadm 部署Kubernetes集群

目录 1 环境准备 2 所有节点安装docker 3 所有节点安装kubeadm&#xff0c;kubelet和kubectl 4 部署K8S集群 4.1 查看初始化需要的镜像 4.2 初始化kubeadm 4.3 设定kubectl 4.4 所有节点部署网络插件flannel master&#xff08;2C/4G&#xff0c;cpu核心数要求大于2&am…

Jenkins代码检测和本地静态检查

1&#xff1a;Jenkins简介 Jenkins是一个用Java编写的开源的持续集成工具&#xff1b;Jenkins自动化部署可以解决集成、测试、部署等重复性的工作&#xff0c;工具集成的效率明显高于人工操作&#xff1b;并且持续集成可以更早的获取代码变更的信息&#xff0c;从而更早的进入测…