uniapp中发布为H5，在微信中自动播放音频和视频。-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp中发布为H5，在微信中自动播放音频和视频。。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

uniapp中发布为H5，在微信中自动播放音频和视频。

音频自动播放

安装微信jssdk

	npm install jweixin-module --save

页面内使用：


	var jweixin = require('jweixin-module');	//引入jssdk
	
	this.innerAudioContext = uni.createInnerAudioContext();
	this.innerAudioContext.src = '音频路径';
	this.innerAudioContext.autoplay = true;
	this.innerAudioContext.loop = true;
	this.innerAudioContext.onPlay(() => {
		console.log('开始播放');
	});
	this.innerAudioContext.onError((res) => {
		console.log(res.errMsg);
		console.log(res.errCode);
	});
	jweixin.config({}); // 模拟签名
	let that = this;
	jweixin.ready(function() {
		WeixinJSBridge.invoke('getNetworkType', {}, function(e) {
			that.innerAudioContext.play();
		})
	})

这块最关键的就是引入jssdk！。经测试，音频自动播放效果相对稳定，兼容性也比较好。

视频自动播放

安装微信jssdk

npm install jweixin-module --save

页面内使用

<template>
	 <video  :src="src" class="video-block" autoplay="false" controls @play="playing" id="myVideo"></video>
</template>

<script>
	var jweixin = require('jweixin-module');
	playing(e){
		console.log("开始播放");
	}
	configMedia(){
		this.videoContext = uni.createVideoContext('myVideo');
		jweixin.config({}); // 模拟签名
		let that = this;
		this.$nextTick(()=>{					
			jweixin.ready(function() {
				WeixinJSBridge.invoke('getNetworkType', {}, function(e) {
					that.videoContext.play();
				})
			})
		})
	}		

</script>