13

看看这个播放按钮,看起来完全是用javascript写的:spotify play button

请注意,按下播放将导致 Spotify 开始播放音乐。好的,我认为这是通过一些特定于应用程序的协议链接(如 spotify://play)完成的,尽管我可能是错的。但疯狂的是,如果您停止在 Spotify 中播放音乐,浏览器中的按钮将更新以显示音乐已停止播放!这是如何运作的?

你可以在这里查看它的来源

4

3 回答 3

4

桌面*.spotilocal.com在您的计算机上运行服务器,然后在网络上,嵌入播放器(示例)将选择一个子域名(示例:)fdxubmxkqp.spotilocal.com

然后它向本地服务器的 API 发出请求,示例:

https://fdxubmxkqp.spotilocal.com:4370/service/version.json
https://fdxubmxkqp.spotilocal.com:4370/simplecsrf/token.json

它只返回一些 JSON:

{
"version": 9, 
"client_version": "1.0.10.107.gd0dfca3a"
}

有关更多信息,请参阅此屏幕截图,或者您可以通过访问news.spotify.com并将网络检查spotilocal器用作过滤器来获取相同的信息。

在此处输入图像描述

于 2015-08-05T16:32:24.340 回答
3

(注意,这不是他们实际的做法,但对于希望实现类似功能的人来说,这仍然是一个有效的答案)

使用自定义协议内容处理程序

它注册了一个自定义协议内容处理程序。您可以通过浏览器为任何"web-*"协议注册协议,以便让您的网站处理该协议,但您也可以在安装时让应用程序注册协议。(这就是 Spotify 的工作方式)。在这里看到这篇文章:

将应用程序注册到 URL 协议

您的浏览器可以配置为识别某些处理程序。

我不确定每个浏览器是如何做到的,我相信它可以根据上面链接的文章在 Internet Explorer 的注册表级别上运行。

无论如何,在 Chrome 和 Firefox 中都有window.navigator.registerProtocolHandler注册协议的功能。

见这里:https ://developer.mozilla.org/en-US/docs/DOM/navigator.registerProtocolHandler

另外,请查看这篇非常简短的文章。(虽然信息非常稀少)


Chrome 13 终于包含navigator.registerProtocolHandler. 此 API 允许 Web 应用程序将自己注册为特定协议的可能处理程序。例如,用户可以选择您的应用程序来处理“mailto”链接。

注册一个协议方案,如:

navigator.registerProtocolHandler(
    'web+mystuff', 'http://example.com/rph?q=%s', 'My App');

如果我在回答中没有明确说明,我提供了有关 Web 应用程序如何注册自己的协议以及桌面应用程序如何注册新协议的信息。(任何网络应用程序,都需要前缀web-*以避免安全问题)

于 2012-10-28T20:48:42.267 回答
3

spotify 播放按钮长轮询(通过 HTTPS)在 localhost 上运行的 spotify 应用程序以更新状态。

于 2013-07-01T22:19:04.933 回答