当前位置:   article > 正文

震惊!!!app,小程序居然可以实现录音功能了_uniapp调用录音

uniapp调用录音

app录音上传文件可以采用uniapp的方法,地址:uni.getRecorderManager() | uni-app官网

代码如下:

  1. const recorderManager = uni.getRecorderManager();
  2. const innerAudioContext = uni.createInnerAudioContext();
  3. innerAudioContext.autoplay = true;
  1. data() {
  2. return {
  3. text: 'uni-app',
  4. voicePath: ''
  5. }
  6. },
  1. onLoad() {
  2. let self = this;
  3. recorderManager.onStop(function (res) {
  4. console.log('recorder stop' + JSON.stringify(res));
  5. self.voicePath = res.tempFilePath;
  6. });
  7. },

这里onload里面这个res.tempFilePath返回的是文件路径可以配合uni.uploadFile方法进行上传

  1. recorderManager.onStop(function(res) {
  2. let token = self.$tool.localStorage.get('user_token');
  3. let imgHeader = {
  4. 'Authorization': 'Bearer ' + token,
  5. 'platform': 'app'
  6. };
  7. uni.uploadFile({
  8. url: self.$config.SERVERURL + "/proposal/XXX", (上传接口实例)
  9. filePath:res.tempFilePath,
  10. name: 'file',
  11. header: imgHeader,
  12. formData: {
  13. 'proposalId': self.proposalObj.proposalId
  14. },
  15. success: (uploadFileRes) => {
  16. console.log(uploadFileRes.data);
  17. self.tapeUrl = JSON.parse(uploadFileRes.data).data;
  18. },
  19. fail(err) {
  20. console.log(err);
  21. }
  22. });
  23. });

然后就是开始录音 结束录音 播放录音的事件函数了

  1. methods: {
  2. startRecord() {
  3. console.log('开始录音');
  4. recorderManager.start();
  5. },
  6. endRecord() {
  7. console.log('录音结束');
  8. recorderManager.stop();
  9. },
  10. playVoice() {
  11. console.log('播放录音');
  12. if (this.voicePath) {
  13. innerAudioContext.src = this.voicePath;
  14. innerAudioContext.play();
  15. }
  16. }
  17. }

以上根据实际开发需求更改。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/爱喝兽奶帝天荒/article/detail/928120
推荐阅读
相关标签
  

闽ICP备14008679号