项目使用vue-cli全家桶搭建的，我在某个页面写了一个音乐播放的标签：

<audio id="audio" autoplay class="hide" :src="audioUrl"></audio>

然后js部分：

playRecord() { //播放录音
    const audio = document.getElementById('audio');
    //this.recorder.play(audio);
    audio.src = this.GLOBAL.pro1_r_ip + '/sr/tmp/cache_readingcut.wav';
    audio.load();
},
uploadAudio() { //上传录音
    this.stopRecord();
    const record = this.recorder.getBlob();
    const t = this;
    let data;
    let reader = new window.FileReader();
    reader.readAsDataURL(record);
    reader.onloadend = function () {
        data = reader.result;
        t.$axios.post(t.GLOBAL.pro1_ip + '/readingcutupload', {
            file: data
        }).then(res => {
            if (res.data.result === 1) {
                t.success('上传成功！');
            } else {
                t.error(res.data.msg);
            }
        })
    };
}

然后问题来了：

我做的是一个网页录音的功能，用户录音后，前端这里把音频文件传给后端，然后后端存进服务器，然后返给我一个所存放地址的链接，我直接播放那个链接里面的音频文件。

现在后端给了一个固定的存放地址，但是里面的内容是会实时刷新的，我传了一个新的音频里面就会刷新成新上传的音频文件，但是我用audio每次重新录音后 读取那个链接的音频，在线用耳机听的话都是同一个音频，并没有实时更新，但是下载下来测试了一下真实的音频文件确实是实时更新的。试了两个办法：

一个是.load()方法重载audio，但是没效果
第二个是每次重新录音时，删掉audio标签，然后录音完成再重新插入一个新的audio标签，但是也没有效果

想请教各位有没有好的解决办法？

----------------------分割线-------------------------
我怕我讲的太繁琐了有点难理解，如果简单粗暴的讲就是，audio的src用的是同一个链接，但是链接里面的音乐是动态改变的，但是网页上用耳机听一直都是同一首，怎么解决这个问题？