JS通过XMLHttpRequest 读取服务器端文件

最新推荐文章于 2024-07-09 14:31:42 发布

weixin_33881041

最新推荐文章于 2024-07-09 14:31:42 发布

阅读量1.8k

点赞数

文章标签： javascript python 后端 ViewUI

原文链接：https://my.oschina.net/zb0423/blog/1538175

版权

2019独角兽企业重金招聘Python工程师标准>>>

XMLHttpRequest 读取Blob二进制数据，比如获取服务器端的mp3文件。


<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script src="http://cdn.abb.com/common/js/jquery3.0.min.js"></script>

</head>
<body>
<div id="chat"></div>

<script type="text/javascript">
	

	  var url = "https://a1.easemob.com/1121170824115953/haiguazi/chatfiles/2b95bc00-99f5-11e7-bddb-87a933f0d201";           
	  var xmlhttp = null;                 
	  try {    
	      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");    
	  } catch(e) {    
	      try {    
	          xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");    
	      } catch(e) {}    
	  }    

	if (!xmlhttp) {
	  	xmlhttp = new XMLHttpRequest();    
	}
	xmlhttp.onreadystatechange = function() {    
     	if (xmlhttp.readyState == 4) {    
    		if(xmlhttp.status == 200){  
	        	console.log(xmlhttp.response.type);
	        	console.log(xmlhttp.response);
	        	var audiourl = window.URL.createObjectURL(xmlhttp.response);
	        	console.log(audiourl);
	        	$("#chat").append('<audio controls="controls"><source src="'+audiourl+'" type="audio/mpeg" id="myaudio"></audio>');
        	}                     
    	}    
    };

    var method = 'GET';
    xmlhttp.open(method, url);
 	
 	xmlhttp.responseType = "blob";

	var innerHeaer = {
        'X-Requested-With': 'XMLHttpRequest',
        'Accept': 'audio/mp3',
        'share-secret': '',
        'Authorization': 'Bearer ' + ''
    };
	for (var key in innerHeaer) {
        if (innerHeaer[key]) {
            xmlhttp.setRequestHeader(key, innerHeaer[key]);
        }
    }
    
    xmlhttp.send(null);
</script>
</body>
</html>

转载于:https://my.oschina.net/zb0423/blog/1538175