Home  >  Article  >  Web Front-end  >  What should I do if I get an error when implementing the recording function in uniapp?

What should I do if I get an error when implementing the recording function in uniapp?

PHPz
PHPzOriginal
2023-04-20 15:05:371251browse

With the development of mobile Internet technology, the development of mobile applications has become a necessary skill. Cross-platform development based on the uniapp framework optimizes developers' work efficiency. However, when implementing the recording function in uniapp, we may encounter some errors. Let’s take a look at these problems and their solutions.

Question 1: wx api is not declared or is not in the current module

First of all, we need to make it clear: uniapp is built on the basis of the vue framework, so its API part is the same as the vue API akin. If you encounter this problem, the reason is because we did not declare it after introducing the wx api.

Solution:
We need to introduce wx api into vue and declare it in the code before it can be used. The sample code is as follows:

import wx from 'uni-app/weixin.js';
export default{
   data(){
      return {
          recoderManager:null   // 声明参数
      }
   },
   //在mounted部分进行wx api的声明
   mounted(){
      this.recoderManager = wx.getRecorderManager()
   }
}

Question 2: recorder.start is not a function

This problem is obvious, that is, when we call recorder.start(), an error is reported. The reason is that we did not instantiate the recorderManager correctly.

Solution:
We need to instantiate wx api in the mounted part. Refer to the code below:

import wx from 'uni-app/weixin.js';
export default{
   data(){
      return {
          recoderManager:null   // 声明参数
      }
   },
   //在mounted部分进行wx api的实例化
   mounted(){
      this.recoderManager = wx.getRecorderManager()
   },
   methods:{
      //在该方法中可以调用 start()方法
      recoding(){
           this.recoderManager.start({   //注意参数
                 duration:60000,
                 format:'mp3'
           });
           //当录音结束后触发该函数
           this.recoderManager.onStop((res)=>{
               var voice = res.tempFilePath   //得到当前录音的文件路径
           })
      },
   }
}

Question 3: recorder.start fail: start audiomanager unsuccessfully

This problem may occur on iOS devices. The reason is that the current browser does not support it, or the audio permission is disabled. The solution is as follows:

Solution:
We need to enter the settings page and check whether the current application has obtained audio permissions. If the audio permission is disabled, we need to enable it. In addition, we can try to upgrade the browser version, which may solve such problems.

The above are three common problems and their solutions when uniapp implements the recording function. If you follow the above steps, you should be able to avoid these problems.

The above is the detailed content of What should I do if I get an error when implementing the recording function 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