我设置了一个本地web服务器(127.0.0.1),我想用javascript从其他域(http://edge.telin.swiftserve.com)获取内容。但是它在控制台web浏览器中返回一个错误。上面写着
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://edge.telin.swiftserve.com/live/livetv-mbr/amlst:fa161aa74311/chunklist_b1328000.m3u8?stime=20160907142814&etime=20160907182814&encoded=0157a3207a0dbe56fac02. (Reason: CORS header 'Access-Control-Allow-Origin' missing)
如果我在chrome浏览器中安装了cors扩展,则成功获取内容,如果我没有安装它,则无法获取。
这是代码
<html>
<head>
</head>
<body>
<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
<video id="video" width="640" height="360" controls></video>
<script>
if(Hls.isSupported()) {
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource('http://edge.telin.swiftserve.com/live/livetv-mbr/amlst:fa161aa74311/chunklist_b1328000.m3u8?stime=20160907142814&etime=20160907182814&encoded=0157a3207a0dbe56fac02');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
</script>
</body>
</html>
你能够成功地获取内容,因为扩展绕过浏览器安全。这就是原因。
详细说明,浏览器有内置的安全性,以防止它发出跨域请求。这种安全性可以在扩展中禁用。