Javascript 使用$resource发送音频数据(base64)

Javascript 使用$resource发送音频数据(base64),javascript,java,angularjs,audio,angular-resource,Javascript,Java,Angularjs,Audio,Angular Resource,我正在开发一个应用程序,我需要使用麦克风录制音频并将其发送到后端应用程序(tomcat服务器) 似乎发送太大的数据流会让我发疯并冻结我的浏览器 要录制音频文件,我使用本机函数RecorderWorkerFactory.getUserMedia(),该函数允许我获取RecordBlob对象。 之后,仍然是Angular,我提取base64 enconding中的音频内容,并使用$resource将其发送到后端应用程序。 后端应用程序正确地接收数据并进行处理,但由于Firefox检测到无限循环并冻结

我正在开发一个应用程序,我需要使用麦克风录制音频并将其发送到后端应用程序(tomcat服务器)

似乎发送太大的数据流会让我发疯并冻结我的浏览器

要录制音频文件,我使用本机函数RecorderWorkerFactory.getUserMedia(),该函数允许我获取RecordBlob对象。

之后,仍然是Angular,我提取base64 enconding中的音频内容,并使用$resource将其发送到后端应用程序。 后端应用程序正确地接收数据并进行处理,但由于Firefox检测到无限循环并冻结,因此从未执行此调用的回调

但是,如果我继续运行该程序,经过很长时间后,页面刷新就会过去。

这是我将音频内容提取到base64字符串中以发送的代码:

var blob = $scope.audio.recordBlob;
if (blob) {
    var reader = new FileReader();
    reader.readAsDataURL(blob);
    reader.onloadend = function() {
        $scope.audioContent = reader.result;
        $scope.sendMessage();
    }
}

$scope.sendMessage = function(){
    var outputStream = {
                      "audio": $scope.audioContent
                     };
    $scope.sendIM(outputStream);
}
在这里,我通过POST向后发送outputStream,并在回调中启动loadData()函数重新加载我的视图。

services.FileCreation= $resource(URI_SERVICE_CREATION, {}, {
    'post' : urlEncodedFormPost
});


$scope.sendIM = function(fluxSortie) {
  $services.FileCreation.post(angular.toJson(outputStream)).$promise.then(function(result){ 
        $scope.loadData();
    });
}
这是创建音频文件的Java代码:

private void createAudioFile(File file, byte[] content) throws IOException {
    FileOutputStream stream = null;
    try {
        stream = new FileOutputStream(file.getPath());
        IOUtils.write(content, stream);
    } catch (IOException e) {
        LOGGER.debug("creation failed");
    } finally {
        if (stream != null) {
            stream.flush();
            stream.close();
        }
    }
}
其中content是发送的base64字符串的转换


经过研究,我发现无限循环位于一个名为shallowClearAndCopy()的本机角度函数中,该函数发生在Java执行之后,但就在回调之前。在这个函数中,代码显然将音频字符串(base64编码)的每个字符转换为一个对象属性,并在这些属性上执行循环以删除它们。但是这导致了Firefox认为是一个无限循环的很长的处理。
function shallowClearAndCopy(src, dst) {
  dst = dst || {};

  angular.forEach(dst, function(value, key) { // This is where it freezes, as dst contains all my base64 encoded data and iterate over each character of it (which is veeeeeery long !)
    delete dst[key];
  });

  for (var key in src) {
    if (src.hasOwnProperty(key) && !(key.charAt(0) === '$' && key.charAt(1) === '$')) {
      dst[key] = src[key];
    }
  }

  return dst;
}
这是因为angularjs的性能(并且没有其他需要做的事情)? 还是我遗漏了一个创造无限循环的东西?还是我的回调定义有问题

干杯

我发现了问题

正是角度。toJson(outputStream)无需转换对象。

我发现了问题

正是angular.toJson(outputStream)无需转换对象