DataURI to Blob errors: DOM Exception 5: An invalid or illegal character was specified

问题

I'm using Meteor with a Cordova plugin to record a video on an iPhone, then convert that to a blob for uploading. About half of the time I try to convert the video from the local filesystem to a blob it works and the other half it gives this error:

InvalidCharacterError: DOM Exception 5: An invalid or illegal character was specified, such as in an XML name.

It seems like it usually happens when the video is longer than 3 seconds, but it has happened on the really short videos. Here is my dataURItoBlob function:

function dataURItoBlob(dataURI) {
   var input = dataURI.replace(/\s/g, '');
   var binary = atob(input.split(',')[1]);
   var array = [];
   for(var i = 0; i < binary.length; i++) {
      array.push(binary.charCodeAt(i));
   }
   return new Blob([new Uint8Array(array)], {type: "video/mp4"});
}

I'm really not sure what I am doing wrong and I have tried a couple other similar functions with no luck. Any help is greatly appreciated. Thanks!

回答1:

Found out this was a problem with the base64 dataURI, not the blob function. For some reason it was getting corrupted when trying to use readAsDataUrl. As per this SO answer, I solved it by readAsBinaryData and appending the data:video/mp4;base64, manually.

Cordova - Reading Large Image corrupts image

来源：https://stackoverflow.com/questions/38503737/datauri-to-blob-errors-dom-exception-5-an-invalid-or-illegal-character-was-spe