将Base64字符串转换为File 音乐mp3

chenyajun  2022-10-16 14:06:03  阅读 2191 次 评论 0 条
<!DOCTYPE html>    <html>    <head>    
	<title>Covert Base64 string to file</title>    
	<style type="text/css">    
		#base64InputTextArea {    
			width: 600px;    
			height: 200px;    
		}    
		.msgInput {    
			width: 300px;    
			display:block    
		}    
	</style>    </head>    <body>    
	<h1>将Base64字符串转换成文件</h1>    
	<textarea id="base64InputTextArea" placeholder="请输入base64字符串"></textarea>    
	<br>    
	<input type="text" id="typeInput" class="msgInput" placeholder="输入类型,如:数据:音频/ mp3">    
	<br>    
	<input type="text" id="fileNameInput" class="msgInput" placeholder="输入下载名称,如:1. mp3">    
	<br>    
	<button onclick="covertBase64ToFile()">隐藏base64字符串到文件</button>    
	<br>    
	<br>    
	<a href="" id ="downloadButton">下载文件</a>    
	<script type="text/javascript">    
		function base64ToArrayBuffer(base64) {    
			var binaryString = window.atob(base64)    
			var length = binaryString.length    
			var bytes = new Uint8Array(length)    
			for (var i = 0; i < length; i++) {    
				bytes[i] = binaryString.charCodeAt(i)    
			}    
			return bytes.buffer    
		}    
		function addDownloadContent(text, name, type) {    
			var downloadButton = document.getElementById("downloadButton");    
  			var file = new Blob([text], {type: type});    
  			downloadButton.href = URL.createObjectURL(file);    
  			downloadButton.download = name;    
		}    
		function covertBase64ToFile() {    
			var textArea = document.getElementById("base64InputTextArea")    
			var base64String = textArea.value    
			if (base64String.length <= 0) {    
				alert("please input base64 string")    
				return false    
			}    
			var typeInput = document.getElementById("typeInput")    
			var type = typeInput.value    
			if (type.length <= 0) {    
				alert("please input data type")    
				return false    
			}    
			var fileNameInput = document.getElementById("fileNameInput")    
			var fileName = fileNameInput.value    
			if (fileName.length <= 0) {    
				alert("please input file name")    
				return false    
			}    
			var bytes = base64ToArrayBuffer(base64String)    
			console.log(bytes)    
			addDownloadContent(bytes, fileName, typeInput)    
			return true    
		}    
	</script>    </body>    </html>


本文地址:https://www.chenyajun.net/index.php/post/107.html
版权声明:本文为原创文章,版权归 chenyajun 所有,欢迎分享本文,转载请保留出处!

评论已关闭!