如何通过JavaScript检测远程音频流是否包含元数据（HTML5 Audio元素方案失效求助）

我最近尝试用HTML5的audio元素加载未知的远程音频流，结果发现这个方案完全没法正常获取元数据，根本行不通。

我写的代码是这样的：

const playStreamFromUrl = async (musicUrl) => {
    const audioPlayer = document.getElementById('audio-player-id');
    if (musicUrl && audioPlayer) {
        audioPlayer.src = musicUrl;
        audioPlayer.addEventListener("loadedmetadata", () => {
            // Access and display duration
            const title = audioPlayer.title;
            const duration = audioPlayer.duration;
            console.log('title',title,'duration',duration);
        });
        audioPlayer.play();
    } else {
        console.error('Please enter a valid music URL.', musicUrl, audioPlayer?.id);
    }
}

运行后控制台输出的结果是：

title <empty string> duration Infinity cal006.js:34:21

备注：内容来源于stack exchange，提问作者haoz