MP4影片流base64數據轉成Blob對象

網上一大堆對圖片base64轉Blob、File的方法 很少有影片mp4轉的,可能是因為原理相同的原因吧!
但在項目中針對影片流base64轉Blob對象時,花了好長時間才成功,特專門記錄一下!

APP中通過錄像或者從手機中選擇影片的方式,取出了影片流的base64數據,用網上常見的方式進行轉化,卻一直不成功,究其原因是,通常的base64轉Blob對象方法,都需要帶有前綴標識的base64。
例如:
圖片的:
data:image/jpeg:base64,——

影片的:

data:video/mp4;base64,—-

而項目中插件返回的是純base64,不帶前綴,所以需要對方法進行特殊處理。

首先是常見的轉換方法:

 1 function dataURLtoBlob(dataurl) {
 2     var arr = dataurl.split(',');
 3     var mime = arr[0].match(/:(.*?);/)[1];
 4     // 結果:   image/png
 5     console.log("arr[0]====" + JSON.stringify(arr[0]));
 6     //   "data:image/png;base64"
 7     console.log("arr[0].match(/:(.*?);/)====" + arr[0].match(/:(.*?);/));
 8     // :image/png;,image/png
 9     console.log("arr[0].match(/:(.*?);/)[1]====" + arr[0].match(/:(.*?);/)[1]);
10     //   image/png
11     var bstr = atob(arr[1].replace(/\s/g, ''));
12     var n = bstr.length;
13     var u8arr = new Uint8Array(n);
14     while (n--) {
15         u8arr[n] = bstr.charCodeAt(n);
16     }
17     return new Blob([u8arr], {
18         type : mime
19     });
20 }

 

針對只有純base64數據修改後的方法:

function dataURLtoBlob2(dataurl) {
    var arr = dataurl;
    var bstr = atob(arr.replace(/\s/g, ''));
    var n = bstr.length;
    var u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], {
        type : 'video/mp4'
    });
}

 

相關參考:

//blog.csdn.net/qq_39364032/article/details/82177456?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.nonecase