如何在AJAX中将RecordRTC blob文件上传到Rails回形针

在客户端，用户使用RecordRTC录制短video。 当用户按下上传时，我将使用recorder.getBlob()获取video的blob数据，并将其上传到我的服务器（使用Rails和paperclip处理文件上传）。

首先，我想将字段值更改为blob数据。 事实certificate，对于浏览器的安全性，我无法使用javascript更改它。

然后，我尝试使用AJAX：

 $("#ajax-submit").on("click", function() { var data = new FormData(); data.append("record", recorder.getBlob(), (new Date()).getTime() + ".webm"); var oReq = new XMLHttpRequest(); oReq.open("POST", "/records/"); oReq.send(data); oReq.onload = function(oEvent) { if (oReq.status == 200) { console.log("Uploaded"); } else { console.log("Error " + oReq.status + " occurred uploading your file."); } }; }); 

但是，它不起作用。 在log文件中，我将得到以下，无法处理：

 Processing by RecordsController#create as */* Parameters: { "video"=>"data:video/webm;base64,GkXfo0AgQoaBAUL3gQFC8o..." } 

如果我正常使用form提交，我将有如下参数：

 Processing by RecordsController#create as HTML Parameters: { "video"=>#<ActionDispatch::Http::UploadedFile:0x3b476e0 @original_filename="testing.mp4", @content_type="video/mp4", @headers="Content-Disposition: form-data; name=\"record\"; filename=\"testing.mp4\"\r\nContent-Type: video/mp4\r\n", @tempfile=#> } 

我怎么能解决这个问题？

非常感谢。

Answer 1

我在我的一个项目中处理了同样的问题。 情况是API必须将blob数据转换为移动设备发送的图像文件。 我假设要在您的控制器文件中上传操作。

 def upload #extract the video data from params video = params[:video] # define the save path for the video. I am using public directory for the moment. save_path = Rails.root.join("public/videos/#{video.original_filename}") # Open and write the file to file system. File.open(save_path, 'wb') do |f| f.write params[:video].read end render :nothing => true end 

Answer 2

最后，问题的原因是来自recorder.getBlob()的blob文件不是实际的blob 。 请参阅muaz-khan的回答。

我在RecordRTC中添加了以下行以获得真正的blob并执行相同的AJAX。 现在一切都有效。

  getBlob: function () { return blobURL2; }, + getRealBlob: function() { + return blobURL; + },