即使在更改页面时也可继续播放音乐

Question

SoundCloud是一个使用HTML5和Backbone.js的惊人网站.唯一的问题是,我找不到他们使用的技术,即使在更换页面时也能让音乐继续播放.

他们使用什么技术来播放音频流？

Answer 1

事实是,您没有加载新页面,但内容是通过AJAX加载的.

然后,该页面使用HTML5 History API添加使用浏览器的向后和向前按钮进行导航的可能性.

我通过阅读并尝试以下两个资源开始讨论这个主题:

最简单的方法是通过AJAX加载和替换当前内容然后调用

history.pushState(null, null, link.href);

为了添加当前显示页面的历史记录条目.

如果您现在按后退按钮,浏览器将不会加载上一页,但会触发该事件popState.这可以用于使用AJAX或存储在JavaScript变量中的信息来恢复上一页.

window.addEventListener("popstate", function(e) {
    //loadPreviousPage();
}