微信小程序有的机型无法播放m3u8格式的直播流,使用H5在微信环境里播放

我这测试鸿蒙的还有苹果X及部分机型在微信小程序里无法播放,不知道什么原因;

直播流地址有的是hevc有的是h.264,音频都是aac;

<head>
	<meta charset="UTF-8">
	<title>前端播放m3u8格式视频</title>
	<meta name="viewport"
		content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
	<link href="https://cdn.bootcdn.net/ajax/libs/video.js/7.10.1/alt/video-js-cdn.min.css" rel="stylesheet">
	<script src="https://cdn.bootcdn.net/ajax/libs/video.js/7.10.1/alt/video.core.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"
		type="text/javascript"></script>
	<!-- <link href="https://cdn.bootcdn.net/ajax/libs/video.js/7.10.2/alt/video-js-cdn.css" rel="stylesheet">
	<script src="./video.core.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js">
	</script> -->

	<style>
		* {
			margin: 0;
			padding: 0;
			border: none;
		}

		.video-js .vjs-big-play-button {
			font-size: 2.5em !important;
			line-height: 2.3em !important;
			height: 2.5em !important;
			width: 2.5em !important;
			-webkit-border-radius: 2.5em !important;
			-moz-border-radius: 2.5em !important;
			border-radius: 2.5em !important;
			background-color: #73859f;
			background-color: rgba(115, 133, 159, 0.5) !important;
			border-width: 0.15em !important;
			margin-top: -1.25em !important;
			margin-left: -1.75em !important;
		}

		.vjs-big-play-button .vjs-icon-placeholder {
			font-size: 1.63em !important;
		}

		.video-js .vjs-tech {
			position: relative !important;
		}

		.myvideo-dimensions,
		.video-js {
			width: 100%;
			height: 400px;
		}
	</style>
</head>

<body>
	<div>
		<video id='myvideo' class="video-js vjs-default-skin vjs-big-play-centered" controls>
			<!-- hls直播源地址:CCTV1高清 -->
			<source type="application/x-mpegURL" id="source-box">
		</video>
		<!-- <div id="bo" onclick="bofang()">播放</div> -->
		<script>
		
			let src ='放入你的直播地址';
			let sourceBox = document.getElementById('source-box');
			sourceBox.setAttribute("src", src);
			var player = videojs('myvideo', {}, function() {
				console.log('videojs播放器初始化成功')
			})
			player.play();

			function bofang() {
				player.play();
			}
		</script>
	</div>
</body>

这个还是有问题,有的直播地址在鸿蒙和苹果上都有声音,有的是鸿蒙上有声音,但是苹果上没有,也没找几个手机,测试的不准,不知道问题出在哪里,有可能是直播流的格式问题;但是也不确定

相关推荐
计算机-秋大田11 小时前
基于微信小程序的校园失物招领系统设计与实现(LW+源码+讲解)
java·前端·后端·微信小程序·小程序·课程设计
Goat恶霸詹姆斯12 小时前
微信小程序压缩图片
微信小程序·小程序
计算机-秋大田13 小时前
基于微信小程序的汽车保养系统设计与实现(LW+源码+讲解)
spring boot·后端·微信小程序·小程序·课程设计
程序员徐师兄15 小时前
Java 基于 SpringBoot 的校园外卖点餐平台微信小程序(附源码,部署,文档)
java·spring boot·微信小程序·校园外卖点餐·外卖点餐小程序·校园外卖点餐小程序
Q_274378510916 小时前
springboot基于微信小程序的周边游小程序
spring boot·微信小程序·小程序
计算机学姐17 小时前
基于微信小程序的民宿预订管理系统
java·vue.js·spring boot·后端·mysql·微信小程序·小程序
寰宇软件19 小时前
PHP防伪溯源一体化管理系统小程序
小程序·uni-app·vue·php
trabecula_hj20 小时前
微信小程序中实现进入页面时数字跳动效果(自定义animate-numbers组件)
微信小程序·小程序
菜鸟码神20 小时前
微信小程序隐藏右侧胶囊按钮,分享和关闭即右侧三个点和小圆圈按钮
微信小程序·小程序
大叔_爱编程1 天前
wx035基于springboot+vue+uniapp的校园二手交易小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计