Asp.net 2.0 Web Pages_play 文件 mp3、mp4答案

【问题标题】：Asp.net 2.0 Web Pages_play file mp3, mp4Asp.net 2.0 Web Pages_play 文件 mp3、mp4
【发布时间】：2018-01-12 04:37:32
【问题描述】：

我想使用 html5、JavaScript 和 jQuery 在 Pages 中播放 mp3 and mp4 文件。如果文件位于播放文件的项目中，则它可以工作，但如果文件位于我计算机上的另一个文件夹（E、D 或下载...），则它们无法运行。
错误：

错误：searchms.aspx:1491 Uncaught (in promise) DOMException: The element has no supported sources.

(play.click(function (e) { e.preventDefault(); song.play();  // this error

【问题讨论】：

标签： javascript asp.net html

【解决方案1】：

自 Chrome 50 起，对 audio（或 video）元素的 play() 调用将返回 Promise 实例（更多详细信息可在 this reference 中找到）。您应该为成功播放添加检测，并且 Promise 实例会像以下示例一样实现：

HTML

<audio id="song" src="../path/to/audio/file.mp3" />
<button id="play">Play</button>

var play = $('#play'); // example
play.click(function (e) { 
    e.preventDefault(); 
    var playback = document.querySelector('#song').play();
    if (playback !== undefined) {
        playback.then(function() {
            // do something
        }).catch(function(error) {
            // do something else
        });
    }
});

另一个例子可以在HTMLMediaElement.play() Returns a Promise Sample找到。

如果是CORS问题，尝试将crossorigin属性设置为匿名属性，然后确保从服务器返回的响应头包含Access-Control-Allow-Origin: *：

var song = document.getElementById('song');
song.setAttribute('crossorigin', 'anonymous');

// or this:
song.crossOrigin = 'anonymous';