小程序模板網(wǎng)

微信小程序--錄制音頻,播放音頻

發(fā)布時(shí)間:2018-05-05 14:47 所屬欄目:小程序開發(fā)教程

1.在pages創(chuàng)建一個(gè)main文件夾 
2.在main文件夾下創(chuàng)建一個(gè)miain.js文件。 
添加代碼:

 

				
  1. const constant = require('../../utils/constant.js')
  2. const app = getApp()
  3. const recorderManager = wx.getRecorderManager()
  4. const innerAudioContext = wx.createInnerAudioContext()
  5.  
  6. Page({
  7. data:{
  8. money:"0.00",
  9. userInfo: {},
  10. hasUserInfo: false,
  11. canIUse: wx.canIUse('button.open-type.getUserInfo'),
  12. },
  13. onLoad: function () {
  14. if (app.globalData.userInfo) {
  15. this.setData({
  16. userInfo: app.globalData.userInfo,
  17. hasUserInfo: true
  18. })
  19. } else if (this.data.canIUse){
  20. // 由于 getUserInfo 是網(wǎng)絡(luò)請(qǐng)求,可能會(huì)在 Page.onLoad 之后才返回
  21. // 所以此處加入 callback 以防止這種情況
  22. app.userInfoReadyCallback = res => {
  23.  
  24. this.setData({
  25. userInfo: res.userInfo,
  26. hasUserInfo: true
  27. })
  28. }
  29. } else {
  30. // 在沒有 open-type=getUserInfo 版本的兼容處理
  31. wx.getUserInfo({
  32. success: res => {
  33. app.globalData.userInfo = res.userInfo
  34. this.setData({
  35. userInfo: res.userInfo,
  36. hasUserInfo: true
  37. })
  38. }
  39. })
  40. }
  41. },
  42. getlocat:function(){
  43. wx.authorize({
  44. scope: 'scope.record',
  45. success() {
  46. // 用戶已經(jīng)同意小程序使用錄音功能,后續(xù)調(diào)用 wx.startRecord 接口不會(huì)彈窗詢問
  47. const options = {
  48. duration: 600000,
  49. sampleRate: 44100,
  50. numberOfChannels: 1,
  51. encodeBitRate: 192000,
  52. format: 'mp3',
  53. frameSize: 50
  54. }
  55.  
  56.  
  57. recorderManager.start(options)
  58.  
  59. recorderManager.onStart(() => {
  60. console.log('recorder start')
  61. })
  62. recorderManager.onError((res) => {
  63. console.log(res);
  64. })
  65. }
  66. })
  67. // console.log(app)
  68. },
  69.  
  70. strop:function(){
  71. recorderManager.stop()
  72. recorderManager.onStop((res) => {
  73. console.log('recorder stop', res)
  74. const { tempFilePath } = res
  75. console.log(tempFilePath)
  76. this.tempFilePath = tempFilePath
  77. })
  78. },
  79. //播放聲音
  80. play: function () {
  81. innerAudioContext.autoplay = true
  82. innerAudioContext.src = this.tempFilePath;
  83. innerAudioContext.onPlay(() => {
  84. console.log('開始播放')
  85. })
  86. innerAudioContext.onError((res) => {
  87. console.log(res.errMsg)
  88. console.log(res.errCode)
  89. })
  90.  
  91. },
  92. })

3.新建一個(gè)main.wxml文件  添加代碼如下

 

				
  1. <view>
  2. <button bindtap='getlocat'>測(cè)試</button>
  3. <button bindtap='strop'>測(cè)sss試</button>
  4. <button bindtap="play" >播放錄音</button>
  5. </view>


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://www.u-renovate.com/wxmini/doc/course/24255.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢