Krpano中使用音频的方法

需求：制作一个瀑布流，想添加一个自动播放的音乐，使用audio这个标签，出现的问题就是：

1、Chrome提示：DOMException: play() failed because the user didn’t interact with the document first.
2、Safari 提示：NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
一句话总结：就是不允许你自动播放audio，即使你通过代码trigger触发play等事件都是不允许的，必须要你进行和浏览器进行事件互动，人为的点击，触摸等操作才能播放。经调研得知：最开始移动端浏览器是完全禁止音视频自动播放的，考虑到了手机的带宽以及对电池的消耗。但是后来又改了，因为浏览器厂商发现网页开发人员可能会使用 其他替代方案，而播放性能消耗更为糟糕，所以这样对用户反而是不利的。因此浏览器厂商放开了对多媒体自动播放的限制，只要具备以下条件就能自动播放：

①没音频轨道，或者设置了 muted 属性；
②在视图里面是可见的，要插入到 DOM 里面并且不是 display: none 或者 visibility: hidden 的，没有滑出可视区域；
换句话说，只要你不开声音扰民，且对用户可见，就让你自动播放，不需要你去使用 GIF 的方法进行 hack。这种实现主要对于视频的，自动播放但是却是静音的，需要你点击喇叭才能有声音，这对于音频答题就跟没说一样。果断放弃。
而桌面浏览器Chrome官方提示2018.10月份也放开自动播放限制，不知道效果是不是和上面的一样，如果一样也是鸡肋。

上天总是公平的，audio被阉割了，一定有其他的办法，那就是Krpano

简介：Krpano算是常用的全景开发的一个软件了，刚入手时遇到一堆坑，记录一下最近遇到的音频问题解决方法。

使用Krpano时要在中间使用音频播放或者背景音乐时暂时就用到了三种方法：

一、使用H5中的audio标签。

这算是最简单常用的方法，也简单有效，当做的是全景图时，就可以用到这个，如果做的是全景视频时就不要用了，因为在ios上和一部分安卓机上就会出现，视频和音频无法同时播放的问题。
audio：

 <audio src="路径" loop  preload ref="horn" style="position: fixed;z-index:-1;opacity:0"></audio>

控制播放暂停：<