audio 标签动态src 且src是http无法播放问题

javascript 复制代码
 <audio
          ref="audio" 
          :src="src"
          alt="加载失败"
          controls
        />

src是动态传参的

无法播放因为动态src需要在赋值后对audio进行重载

javascript 复制代码
this.$refs.audio.load()

注意如果,src跟本项目地址IP端口协议不同,会出现跨域问题。audio标签本身是允许跨域的资源的,但是如果src资源本身所在服务不允许跨域就会出现,直接访问文件地址能够播放,但是放到audio里面就无法播放的问题,这个有两个解决方法。

法一:

让资源服务器允许跨域。

法二:

不在audio里面去播放跨域的音频

直接用a标签连接打开新的浏览器页签

javascript 复制代码
  <a  
     :href="src"         
      target="blank"
       style="text-decoration: none;"
            >
              播放
            </a> 
相关推荐
古希腊数通小白(ip在学)4 小时前
stp拓扑变化分类
运维·服务器·网络·智能路由器
程序小武11 小时前
网络请求的基本概念、原理及生活化解析
网络协议
hrrrrb11 小时前
【TCP/IP】11. IP 组播
服务器·网络·tcp/ip
甘露寺12 小时前
HTTP 请求体类型详解:选择最适合的数据提交格式
网络·网络协议·http
七仔あ12 小时前
小皮面板搭建pikachu靶场
网络·渗透
傻啦嘿哟12 小时前
长效住宅代理IP:反爬虫战场上的隐形盾牌
爬虫·网络协议·tcp/ip
Muisti13 小时前
NAT技术(网络地址转换)
网络·计算机网络·智能路由器
SKYDROID云卓小助手13 小时前
无人设备遥控器之无线电频率篇
服务器·网络·单片机·嵌入式硬件·算法
chirrupy_hamal14 小时前
TCP 保活(KeepAlive)机制详解
网络·tcp
hrrrrb14 小时前
【TCP/IP】7. IP 路由
网络·tcp/ip·智能路由器