Home  >  Article  >  Web Front-end  >  How to solve the problem of sound playing error in uniapp

How to solve the problem of sound playing error in uniapp

藏色散人
藏色散人Original
2021-02-03 11:47:436339browse

Solution to uniapp sound playback error: 1. Open the corresponding code file, and then directly execute the object play method to replace the original src path; 2. Update the development tool version.

How to solve the problem of sound playing error in uniapp

The operating environment of this tutorial: windows7 system, uni-app2.5.1 version, DELL G3 computer.

uni-app Voice file playback problem, innerAudioContext cannot be destroyed! ! !

##uni-app Voice createInnerAudioContext object cannot be destroyed and crashes! ! !

I found that the voice could not be played during packaging today, so I looked for the reason. I remembered that this problem had been dealt with, so I quickly found the problem. I used the wrong project and used the original one for packaging. This error It's really unforgivable.

I would like to record the error that the voice cannot be played today. Voice playback is created using the built-in uni.createInnerAudioContext();. When playing, an error is reported and crashes.

Post the code, this is how I wrote it. When the current method is called, paste the code directly. This is wrong. Don't copy it directly, brother.

<script>
	const  innerAudioContext = uni.createInnerAudioContext();data() {
			return {```};
		},
		methods: {
		hechengAudio(audioPram) {
				// innerAudioContext.stop();
				var dd = audioPram.replace(/<\/?.+?>/g, "");
				audioPram = dd.replace(/ /g, ""); //dds为得到后的内容

				if (audioPram != this.startAudio) {
					this.startPage = false;
				}
				var url = this.getMp3 + &#39;cuid=&#39; + uni.getSystemInfoSync().version + &#39;&lan=zh&ctp=1&tok=&#39; + this.$token() +
					&#39;&tex=&#39; +
					audioPram + &#39;&vol=5&per=0&spd=6&pit=5&aue=3&#39;;
				// console.log(JSON.stringify(resSave));
				console.log(url);
				// #ifdef APP-PLUS


				// 下面这两句是重点, 拿本本记下..............
				 if (innerAudioContext != undefined) {
				 	innerAudioContext.stop();
				 }
				 innerAudioContext = uni.createInnerAudioContext();
				// 上面这两句是重点, 拿本本记下..............


			 this.pageValue = this.value; 
				console.log(&#39;src是空的吗 -----------&#39; + url)
				innerAudioContext.stop();
				innerAudioContext.src = url;
				innerAudioContext.play();// 				if (url != &#39;&#39;) {// 					innerAudioContext.play();// 				} else {// 					console.log(&#39;src是空的吗 -----------&#39; + url)// 					uni.showToast({// 						title: &#39;src是空的 不能执行&#39;,// 						mask: true,// 						duration: 2000,// 						icon: "none"// 					});// // 					return// 				}
				innerAudioContext.onPlay(() => {
					console.log(&#39;开始播放&#39;)
				})
				innerAudioContext.onStop(() => {
					console.log(&#39;i am onStop&#39;)
					//播放停止,销毁该实例
					// innerAudioContext.stop()
				})
				innerAudioContext.onEnded(() => {
					console.log(&#39;i am onEnded&#39;)
					//播放结束,销毁该实例
					// innerAudioContext.stop()
					console.log(&#39;已执行destory()&#39;)
				})
				innerAudioContext.onError((res) => {
					console.log(result.errMsg)
					console.log(result.errCode)
					// innerAudioContext.stop()
				})
				// #endif
				// #ifdef MP-WEIXIN
				var that = this;
				uni.downloadFile({
					url: url,
					success(res) {
						if (innerAudioContext != undefined) {
							innerAudioContext.stop();
						}
						innerAudioContext = uni.createInnerAudioContext();
						that.pageValue = that.value;
						innerAudioContext.src = res.tempFilePath;
						innerAudioContext.play();
						innerAudioContext.onPlay(() => {
							console.log(&#39;开始播放&#39;)
						})
						innerAudioContext.onStop(() => {
							console.log(&#39;i am onStop&#39;)
							innerAudioContext.stop()
							//播放停止,销毁该实例
							innerAudioContext.stop()


						})
						innerAudioContext.onEnded(() => {
							console.log(&#39;i am onEnded&#39;)
							//播放结束,销毁该实例
							innerAudioContext.stop()
							console.log(&#39;已执行destory()&#39;)
						})
						innerAudioContext.onError((res) => {
							console.log(result.errMsg)
							console.log(result.errCode)
							innerAudioContext.stop()
						})
					}
				})
				// #endif


			},

		},			}</script>

When you see the two lines of code above, remember not to destroy it, just execute the object play method directly. This method uses an object, which will replace the original src path by default and can be played directly.

Another reason is that the version of the development tool is too old. My current version is 1.6.2. Mainly This version of the process has fewer problems.

The following code can be copied

<script>
	const  innerAudioContext = uni.createInnerAudioContext();data() {
			return {```};
		},
		methods: {
		hechengAudio(audioPram) {
				// innerAudioContext.stop();
				var dd = audioPram.replace(/<\/?.+?>/g, "");
				audioPram = dd.replace(/ /g, ""); //dds为得到后的内容

				if (audioPram != this.startAudio) {
					this.startPage = false;
				}
				var url = this.getMp3 + &#39;cuid=&#39; + uni.getSystemInfoSync().version + &#39;&lan=zh&ctp=1&tok=&#39; + this.$token() +
					&#39;&tex=&#39; +
					audioPram + &#39;&vol=5&per=0&spd=6&pit=5&aue=3&#39;;
				// console.log(JSON.stringify(resSave));
				console.log(url);
				// #ifdef APP-PLUS
			 this.pageValue = this.value; 
				console.log(&#39;src是空的吗 -----------&#39; + url)
				innerAudioContext.stop();
				innerAudioContext.src = url;
				innerAudioContext.play();
				innerAudioContext.onPlay(() => {
					console.log(&#39;开始播放&#39;)
				})
				innerAudioContext.onStop(() => {
					console.log(&#39;i am onStop&#39;)
					//播放停止,销毁该实例
					// innerAudioContext.stop()
				})
				innerAudioContext.onEnded(() => {
					console.log(&#39;i am onEnded&#39;)
					//播放结束,销毁该实例
					// innerAudioContext.stop()
					console.log(&#39;已执行destory()&#39;)
				})
				innerAudioContext.onError((res) => {
					console.log(result.errMsg)
					console.log(result.errCode)
					// innerAudioContext.stop()
				})
				// #endif
				// #ifdef MP-WEIXIN
				var that = this;
				uni.downloadFile({
					url: url,
					success(res) {
						if (innerAudioContext != undefined) {
							innerAudioContext.stop();
						}
						innerAudioContext = uni.createInnerAudioContext();
						that.pageValue = that.value;
						innerAudioContext.src = res.tempFilePath;
						innerAudioContext.play();
						innerAudioContext.onPlay(() => {
							console.log(&#39;开始播放&#39;)
						})
						innerAudioContext.onStop(() => {
							console.log(&#39;i am onStop&#39;)
							innerAudioContext.stop()
							//播放停止,销毁该实例
							innerAudioContext.stop()


						})
						innerAudioContext.onEnded(() => {
							console.log(&#39;i am onEnded&#39;)
							//播放结束,销毁该实例
							innerAudioContext.stop()
							console.log(&#39;已执行destory()&#39;)
						})
						innerAudioContext.onError((res) => {
							console.log(result.errMsg)
							console.log(result.errCode)
							innerAudioContext.stop()
						})
					}
				})
				// #endif


			},

		},			}</script>

Recommended: "

uniapp tutorial"

The above is the detailed content of How to solve the problem of sound playing error in uniapp. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn