JS播放 base64文件流

<html>

<head>
    <title>html self-contained mp3title>
    <script>
        mp3DataUrl = "data:audio/mpeg;base64,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\nwcWpvJ+9//6oJ1F0WYUWchhtrThvTCYk7FMknPfr+7z+rgEjCrVc5GYVQoAbf+ov//NIxE0ey9Kq\nfoaUfVT/dHZZq9T0LtPb///PNVGpSfVP97K731Wjvf///+lLoejno7tdrlsmeX1VwgAEgI6A\nVTzfY0dllAGtwOtCbQL5gmmgs5MgAYEWXZDzJAU0EVWrD1qIUyRVonBngunPU2ZcS/OYYEHTleuI\nNNYk0JyoYlf//+QPgU7/5rFtdKKg//NIxFQeYr6a/JvLLMNMn//7mVDbve01beqyqitXUcR4rPZ5\n///97QVJJcbHMEayrRqVAAEgAgAWX36zVJjUmgKLQN0JGybFo+gpboyNBuqMF6n+LZFlFptdwgMz\n+BJJGRJkzb+vvF4UMwhNnOFpypPLxUPBwDCYr/lDrGt/LixYUjwkW0/7S06PWdYPHDiQ//NIxF0c\nuZaOXKPLDFSqVCMJLDRL///+RUHSx46VOng6IhwAGF///+wzKL8oZuZ0oK5UCgtAvCG5JUoGlVIb\nkq2BoAofFhVvpFizNItWa21GBMQBJ0xi4sDNFXJwrxlMMhzTyIdPYCh0FhKIgq6GuDTxE9qyqZ39\neoGjwaCoSDpNhZB4RCVQVOkv5EkI//NIxG0cWTJYGspemIrDR4RVwh86vVsNYevtz+G17AKF\n06dOVJ0JRsSS4O0B9C60dKwakJMHImE9ojK4/Vwih2lgFiL6kFeZKman8CHEjVERElHigFAWSI+S\n+/zsSiIkDJbEpIi1AUAtv28rZyPPf/+VySpMQU1FMy45OS41qqqqqqqqqqqqqqqqqqqqqqqq//NI\nxH4YST4EwBsfCKqqqqqqqqpMQU1FMy45OS41qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq//NIxHwAAANIAAAAAKqqqqqqqqpMQU1FMy45OS41\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\n//NIxHwAAANIAAAAAKqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\nqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq\n"

        // 把dataUrl转成blob
        function dataURLtoBlob(dataurl) {
            var arr = dataurl.split(','),
                mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]),
                n = bstr.length,
                u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], {
                type: mime
            });
        }

        window.onload = function() {
            // 音频
            audioBlob = dataURLtoBlob(mp3DataUrl)
            blobUrl = window.URL.createObjectURL(audioBlob);
            console.log(blobUrl)
            document.getElementById('mp3-data-url').src = blobUrl;
        }
    script>
head>
<body>
    <audio id="mp3-data-url" src="" controls>audio>
body>
html>

短的base64可以放入url,长的base64需要转换为blob再放入url

你可能感兴趣的:(javascript,开发语言,ecmascript)