Xampp访问控制允许起源错误
[英]Xampp Access-Control-Allow-Origin error
问题描述
I'm using Xampp server to access my video file and then play it on my website. 
我正在使用Xampp服务器访问我的视频文件，然后在我的网站上播放。 I'm using a XMLHttpRequest to obtain the video file and then put it as the source of the video player. 我正在使用XMLHttpRequest获取视频文件，然后将其作为视频播放器的源。 But I'm getting an error. 但是我遇到了错误。 I have tried to solve the problem by inserting Header set Access-Control-Allow-Origin "*" but I'm still not able to fix the problem. 我试图通过插入Header set Access-Control-Allow-Origin "*"来解决问题，但仍然无法解决问题。 I have given my codes and the error below. 我已经给出了代码和下面的错误。 Please Help Me. 请帮我。
Also I do not want any suggestion on alternative method of showing the video. 我也不想对显示视频的其他方法有任何建议。 I wish to use the XMLHttpRequest . 我希望使用XMLHttpRequest 。
My sample code: 我的示例代码：
<html> <head> <meta charset="utf-8"/> <title></title> </head> <body> <video video-player width="640" height="360" controls></video> <script> var video_player = document.querySelectorAll('[video-player]')[0]; // I ORIGINALLY USE MY http://localhost:8080/.... FOR THE 'var url' BUT FOR STACKOVERFLOW I'M USING THE LINK BELOW AS AN EXAMPLE var url = "http://dash.akamaized.net/akamai/bbb/bbb_1280x720_60fps_6000k.mp4"; request_xhr (url, function (buffer) { video_player.src = buffer; }); function request_xhr (url, cb) { var xhr = new XMLHttpRequest; xhr.withCredentials = true; xhr.open('get', url, true); xhr.responseType = 'arraybuffer'; xhr.onload = function () { cb(xhr.response); }; xhr.send(); } </script> </body> </html>
My .htaccess in the directory C:\\xampp\\htdocs\\ : 我的.htaccess在目录C:\\xampp\\htdocs\\ ：
Header set Access-Control-Allow-Origin "*"
My error: 我的错误：
4 个解决方案
解决方案1
0 2018-07-04 06:46:41
First of all, if you are using withCredentials then wildcard * can not be used as a value for Access-Control-Allow-Origin . 首先，如果您使用withCredentials则通配符*不能用作Access-Control-Allow-Origin 。 You must set the host address of your website instead of * . 您必须设置网站的主机地址而不是* 。 Second reason is Origin being null, which means the web page is not served by actual server as mentioned in comments by Jaramonda. 第二个原因是Origin为空，这意味着实际的服务器无法提供网页，如Jaramonda的评论中所述。
解决方案2
-1 2018-07-04 04:17:54
在视频元素crossorigin中使用属性，并将其值设置为匿名：
document.getElementById("videoPlayer").setAttribute("crossorigin", "anonymous");
解决方案3
-1 2018-07-04 04:20:57
尝试通过php启用它
header("Access-Control-Allow-Origin: *");
解决方案4
-1 2018-07-04 04:46:54
create blob url from arraybuffer like this 像这样从arraybuffer创建blob url
window.URL = window.URL || window.URL = window.URL || window.webkitURL request_xhr(url, function (buffer) { video_player.src = window.URL.createObjectURL(new Blob([new Uint8Array(buffer)])); }); window.webkitURL request_xhr（URL，function（buffer）{video_player.src = window.URL.createObjectURL（new Blob（[new Uint8Array（buffer）]））;}）;
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.