cordova錄音轉base64上傳七牛

目前公司的webapp項目是基於meteor+react+cordova,領導要加相似微信的語音聊天功能,看了看七牛的文檔跟源碼,功能有太多我用不上的。先前上傳圖片用的是七牛提供的base64上傳方法,那若是把錄音轉成base64,也就能夠上傳到七牛了。react

錄音的組件我最終用的cordova-plugin-media-with-compression,錄音出來的格式是.m4a,iOS跟Android都支持播放。git

cordova-plugin-media-with-compressioncordova-plugin-media在Android端有區別。var filename = "xxxx.m4a"; mediaRec = new Media(filename);前者錄完音是在原音頻基礎上增量錄,然後者則Android跟iOS同樣都是每次從新錄音,這裏我採用了每次錄音var filename = Date.now() + ".m4a"的方法解決這個問題github

//轉base64的代碼

getFileContentAsBase64(path,callback){
  window.resolveLocalFileSystemURL(path, gotFile, fail);

  function fail(e) {
    alert('Cannot found requested file');
  }

  function gotFile(fileEntry) {
    fileEntry.file((file) => {
      var reader = new FileReader();
      reader.onloadend = function(e) {
        var content = this.result;
        callback(content);
      };
      // The most important point, use the readAsDatURL Method from the file plugin
      reader.readAsDataURL(file);
    });
  }
}

其中path參數須要作下判斷,iOS與Android的路徑不一樣,這裏我使用了cordova-plugin-file插件,代碼以下:web

var path;
var filename = Date.now() + ".m4a";
if(device.platform == "iOS") {
  path = cordova.file.tempDirectory + filename;
} else if(device.platform == "Android") {
  path = cordova.file.externalRootDirectory + filename;
}

而後錄音成功後調用getFileContentAsBase64便可apache

var mediaRec = new Media(filename, function() {
  getFileContentAsBase64(path, function(base64) {
    var audio = base64.split(',')[1];  //七牛要求填寫base64後的字符串
    var key = '上傳到七牛的名字';
    var url = `http://up-z1.qiniu.com/putb64/-1/key/${btoa(key)}`;
    //華北是up-z1,華南多是up或upload,我忘記了
    //剩下的就參考文章開頭給的七牛base64上傳方法連接
  }
})
相關文章
相關標籤/搜索