audio标签 FileReader blob转base64 base64转blob 语音
2024-05-10 15:14:25
base64转blob内容
function sentComment() {var url = $("#albumItemCommentURL").val();var params = {"mediaType": 3};var audioBase64Data = $("#audioBase64Data").attr("src");//获取图片的base64//创建formData对象var formData = new FormData();//添加图片的blobif (audioBase64Data) {var blobBin = dataURLtoBlob(audioBase64Data);var fileType = blobBin.type.split("/")[1];params.fileType = fileType;formData.append('file', blobBin);}//添加请求参数的blobvar dataWithType = new Blob([JSON.stringify(params)], {type: "application/json"});formData.append("data", dataWithType);//上传数据$.ajax({url: url,type: 'post',processData: false,contentType: false,data: formData,dataType: 'json',success: function (data) {var obj = eval(data);if (obj.responseCode == '0') {}},error: function (jqXHR, textStatus, errorThrown) {alert(textStatus + "---" + errorThrown);}});}/* 工具方法：dataURL(base64字符串)转换为Blob对象（二进制大对象） *///data:image/png;base64,iVBORw0KGgoAAAANSUhEUg......function dataURLtoBlob(dataurl) {var arr = dataurl.split(',');var mime = arr[0].match(/:(.*?);/)[1];// 结果： image/pngconsole.log("arr[0]====" + JSON.stringify(arr[0]));// "data:image/png;base64"console.log("arr[0].match(/:(.*?);/)====" + arr[0].match(/:(.*?);/));// :image/png;,image/pngconsole.log("arr[0].match(/:(.*?);/)[1]====" + arr[0].match(/:(.*?);/)[1]);// image/pngvar bstr = atob(arr[1].replace(/\s/g, ''));var n = bstr.length;var u8arr = new Uint8Array(n);while (n--) {u8arr[n] = bstr.charCodeAt(n);}return new Blob([u8arr], {type: mime});//值，类型}
https://juejin.cn/post/6844903933626810382function 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 });
}
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.myaudio1 {width: 100px;height: 100px;background-color: #f00;}.myaudio2 {width: 100px;height: 100px;background-color: #ff0;}.myaudio3 {width: 100px;height: 100px;background-color: #ff00ff;}.myaudio4 {width: 100px;height: 100px;background-color: #00f;}.myaudio5 {width: 100px;height: 100px;background-color: #0ff;}.myaudio6 {width: 100px;height: 100px;background-color: #e0f;}</style>
</head><body><!-- <audio id="myaudio" src="http://ting6.yymp3.net:82/new27/ltqz/1.mp3" controls="controls" loop="true" hidden="true"></audio> --><!-- <audio id="myaudio" src="1.mp3" controls="controls" autoplay loop="true"></audio> --><!-- 音乐标签 src 资源 controls 控制器 autoplay自动播放 loop循环 --><div class="myaudio1">音乐1</div><div class="myaudio2">音乐2</div><div class="myaudio3">音乐3</div><div class="myaudio4">音乐4</div><div class="myaudio5">图片base64下载</div><div class="myaudio6">音乐base64下载</div><button onclick="download('hello.txt','This is the content of my file')">下载</button><!-- </audio> --><!-- <script src="./index.js"></script> --><!-- <iframe src="http://192.168.1.143/demo.mp3" allow="autoplay" style="display:none" id="iframeAudio"></iframe> --><!-- 参考:https://blog.csdn.net/ysy950803/article/details/87894170?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase --><script>var myaudio1 = document.querySelector('.myaudio1')var myaudio2 = document.querySelector('.myaudio2')var myaudio3 = document.querySelector('.myaudio3')var myaudio4 = document.querySelector('.myaudio4')var myaudio5 = document.querySelector('.myaudio5')var myaudio6 = document.querySelector('.myaudio6')var audio1 = document.createElement("audio"); //生成一个audio元素// audio1.src = '1.mp3'; //音乐的路径var myaudio1_lock = truemyaudio1.onclick = function () {if (myaudio1_lock) {audio1.play();myaudio1_lock = falseconsole.log(1)} else {audio1.pause();myaudio1_lock = trueconsole.log(2)}}let audio2 = new Audio()// audio2.src = '1.mp3'; //音乐的路径myaudio2.onclick = function () {if (myaudio1_lock) {audio2.play();myaudio1_lock = falseconsole.log(1)} else {audio2.pause();myaudio1_lock = trueconsole.log(2)}}let AudioContext = window.AudioContext || window.webkitAudioContext;let audioCtxlet soundBuf = {}myaudio3.onclick = function () {let sound;let item = {sound: 'http://192.168.1.143/demo.mp3',name: 'xxx'}if (!audioCtx) {audioCtx = AudioContext ? new AudioContext() : '';}let soundBuffer = {getBuffer(link) {return new Promise((resolve, reject) => {if (audioCtx) {let request = new XMLHttpRequest();request.open("GET", link, true);//借助ajaxrequest.responseType = "arraybuffer";// responseType 为空字符串时，采用默认类型 DOMString，与设置为 text 相同。// arraybuffer// response 是一个包含二进制数据的 JavaScript ArrayBuffer。// blob// response 是一个包含二进制数据的 Blob 对象 。// document// response 是一个 HTML Document 或 XML XMLDocument，这取决于接收到的数据的 MIME 类型。请参阅 XMLHttpRequest 中的 HTML 以了解使用 XHR 获取 HTML 内容的更多信息。// json// response 是一个 JavaScript 对象。这个对象是通过将接收到的数据类型视为 JSON 解析得到的。// text// response 是一个以 DOMString 对象表示的文本。// ms - stream// response 是下载流的一部分；此响应类型仅允许下载请求，并且仅受 Internet Explorer 支持。request.onload = function () { //请求完成console.log(request.response, 'request.response')audioCtx.decodeAudioData(request.response, function (buffer) {console.log(buffer, 'buffer')resolve(buffer)}, function (e) {console.log('reject');reject(e);});};request.send();} else {reject('not support AudioContext');}})},// createSound(buffer) {// if (audioCtx.state != 'running') {// console.log('重启audioCtx');// audioCtx.resume();// }// let analyser = audioCtx.createAnalyser();// let gainNode = audioCtx.createGain();// let source = audioCtx.createBufferSource();// source.buffer = buffer;// source.connect(analyser);// analyser.connect(gainNode);// gainNode.connect(audioCtx.destination);// return source;// }createSound(buffer) {if (audioCtx.state == 'suspended') {console.log('重启audioCtx');audioCtx.resume();}let source = audioCtx.createBufferSource();source.buffer = buffer;source.connect(audioCtx.destination);return source;}}console.log(item.sound, 'item.sound')console.log(soundBuf, 'soundBuf')if (Object.keys(soundBuf) != 0) {if (soundBuf[item.name]) {sound = soundBuffer.createSound(soundBuf[item.name]);if (myaudio1_lock) {sound.start(0); // 播放myaudio1_lock = falseconsole.log(1111111111111111111111111111)} else {audioCtx.close()audioCtx = nullmyaudio1_lock = trueconsole.log(2222222222222222222222)}} else {console.log("download sound failed？");}} else {soundBuffer.getBuffer(item.sound) // item.sound是音频线上地址.then(buf => {console.log(buf, 'buf')soundBuf[item.name] = buf; // 存储，方便调用if (soundBuf[item.name]) {console.log(soundBuf, soundBuf[item.name], 'soundBuf[item.name]')sound = soundBuffer.createSound(soundBuf[item.name]);if (myaudio1_lock) {sound.start(0); // 播放myaudio1_lock = falseconsole.log(3333333333333333)} else {audioCtx.close()audioCtx = nullmyaudio1_lock = trueconsole.log(44444444444444444444)}} else {console.log("download sound failed？");}}).catch(e => {console.log(e);});}}let audio44 = document.createElement("audio");myaudio4.onclick = function () {let input = document.createElement('input');input.type = 'file';input.click()input.onchange = function (e) {// console.log(e.target.files);// console.log(e.target.files[0])let files = e.target.files[0]let reader = new FileReader();reader.readAsDataURL(files);reader.onload = function (e) {// let saveCanvas = document.createElement("canvas");// let ctx = saveCanvas.getContext("2d");// ctx.fillStyle = "rgba(255, 255, 255, 0)";// let images = new Image();// images.src = e.target.result;// images.onload = function () {// ctx.drawImage(images, 0, 0);// // document.body.appendChild(images)// document.body.appendChild(saveCanvas)// }audio44.src = e.target.resultaudio44.play()console.log(e.target.result)}}}let blob = nulllet audio55 = document.createElement("audio");myaudio5.onclick = function () {let images = new Image();let canvas = document.createElement("canvas");let ctx = canvas.getContext("2d");// images.crossOrigin = "Anonymous";images.src = './logo.png';// images.src='http://images1.1tu.com/uploads/2020-05/p_1590633094_cc841623af55030a8f101490a1d5c30b.jpg'images.onload = function (e) {// // let base = canvas.toDataURL('image/png');// 图片转化base64 画布污染 网路图片let base = "data:image/png;base64,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UmVhZHlxyWU8AAADKmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzIgNzkuMTU5Mjg0LCAyMDE2LzA0LzE5LTEzOjEzOjQwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGRkE0MjcxNTdEQzYxMUU4QkZBOERDOEVCQ0U0NTBGMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGRkE0MjcxNDdEQzYxMUU4QkZBOERDOEVCQ0U0NTBGMSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNS41IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QkE4RkFCN0M3REM1MTFFOEJGQThEQzhFQkNFNDUwRjEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkE4RkFCN0Q3REM1MTFFOEJGQThEQzhFQkNFNDUwRjEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5BZZ+3AAAB1ElEQVR42mJkAALtmZb/GfAAJkIKwIoYiAA4FV1JO0Ylk0hWxILLHTgV6cyywqoIIIAYiQinb8S4iYs036E7esgEJq6ABAGAACImMBmo5m6yDcLlR5gcNnnaumhADWIhJoOTbRC+9ILPa9+o4TWAAAIlyDVAOphCc1SYqGAICNwZxumIidi8NILz2qhBdCyPaOcicgq1wRnYAAFErRKSgZo+GzSOoWpQD1sHsRCjCDnzkpp90DM+If2jUTbqoFEHjZZDpJYroyFESeNmNFHTykEqg8g9bwACCNRiVAYyLgEx1wA7Zu3V9OMhVBt1opajBlsaCh7NZaMOGnXQgFeupHZjKO1CjUbZqINGHTTqoFEHjTpo1EGjDhqMgw342kejUTaahggpoOdg1WiUjTpoODoIvL7tzSBykB5AgPbtGIdBGIYCaBR16swROEQvzT06cxjm1lRFDC0LcpXC+xJzpIdJhOW8e4z359MVWSde1C32xRYasC0mCmascDZzrQz+7NgABAgQINnRY/iUrb5D9v9l9toqCBAgQIAAAQIESAABAgQIEKCD5ZK9QPaMigoCdIJP7NdjOyoIECBAgGQBGjB8zVDjam153T0OqInJbBAWfdg8AExKZVcA71uIAAAAAElFTkSuQmCC"const bytes = window.atob(base.split(',')[1]);const ab = new ArrayBuffer(bytes.length);const ia = new Uint8Array(ab);for (let i = 0; i < bytes.length; i++) {console.log(bytes.charCodeAt(i), 'bytes.charCodeAt(i)')ia[i] = bytes.charCodeAt(i);}blob = new Blob([ab], { type: 'image/png' });let a = document.createElement('a');let event = new MouseEvent('click');a.download = Math.round(new Date() / 1000) + '.png';a.href = URL.createObjectURL(blob);a.dispatchEvent(event)// ctx.drawImage(images, 100, 100);// // let base = canvas.toDataURL('image/png');// 图片转化base64 画布污染 网路图片// let base="data:image/png;base64,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UmVhZHlxyWU8AAADKmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzIgNzkuMTU5Mjg0LCAyMDE2LzA0LzE5LTEzOjEzOjQwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGRkE0MjcxNTdEQzYxMUU4QkZBOERDOEVCQ0U0NTBGMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGRkE0MjcxNDdEQzYxMUU4QkZBOERDOEVCQ0U0NTBGMSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNS41IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QkE4RkFCN0M3REM1MTFFOEJGQThEQzhFQkNFNDUwRjEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkE4RkFCN0Q3REM1MTFFOEJGQThEQzhFQkNFNDUwRjEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5BZZ+3AAAB1ElEQVR42mJkAALtmZb/GfAAJkIKwIoYiAA4FV1JO0Ylk0hWxILLHTgV6cyywqoIIIAYiQinb8S4iYs036E7esgEJq6ABAGAACImMBmo5m6yDcLlR5gcNnnaumhADWIhJoOTbRC+9ILPa9+o4TWAAAIlyDVAOphCc1SYqGAICNwZxumIidi8NILz2qhBdCyPaOcicgq1wRnYAAFErRKSgZo+GzSOoWpQD1sHsRCjCDnzkpp90DM+If2jUTbqoFEHjZZDpJYroyFESeNmNFHTykEqg8g9bwACCNRiVAYyLgEx1wA7Zu3V9OMhVBt1opajBlsaCh7NZaMOGnXQgFeupHZjKO1CjUbZqINGHTTqoFEHjTpo1EGjDhqMgw342kejUTaahggpoOdg1WiUjTpoODoIvL7tzSBykB5AgPbtGIdBGIYCaBR16swROEQvzT06cxjm1lRFDC0LcpXC+xJzpIdJhOW8e4z359MVWSde1C32xRYasC0mCmascDZzrQz+7NgABAgQINnRY/iUrb5D9v9l9toqCBAgQIAAAQIESAABAgQIEKCD5ZK9QPaMigoCdIJP7NdjOyoIECBAgGQBGjB8zVDjam153T0OqInJbBAWfdg8AExKZVcA71uIAAAAAElFTkSuQmCC"// console.log(base,'images')// downloadFile('11', base)}function base64ToBlob(code) {let parts = code.split(';base64,')let contentType = parts[0].split(':')[1]let raw = window.atob(parts[1])let rawLength = raw.lengthlet uInt8Array = new Uint8Array(rawLength)for (let i = 0; i < rawLength; ++i) {uInt8Array[i] = raw.charCodeAt(i)}return new Blob([uInt8Array], { type: contentType })}function downloadFile(fileName, content) {let aLink = document.createElement('a')let blob = base64ToBlob(content) // new Blob([content]);let evt = document.createEvent('HTMLEvents')evt.initEvent('click', true, true)// initEvent 不加后两个参数在FF下会报错 事件类型，是否冒泡，是否阻止浏览器的默认行为aLink.download = fileNameaLink.href = URL.createObjectURL(blob)aLink.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, view: window }))// 兼容火狐}}let audio66 = document.createElement("audio");myaudio6.onclick = function () {let input = document.createElement('input');input.type = 'file';input.click()input.onchange = function (e) {let files = e.target.files[0]let reader = new FileReader();reader.readAsDataURL(files);reader.onload = function (e) {let base = e.target.result// console.log(base, 'e.target.result')downloadFile('11', base)}}function base64ToBlob(code) {let parts = code.split(';base64,')let contentType = parts[0].split(':')[1]let raw = window.atob(parts[1])let rawLength = raw.lengthlet uInt8Array = new Uint8Array(rawLength)for (let i = 0; i < rawLength; ++i) {uInt8Array[i] = raw.charCodeAt(i)}return new Blob([uInt8Array], { type: contentType })}function downloadFile(fileName, content) {let aLink = document.createElement('a')let blob = base64ToBlob(content) // new Blob([content]);// // blob转base64// console.log(blob,'blob')// const fileReader = new FileReader();// fileReader.onload = (e) => {// console.log(e.target.result,'e.target.result')// };// // readAsDataURL// fileReader.readAsDataURL(blob);// return// readAsArrayBuffer(file): void 异步按字节读取文件内容，结果用ArrayBuffer对象表示 ArrayBuffer// readAsBinaryString(file): void 异步按字节读取文件内容，结果为文件的二进制串 翻译成二进制文件 将文件读取为二进制编码// readAsDataURL(file): void 异步读取文件内容，结果用data: url的字符串形式表示 图片路径文件 blob 将文件读取为DataURL// readAsText(file, encoding): void 异步按字符读取文件内容，结果用字符串形式表示 解读文本文件 将文件读取为文本console.log(blob, 'blob', URL.createObjectURL(blob), 'URL.createObjectURL(blob)')audio66.src = URL.createObjectURL(blob)audio66.play()returnlet evt = document.createEvent('HTMLEvents')evt.initEvent('click', true, true)// initEvent 不加后两个参数在FF下会报错 事件类型，是否冒泡，是否阻止浏览器的默认行为aLink.download = fileNameaLink.href = URL.createObjectURL(blob)aLink.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, view: window }))// 兼容火狐}}function download(filename, text) {var element = document.createElement('a');element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));element.setAttribute('download', filename);element.style.display = 'none';document.body.appendChild(element);element.click();document.body.removeChild(element);}</script>
</body></html>
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.myaudio1 {width: 100px;height: 100px;background-color: #f00;}.myaudio2 {width: 100px;height: 100px;background-color: #ff0;}.myaudio3 {width: 100px;height: 100px;background-color: #ff00ff;}</style>
</head><body><!-- <audio id="myaudio" src="http://ting6.yymp3.net:82/new27/ltqz/1.mp3" controls="controls" loop="true" hidden="true"></audio> --><!-- <audio id="myaudio" src="1.mp3" controls="controls" autoplay loop="true"></audio> --><!-- 音乐标签 src 资源 controls 控制器 autoplay自动播放 loop循环 --><div class="myaudio1">音乐1</div><div class="myaudio2">音乐2</div><div class="myaudio3">音乐3</div></audio><!-- <script src="./index.js"></script> --><script>var myaudio1 = document.querySelector('.myaudio1')var myaudio2 = document.querySelector('.myaudio2')var myaudio3 = document.querySelector('.myaudio3')var audio1 = document.createElement("audio"); //生成一个audio元素// audio1.src = '1.mp3'; //音乐的路径var myaudio1_lock = truemyaudio1.onclick = function () {if (myaudio1_lock) {audio1.play();myaudio1_lock = falseconsole.log(1)} else {audio1.pause();myaudio1_lock = trueconsole.log(2)}}let audio2 = new Audio()// audio2.src = '1.mp3'; //音乐的路径myaudio2.onclick = function () {if (myaudio1_lock) {audio2.play();myaudio1_lock = falseconsole.log(1)} else {audio2.pause();myaudio1_lock = trueconsole.log(2)}}// import soundBuffer from './soundBuffer';// ...// preloadlet AudioContext = window.AudioContext || window.webkitAudioContext;let audioCtxlet soundBuf = {}myaudio3.onclick = function () {let sound;let item = {sound: 'http://192.168.1.143/demo.mp3',name: 'xxx'}if (!audioCtx) {audioCtx = AudioContext ? new AudioContext() : '';}let soundBuffer = {getBuffer(link) {return new Promise((resolve, reject) => {if (audioCtx) {let request = new XMLHttpRequest();request.open("GET", link, true);//借助ajaxrequest.responseType = "arraybuffer";// responseType 为空字符串时，采用默认类型 DOMString，与设置为 text 相同。// arraybuffer// response 是一个包含二进制数据的 JavaScript ArrayBuffer。// blob// response 是一个包含二进制数据的 Blob 对象 。// document// response 是一个 HTML Document 或 XML XMLDocument，这取决于接收到的数据的 MIME 类型。请参阅 XMLHttpRequest 中的 HTML 以了解使用 XHR 获取 HTML 内容的更多信息。// json// response 是一个 JavaScript 对象。这个对象是通过将接收到的数据类型视为 JSON 解析得到的。// text// response 是一个以 DOMString 对象表示的文本。// ms - stream// response 是下载流的一部分；此响应类型仅允许下载请求，并且仅受 Internet Explorer 支持。request.onload = function () { //请求完成console.log(request.response,'request.response')audioCtx.decodeAudioData(request.response, function (buffer) {console.log(buffer,'buffer')resolve(buffer)}, function (e) {console.log('reject');reject(e);});};request.send();} else {reject('not support AudioContext');}})},// createSound(buffer) {// if (audioCtx.state != 'running') {// console.log('重启audioCtx');// audioCtx.resume();// }// let analyser = audioCtx.createAnalyser();// let gainNode = audioCtx.createGain();// let source = audioCtx.createBufferSource();// source.buffer = buffer;// source.connect(analyser);// analyser.connect(gainNode);// gainNode.connect(audioCtx.destination);// return source;// }createSound(buffer) {if (audioCtx.state == 'suspended') {console.log('重启audioCtx');audioCtx.resume();}let source = audioCtx.createBufferSource();source.buffer = buffer;source.connect(audioCtx.destination);return source;}}console.log(item.sound, 'item.sound')console.log(soundBuf,'soundBuf')if (Object.keys(soundBuf) != 0) {if (soundBuf[item.name]) {sound = soundBuffer.createSound(soundBuf[item.name]);if (myaudio1_lock) {sound.start(0); // 播放myaudio1_lock = falseconsole.log(1111111111111111111111111111)} else {audioCtx.close()audioCtx=nullmyaudio1_lock = trueconsole.log(2222222222222222222222)}} else {console.log("download sound failed？");}} else {soundBuffer.getBuffer(item.sound) // item.sound是音频线上地址.then(buf => {console.log(buf, 'buf')soundBuf[item.name] = buf; // 存储，方便调用if (soundBuf[item.name]) {console.log(soundBuf,soundBuf[item.name],'soundBuf[item.name]')sound = soundBuffer.createSound(soundBuf[item.name]);if (myaudio1_lock) {sound.start(0); // 播放myaudio1_lock = falseconsole.log(3333333333333333)} else {audioCtx.close()audioCtx=nullmyaudio1_lock = trueconsole.log(44444444444444444444)}} else {console.log("download sound failed？");}}).catch(e => {console.log(e);});}}</script>
</body></html>
参考:https://www.jianshu.com/p/ee1ad766d8a7
参考:https://developer.mozilla.org/en-US/docs/Web/API/AudioBufferSourceNode/start
base64网路资源头
png 图片:
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC"/>wav 文件:
<audio controls="controls" autobuffer="autobuffer" autoplay="autoplay"> <source src="data:audio/wav;base64,UklGRhwMAABXQVZFZm10IBAAAAABAAEAgD4AAIA+AAABAAgAZGF0Ya4LAACAgICAgICAgICAgICAgICAgICAgICAgICAf3hxeH+AfXZ1eHx6dnR5fYGFgoOKi42aloubq6GOjI2Op7ythXJ0eYF5aV1AOFFib32HmZSHhpCalIiYi4SRkZaLfnhxaWptb21qaWBea2BRYmZTVmFgWFNXVVVhaGdbYGhZbXh1gXZ1goeIlot1k6yxtKaOkaWhq7KonKCZoaCjoKWuqqmurK6ztrO7tbTAvru/vb68vbW6vLGqsLOfm5yal5KKhoyBeHt2dXBnbmljVlJWUEBBPDw9Mi4zKRwhIBYaGRQcHBURGB0XFxwhGxocJSstMjg6PTc6PUxVV1lWV2JqaXN0coCHhIyPjpOenqWppK6xu72yxMu9us7Pw83Wy9nY29ve6OPr6uvs6ezu6ejk6erm3uPj3dbT1sjBzdDFuMHAt7m1r7W6qaCupJOTkpWPgHqAd3JrbGlnY1peX1hTUk9PTFRKR0RFQkRBRUVEQkdBPjs9Pzo6NT04Njs+PTxAPzo/Ojk6PEA5PUJAQD04PkRCREZLUk1KT1BRUVdXU1VRV1tZV1xgXltcXF9hXl9eY2VmZmlna3J0b3F3eHyBfX+JgIWJiouTlZCTmpybnqSgnqyrqrO3srK2uL2/u7jAwMLFxsfEv8XLzcrIy83JzcrP0s3M0dTP0drY1dPR1dzc19za19XX2dnU1NjU0dXPzdHQy8rMysfGxMLBvLu3ta+sraeioJ2YlI+MioeFfX55cnJsaWVjXVlbVE5RTktHRUVAPDw3NC8uLyknKSIiJiUdHiEeGx4eHRwZHB8cHiAfHh8eHSEhISMoJyMnKisrLCszNy8yOTg9QEJFRUVITVFOTlJVWltaXmNfX2ZqZ21xb3R3eHqAhoeJkZKTlZmhpJ6kqKeur6yxtLW1trW4t6+us7axrbK2tLa6ury7u7u9u7vCwb+/vr7Ev7y9v8G8vby6vru4uLq+tri8ubi5t7W4uLW5uLKxs7G0tLGwt7Wvs7avr7O0tLW4trS4uLO1trW1trm1tLm0r7Kyr66wramsqaKlp52bmpeWl5KQkImEhIB8fXh3eHJrbW5mYGNcWFhUUE1LRENDQUI9ODcxLy8vMCsqLCgoKCgpKScoKCYoKygpKyssLi0sLi0uMDIwMTIuLzQ0Njg4Njc8ODlBQ0A/RUdGSU5RUVFUV1pdXWFjZGdpbG1vcXJ2eXh6fICAgIWIio2OkJGSlJWanJqbnZ2cn6Kkp6enq62srbCysrO1uLy4uL+/vL7CwMHAvb/Cvbq9vLm5uba2t7Sysq+urqyqqaalpqShoJ+enZuamZqXlZWTkpGSkpCNjpCMioqLioiHhoeGhYSGg4GDhoKDg4GBg4GBgoGBgoOChISChISChIWDg4WEgoSEgYODgYGCgYGAgICAgX99f398fX18e3p6e3t7enp7fHx4e3x6e3x7fHx9fX59fn1+fX19fH19fnx9fn19fX18fHx7fHx6fH18fXx8fHx7fH1+fXx+f319fn19fn1+gH9+f4B/fn+AgICAgH+AgICAgIGAgICAgH9+f4B+f35+fn58e3t8e3p5eXh4d3Z1dHRzcXBvb21sbmxqaWhlZmVjYmFfX2BfXV1cXFxaWVlaWVlYV1hYV1hYWVhZWFlaWllbXFpbXV5fX15fYWJhYmNiYWJhYWJjZGVmZ2hqbG1ub3Fxc3V3dnd6e3t8e3x+f3+AgICAgoGBgoKDhISFh4aHiYqKi4uMjYyOj4+QkZKUlZWXmJmbm52enqCioqSlpqeoqaqrrK2ur7CxsrGys7O0tbW2tba3t7i3uLe4t7a3t7i3tre2tba1tLSzsrKysbCvrq2sq6qop6alo6OioJ+dnJqZmJeWlJKSkI+OjoyLioiIh4WEg4GBgH9+fXt6eXh3d3V0c3JxcG9ubWxsamppaWhnZmVlZGRjYmNiYWBhYGBfYF9fXl5fXl1dXVxdXF1dXF1cXF1cXF1dXV5dXV5fXl9eX19gYGFgYWJhYmFiY2NiY2RjZGNkZWRlZGVmZmVmZmVmZ2dmZ2hnaGhnaGloZ2hpaWhpamlqaWpqa2pra2xtbGxtbm1ubm5vcG9wcXBxcnFycnN0c3N0dXV2d3d4eHh5ent6e3x9fn5/f4CAgIGCg4SEhYaGh4iIiYqLi4uMjY2Oj5CQkZGSk5OUlJWWlpeYl5iZmZqbm5ybnJ2cnZ6en56fn6ChoKChoqGio6KjpKOko6SjpKWkpaSkpKSlpKWkpaSlpKSlpKOkpKOko6KioaKhoaCfoJ+enp2dnJybmpmZmJeXlpWUk5STkZGQj4+OjYyLioqJh4eGhYSEgoKBgIB/fn59fHt7enl5eHd3dnZ1dHRzc3JycXBxcG9vbm5tbWxrbGxraWppaWhpaGdnZ2dmZ2ZlZmVmZWRlZGVkY2RjZGNkZGRkZGRkZGRkZGRjZGRkY2RjZGNkZWRlZGVmZWZmZ2ZnZ2doaWhpaWpra2xsbW5tbm9ub29wcXFycnNzdHV1dXZ2d3d4eXl6enp7fHx9fX5+f4CAgIGAgYGCgoOEhISFhoWGhoeIh4iJiImKiYqLiouLjI2MjI2OjY6Pj46PkI+QkZCRkJGQkZGSkZKRkpGSkZGRkZKRkpKRkpGSkZKRkpGSkZKRkpGSkZCRkZCRkI+Qj5CPkI+Pjo+OjY6Njo2MjYyLjIuMi4qLioqJiomJiImIh4iHh4aHhoaFhoWFhIWEg4SDg4KDgoKBgoGAgYCBgICAgICAf4CAf39+f35/fn1+fX59fHx9fH18e3x7fHt6e3p7ent6e3p5enl6enl6eXp5eXl4eXh5eHl4eXh5eHl4eXh5eHh3eHh4d3h4d3h3d3h4d3l4eHd4d3h3eHd4d3h3eHh4eXh5eHl4eHl4eXh5enl6eXp5enl6eXp5ent6ent6e3x7fHx9fH18fX19fn1+fX5/fn9+f4B/gH+Af4CAgICAgIGAgYCBgoGCgYKCgoKDgoOEg4OEg4SFhIWEhYSFhoWGhYaHhoeHhoeGh4iHiIiHiImIiImKiYqJiYqJiouKi4qLiouKi4qLiouKi4qLiouKi4qLi4qLiouKi4qLiomJiomIiYiJiImIh4iIh4iHhoeGhYWGhYaFhIWEg4OEg4KDgoOCgYKBgIGAgICAgH+Af39+f359fn18fX19fHx8e3t6e3p7enl6eXp5enl6enl5eXh5eHh5eHl4eXh5eHl4eHd5eHd3eHl4d3h3eHd4d3h3eHh4d3h4d3h3d3h5eHl4eXh5eHl5eXp5enl6eXp7ent6e3p7e3t7fHt8e3x8fHx9fH1+fX59fn9+f35/gH+AgICAgICAgYGAgYKBgoGCgoKDgoOEg4SEhIWFhIWFhoWGhYaGhoaHhoeGh4aHhoeIh4iHiIeHiIeIh4iHiIeIiIiHiIeIh4iHiIiHiIeIh4iHiIeIh4eIh4eIh4aHh4aHhoeGh4aHhoWGhYaFhoWFhIWEhYSFhIWEhISDhIOEg4OCg4OCg4KDgYKCgYKCgYCBgIGAgYCBgICAgICAgICAf4B/f4B/gH+Af35/fn9+f35/fn1+fn19fn1+fX59fn19fX19fH18fXx9fH18fXx9fH18fXx8fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x8e3x7fHt8e3x7fHx8fXx9fH18fX5+fX59fn9+f35+f35/gH+Af4B/gICAgICAgICAgICAgYCBgIGAgIGAgYGBgoGCgYKBgoGCgYKBgoGCgoKDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KCgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGBgYCBgIGAgYCBgIGAgYCBgIGAgYCBgIGAgYCBgIGAgYCAgICBgIGAgYCBgIGAgYCBgIGAgYCBgExJU1RCAAAASU5GT0lDUkQMAAAAMjAwOC0wOS0yMQAASUVORwMAAAAgAAABSVNGVBYAAABTb255IFNvdW5kIEZvcmdlIDguMAAA" />
</audio> 或:
<audio src="data:audio/x-wav;base64,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" autoplay />更多格式:
123 application/vnd.lotus-1-2-3
3gp video/3gpp
aab application/x-authoware-bin
aam application/x-authoware-map
aas application/x-authoware-seg
ai application/postscript
aif audio/x-aiff
aifc audio/x-aiff
aiff audio/x-aiff
als audio/X-Alpha5
amc application/x-mpeg
ani application/octet-stream
asc text/plain
asd application/astound
asf video/x-ms-asf
asn application/astound
asp application/x-asap
asx video/x-ms-asf
au audio/basic
avb application/octet-stream
avi video/x-msvideo
awb audio/amr-wb
bcpio application/x-bcpio
bin application/octet-stream
bld application/bld
bld2 application/bld2
bmp application/x-MS-bmp
bpk application/octet-stream
bz2 application/x-bzip2
cal image/x-cals
ccn application/x-cnc
cco application/x-cocoa
cdf application/x-netcdf
cgi magnus-internal/cgi
chat application/x-chat
class application/octet-stream
clp application/x-msclip
cmx application/x-cmx
co application/x-cult3d-object
cod image/cis-cod
cpio application/x-cpio
cpt application/mac-compactpro
crd application/x-mscardfile
csh application/x-csh
csm chemical/x-csml
csml chemical/x-csml
css text/css
cur application/octet-stream
dcm x-lml/x-evm
dcr application/x-director
dcx image/x-dcx
dhtml text/html
dir application/x-director
dll application/octet-stream
dmg application/octet-stream
dms application/octet-stream
doc application/msword
dot application/x-dot
dvi application/x-dvi
dwf drawing/x-dwf
dwg application/x-autocad
dxf application/x-autocad
dxr application/x-director
ebk application/x-expandedbook
emb chemical/x-embl-dl-nucleotide
embl chemical/x-embl-dl-nucleotide
eps application/postscript
eri image/x-eri
es audio/echospeech
esl audio/echospeech
etc application/x-earthtime
etx text/x-setext
evm x-lml/x-evm
evy application/x-envoy
exe application/octet-stream
fh4 image/x-freehand
fh5 image/x-freehand
fhc image/x-freehand
fif image/fif
fm application/x-maker
fpx image/x-fpx
fvi video/isivideo
gau chemical/x-gaussian-input
gca application/x-gca-compressed
gdb x-lml/x-gdb
gif image/gif
gps application/x-gps
gtar application/x-gtar
gz application/x-gzip
hdf application/x-hdf
hdm text/x-hdml
hdml text/x-hdml
hlp application/winhlp
hqx application/mac-binhex40
htm text/html
html text/html
hts text/html
ice x-conference/x-cooltalk
ico application/octet-stream
ief image/ief
ifm image/gif
ifs image/ifs
imy audio/melody
ins application/x-NET-Install
ips application/x-ipscript
ipx application/x-ipix
it audio/x-mod
itz audio/x-mod
ivr i-world/i-vrml
j2k image/j2k
jad text/vnd.sun.j2me.app-descriptor
jam application/x-jam
jar application/java-archive
jnlp application/x-java-jnlp-file
jpe image/jpeg
jpeg image/jpeg
jpg image/jpeg
jpz image/jpeg
js application/x-javascript
jwc application/jwc
kjx application/x-kjx
lak x-lml/x-lak
latex application/x-latex
lcc application/fastman
lcl application/x-digitalloca
lcr application/x-digitalloca
lgh application/lgh
lha application/octet-stream
lml x-lml/x-lml
lmlpack x-lml/x-lmlpack
lsf video/x-ms-asf
lsx video/x-ms-asf
lzh application/x-lzh
m13 application/x-msmediaview
m14 application/x-msmediaview
m15 audio/x-mod
m3u audio/x-mpegurl
m3url audio/x-mpegurl
ma1 audio/ma1
ma2 audio/ma2
ma3 audio/ma3
ma5 audio/ma5
man application/x-troff-man
map magnus-internal/imagemap
mbd application/mbedlet
mct application/x-mascot
mdb application/x-msaccess
mdz audio/x-mod
me application/x-troff-me
mel text/x-vmel
mi application/x-mif
mid audio/midi
midi audio/midi
mif application/x-mif
mil image/x-cals
mio audio/x-mio
mmf application/x-skt-lbs
mng video/x-mng
mny application/x-msmoney
moc application/x-mocha
mocha application/x-mocha
mod audio/x-mod
mof application/x-yumekara
mol chemical/x-mdl-molfile
mop chemical/x-mopac-input
mov video/quicktime
movie video/x-sgi-movie
mp2 audio/x-mpeg
mp3 audio/x-mpeg
mp4 video/mp4
mpc application/vnd.mpohun.certificate
mpe video/mpeg
mpeg video/mpeg
mpg video/mpeg
mpg4 video/mp4
mpga audio/mpeg
mpn application/vnd.mophun.application
mpp application/vnd.ms-project
mps application/x-mapserver
mrl text/x-mrml
mrm application/x-mrm
ms application/x-troff-ms
mts application/metastream
mtx application/metastream
mtz application/metastream
mzv application/metastream
nar application/zip
nbmp image/nbmp
nc application/x-netcdf
ndb x-lml/x-ndb
ndwn application/ndwn
nif application/x-nif
nmz application/x-scream
nokia-op-logo image/vnd.nok-oplogo-color
npx application/x-netfpx
nsnd audio/nsnd
nva application/x-neva1
oda application/oda
oom application/x-AtlasMate-Plugin
pac audio/x-pac
pae audio/x-epac
pan application/x-pan
pbm image/x-portable-bitmap
pcx image/x-pcx
pda image/x-pda
pdb chemical/x-pdb
pdf application/pdf
pfr application/font-tdpfr
pgm image/x-portable-graymap
pict image/x-pict
pm application/x-perl
pmd application/x-pmd
png image/png
pnm image/x-portable-anymap
pnz image/png
pot application/vnd.ms-powerpoint
ppm image/x-portable-pixmap
pps application/vnd.ms-powerpoint
ppt application/vnd.ms-powerpoint
pqf application/x-cprplayer
pqi application/cprplayer
prc application/x-prc
proxy application/x-ns-proxy-autoconfig
ps application/postscript
ptlk application/listenup
pub application/x-mspublisher
pvx video/x-pv-pvx
qcp audio/vnd.qcelp
qt video/quicktime
qti image/x-quicktime
qtif image/x-quicktime
r3t text/vnd.rn-realtext3d
ra audio/x-pn-realaudio
ram audio/x-pn-realaudio
rar application/x-rar-compressed
ras image/x-cmu-raster
rdf application/rdf+xml
rf image/vnd.rn-realflash
rgb image/x-rgb
rlf application/x-richlink
rm audio/x-pn-realaudio
rmf audio/x-rmf
rmm audio/x-pn-realaudio
rmvb audio/x-pn-realaudio
rnx application/vnd.rn-realplayer
roff application/x-troff
rp image/vnd.rn-realpix
rpm audio/x-pn-realaudio-plugin
rt text/vnd.rn-realtext
rte x-lml/x-gps
rtf application/rtf
rtg application/metastream
rtx text/richtext
rv video/vnd.rn-realvideo
rwc application/x-rogerwilco
s3m audio/x-mod
s3z audio/x-mod
sca application/x-supercard
scd application/x-msschedule
sdf application/e-score
sea application/x-stuffit
sgm text/x-sgml
sgml text/x-sgml
sh application/x-sh
shar application/x-shar
shtml magnus-internal/parsed-html
shw application/presentations
si6 image/si6
si7 image/vnd.stiwap.sis
si9 image/vnd.lgtwap.sis
sis application/vnd.symbian.install
sit application/x-stuffit
skd application/x-Koan
skm application/x-Koan
skp application/x-Koan
skt application/x-Koan
slc application/x-salsa
smd audio/x-smd
smi application/smil
smil application/smil
smp application/studiom
smz audio/x-smd
snd audio/basic
spc text/x-speech
spl application/futuresplash
spr application/x-sprite
sprite application/x-sprite
spt application/x-spt
src application/x-wais-source
stk application/hyperstudio
stm audio/x-mod
sv4cpio application/x-sv4cpio
sv4crc application/x-sv4crc
svf image/vnd
svg image/svg-xml
svh image/svh
svr x-world/x-svr
swf application/x-shockwave-flash
swfl application/x-shockwave-flash
t application/x-troff
tad application/octet-stream
talk text/x-speech
tar application/x-tar
taz application/x-tar
tbp application/x-timbuktu
tbt application/x-timbuktu
tcl application/x-tcl
tex application/x-tex
texi application/x-texinfo
texinfo application/x-texinfo
tgz application/x-tar
thm application/vnd.eri.thm
tif image/tiff
tiff image/tiff
tki application/x-tkined
tkined application/x-tkined
toc application/toc
toy image/toy
tr application/x-troff
trk x-lml/x-gps
trm application/x-msterminal
tsi audio/tsplayer
tsp application/dsptype
tsv text/tab-separated-values
tsv text/tab-separated-values
ttf application/octet-stream
ttz application/t-time
txt text/plain
ult audio/x-mod
ustar application/x-ustar
uu application/x-uuencode
uue application/x-uuencode
vcd application/x-cdlink
vcf text/x-vcard
vdo video/vdo
vib audio/vib
viv video/vivo
vivo video/vivo
vmd application/vocaltec-media-desc
vmf application/vocaltec-media-file
vmi application/x-dreamcast-vms-info
vms application/x-dreamcast-vms
vox audio/voxware
vqe audio/x-twinvq-plugin
vqf audio/x-twinvq
vql audio/x-twinvq
vre x-world/x-vream
vrml x-world/x-vrml
vrt x-world/x-vrt
vrw x-world/x-vream
vts workbook/formulaone
wav audio/x-wav
wax audio/x-ms-wax
wbmp image/vnd.wap.wbmp
web application/vnd.xara
wi image/wavelet
wis application/x-InstallShield
wm video/x-ms-wm
wma audio/x-ms-wma
wmd application/x-ms-wmd
wmf application/x-msmetafile
wml text/vnd.wap.wml
wmlc application/vnd.wap.wmlc
wmls text/vnd.wap.wmlscript
wmlsc application/vnd.wap.wmlscriptc
wmlscript text/vnd.wap.wmlscript
wmv audio/x-ms-wmv
wmx video/x-ms-wmx
wmz application/x-ms-wmz
wpng image/x-up-wpng
wpt x-lml/x-gps
wri application/x-mswrite
wrl x-world/x-vrml
wrz x-world/x-vrml
ws text/vnd.wap.wmlscript
wsc application/vnd.wap.wmlscriptc
wv video/wavelet
wvx video/x-ms-wvx
wxl application/x-wxl
x-gzip application/x-gzip
xar application/vnd.xara
xbm image/x-xbitmap
xdm application/x-xdma
xdma application/x-xdma
xdw application/vnd.fujixerox.docuworks
xht application/xhtml+xml
xhtm application/xhtml+xml
xhtml application/xhtml+xml
xla application/vnd.ms-excel
xlc application/vnd.ms-excel
xll application/x-excel
xlm application/vnd.ms-excel
xls application/vnd.ms-excel
xlt application/vnd.ms-excel
xlw application/vnd.ms-excel
xm audio/x-mod
xml text/xml
xmz audio/x-mod
xpi application/x-xpinstall
xpm image/x-xpixmap
xsit text/xml
xsl text/xml
xul text/xul
xwd image/x-xwindowdump
xyz chemical/x-pdb
yz1 application/x-yz1
z application/x-compress
zac application/x-zaurus-zac
zip application/zip
audio标签 FileReader blob转base64 base64转blob 语音相关推荐
- base64转化字节流 js_js - blob流和base64，以及file和base64的相互转换
file和base64 1.file文件转换为base64,得到base64格式图片 var reader = new FileReader(); reader.readAsDataURL(this. ...
- 图片base64，file,blob格式的相互转换，以及gif转base64
图片base64,file,blob格式的相互转换,以及gif转base64(第六点) 1.new Image()图片链接转base64 只能转化为普通的jpg/png图片.无法转化gif图 type ...
- 在JavaScript中从base64字符串创建Blob
本文翻译自:Creating a Blob from a base64 string in JavaScript I have base64-encoded binary data in a stri ...
- base64转音频blob
// base64转音频blob$b64toBlob(b64Data, contentType, sliceSize) {contentType = contentType || ''sliceSiz ...
- 论HTML5 Audio 标签歌词同步的实现
HTML5草案里面其实有原生的字幕标签(<track> Tag)的,但使用的是vtt格式的文件,非常规的字幕(.sub, .srt)或歌词文件(.lrc). 用法如下(代码来自W3Scho ...
- html5播放器源码自己添加音乐,HTML5 audio标签 打造属于自己的音乐播放器
最近学习了HTML5中的Audio标签,学习他的最好方式当然是实践,于是就自己写了一个.那就直接上演示链接吧 http://htmlpreview.github.io/?https://github. ...
- audio标签控制音量_html中audio标签的使用
在HTML5标准网页里面,我们可以运用audio标签来完成我们对声音的调用及播放.以下是最经常见到的运用HTML5三种基本格式: 1.最少的代码 2.带有不兼容提醒的代码 Your browser d ...
- HTML5 Audio标签方法和函数API介绍
问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函 ...
- audio标签下方有空隙的原因与解决方法
audio标签下会与相邻标签产生空隙,如图所示 原因: 块级元素包含内联元素时,内联元素默认是和父级元素的baseline(基线)对齐的,而baseline又和父级元素底边有一定的距离(这个距离和fo ...
最新文章
- 处理机调度的性能准则
- Bengio参与、LeCun点赞：图神经网络权威基准现已开源
- 基于 linux 平台的 libpcap 源代码分析
- 2021年科研学术海报Poster模板
- 【原创】分布式之redis复习精讲
- 取消对 null 指针“l”的引用。_C语言编程笔记丨C 语言指针 5 分钟教程
- php curl模拟https请求
- python2编码_Python2字符编码
- linux终端如何打开文件夹,如何从终端打开文件夹(带GUI)？
- Spring boot升级到2.3.2.Release和Spring framework升级到5.28.Release踩过的坑
- Go语言的素数对象编程实现及其使用
- 视频编解码（十八）：编解码linux测试步骤
- BM25算法的python实现
- 服务器win10系统开机慢,Win10系统开机慢怎么办 windows10开机慢的解决方法
- oracle imp 版本错误,解决imp导入数据报IMP-00098错误
- EOJ 1864 二分图匹配
- (实验)完成一个医院挂号系统
- POJ 1392 Ouroboros Snake
- 各类编程视频教学资源下载
- 市面上常见的手机分辨率