我正在尝试在codepen.io（http://codepen.io/www139/pen/oLrJAZ?editors=0010）上创建音频可视化程序。我建立了自己的网络服务器，该服务器用于上传项目的音频。您可以收听音频而不会出现CORS问题（http://williamgreen.hopto.org/audioVisualization/song.mp3）。但是，音频可视化程序需要访问以读取声音频率。当我尝试读取音频频率时，出现以下错误：
由于http://williamgreen.hopto.org/audioVisualization/song.mp3的CORS访问限制，MediaElementAudioSource输出零
频率返回为0s。
当我添加此行时：
audio.crossOrigin = 'anonymous';
我不再收到错误，但音频未加载。
我还尝试根据https://stackoverflow.com/a/11691776/3011082在.htaccess中使用此标头设置CORS访问。这个问题似乎也很有趣，但是缺少我需要的信息（由于CORS访问限制本地mp3文件，MediaElementAudioSource输出零）。我还引用了这一点（http://enable-cors.org/server_apache.html）。
有什么建议么？是否需要设置任何Apache / PHP标头？我该如何工作？
我曾经问过这个问题（我如何使用apache2为Linux Web服务器上的音频文件设置CORS访问权限？）但是我不够准确，答案没有帮助我，这就是为什么问这个问题。除了高中以外，我的大脑一直在努力解决这个难题；）
编辑：我问这个问题，它揭示了更多的信息。这个问题很可能与用于访问另一个域上的文件的CORS标头CORS标头有关
经过数小时的研究和实验，我终于弄清楚该怎么做。截至撰写本文时，网上几乎没有文档显示如何执行此操作。我希望人们会发现这有帮助。
了解CORS：
CORS为的缩写Ç罗斯ö rigin ř esoruce小号哈林。CORS是在不同域之间共享/访问信息的新标准。CORS基本上是一种使用服务器头告诉浏览器是否被允许访问另一服务器上的特定文件或与之交互的方法。尽管您可以加载大多数内容而不必担心CORS（例如图像，音频，视频，甚至其他网页），但与这些元素的交互需要服务器的特殊权限。就我而言，我试图从另一台服务器上的音频文件中读取频率。在这种情况下，我试图从服务器上的特殊标头访问需要授权的信息。
浏览器支持非常好，但是，如果您支持较旧的浏览器，则可能需要在此处查看支持表（http://caniuse.com/#search=cors）
我做了什么：
启用了.htaccess的使用（我认为您可以使用apache2.conf或000-default.conf完成相同的操作，但是.htaccess文件更易于编辑和维护）。这些文件用于设置Apache的标题和设置。我通过转到/etc/apache2/和编辑启用了.htaccess文件的使用apache2.conf。确保您<Directory /var/www/>输入的内容符合以下条件：
<Directory /var/www/> Options Indexes FollowSymLinks AllowOverride All Require all granted </Directory>
我在.htaccess文件中设置了标题，以允许从Codepen进行访问。在与您要共享的文件相同的目录中创建一个.htaccess文件。您只想共享您必须拥有的内容，否则可能会带来安全风险。在您的.htaccess文件中输入以下内容：Header set Access-Control-Allow-Origin: "http://websiteWantingToAccessYourFile.com"。保存文件。
使用此命令重新启动Apache sudo service apache2 restart。如果有提示，请输入密码。
使用音频，我添加了crossorigin="anonymous"属性。您可以在此处（https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes）了解有关CORS设置（跨域）的更多信息。我想您可以使用ajax和xhr请求进行设置。
不同版本的apache可能具有不同的文件名或标准。检查以确保这是您的版本正确的。我在Ubuntu服务器上运行Apache 2.4.18。
请告诉我是否可以改善。我花了很多时间来理解这一点，但我不是专家。在评论中发表您的建议。:)
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句