基于ajax锚点的全站无缝伴随式音频播放方法和系统技术方案

本发明专利技术公开了基于ajax锚点的全站无缝伴随式音频播放方法和系统，实现前端浏览器页面上的无缝伴随式的音频播放体验。其技术方案为：方法包括：在网页预加载时在前端底层初始化播放器逻辑控制器和声音加载器；声音加载器在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器；播放器逻辑控制器从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令；当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。

【技术实现步骤摘要】
基于ajax锚点的全站无缝伴随式音频播放方法和系统
本专利技术涉及网页音频播放技术，尤其涉及通过ajax技术实现的无缝伴随式的音频播放方法和系统。
技术介绍
现存大量的音频或视频播放为主要功能的网站平台中，为实现音频流的播放与网站的正常浏览不相互冲突，大多采用弹出式播放器的方法进行实现。虽然这样实现了无缝的播放体验，然而这种方法有一个缺点，用户在浏览的当前页面无法找到播放器并进行相应的操作。开发这样一种全站无缝伴随式音频播放的方法源于用户自身的需求，我们认为，音频播放应该是和浏览网页行为不相冲突的，是无缝的，同时音频播放器是用户也是用户最常用的操作区域。
技术实现思路
本专利技术的目的在于解决上述问题，提供了一种基于ajax锚点的全站无缝伴随式音频播放方法和系统，实现前端浏览器页面上的无缝伴随式的音频播放体验。本专利技术的技术方案是:本专利技术揭示了一种基于ajax锚点的全站无缝伴随式音频播放系统，包括声音加载器、播放器逻辑控制器、前端ajax锚点异步加载器，其中:声音加载器，在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器；播放器逻辑控制器，从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令；前端ajax锚点异步加载器，当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。根据本专利技术的基于ajax锚点的全站无缝伴随式音频播放系统的一实施例，播放器逻辑控制器获取的音频信息包括音频名称、音频时长、音频图片。根据本专利技术的基于ajax锚点的全站无缝伴随式音频播放系统的一实施例，播放器逻辑控制器输出的逻辑控制命令包括声音控制、时间轴拖动、上/下一首、计数服务。本专利技术还揭示了一种基于ajax锚点的全站无缝伴随式音频播放方法，包括:在网页预加载时在前端底层初始化播放器逻辑控制器和声音加载器；声音加载器在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器；播放器逻辑控制器从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令；当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。根据本专利技术的基于ajax锚点的全站无缝伴随式音频播放方法的一实施例，播放器逻辑控制器获取的音频信息包括音频名称、音频时长、音频图片。根据本专利技术的基于ajax锚点的全站无缝伴随式音频播放方法的一实施例，播放器逻辑控制器输出的逻辑控制命令包括声音控制、时间轴拖动、上/下一首、计数服务。本专利技术对比现有技术有如下的技术效果:本专利技术的方案是基于ajax锚点技术实现全站无缝伴随式的音频播放。用这种技术实现的加载在前端浏览器页面上的全局播放器，其具有如下特点:(I)无缝的音频收听体验:全局播放器一旦开始播放，不会由于用户浏览导致音频中断，用户可以在网站上随意浏览，随意操作的同时不打断播放；(2)伴随式的全局播放器:全局播放器始终展现在当前页面的部分空间上，使用户能方便的对音频进行播放/暂停/下一首/音量控制/跳转等操作。【附图说明】图1示出了本专利技术的基于ajax锚点的全站无缝伴随式音频播放系统的较佳实施例的原理图。图2示出了本专利技术的基于ajax锚点的全站无缝伴随式音频播放方法的较佳实施例的流程图。【具体实施方式】下面结合附图和实施例对本专利技术作进一步的描述。图1示出了本专利技术的基于ajax锚点的全站无缝伴随式音频播放系统的较佳实施例的原理。请参见图1，本实施例的系统包括:声音加载器1、播放器逻辑控制器2、前端ajax锚点异步加载器3。声音加载器I在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器4返回声音加载器I需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器2。播放器逻辑控制器2从服务器4获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页(例如图1中的前端页面A)输出逻辑控制命令。播放器逻辑控制器2获取的音频信息包括音频名称、音频时长、音频图片。播放器逻辑控制器2输出的逻辑控制命令包括声音控制、时间轴拖动、上/下一首、计数服务。前端ajax锚点异步加载器3在网页发生变化(例如图1中的前端页面A跳转到前端页面B)时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。图2示出了本专利技术的基于ajax锚点的全站无缝伴随式音频播放方法的实施例的流程。请参见图2，本实施例的方法的实施步骤详述如下。步骤SlO:在网页预加载时在前端底层初始化播放器逻辑控制器和声音加载器。步骤S12:声音加载器在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器。步骤S14:播放器逻辑控制器从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令。播放器逻辑控制器获取的音频信息包括音频名称、音频时长、音频图片。播放器逻辑控制器输出的逻辑控制命令包括声音控制、时间轴拖动、上/下一首、计数服务。步骤S16:当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。值得说明的是，其他的音频无缝伴随式播放，可能在其他产品中对全局播放器摆放位置，展现方式略有区别，全局播放器的功能性上也有可能有部分增加或删减，如增加播放列表功能、对音频增加更多的操作等等。上述实施例是提供给本领域普通技术人员来实现和使用本专利技术的，本领域普通技术人员可在不脱离本专利技术的专利技术思想的情况下，对上述实施例做出种种修改或变化，因而本专利技术的保护范围并不被上述实施例所限，而应该是符合权利要求书所提到的创新性特征的最大范围。本文档来自技高网...

【技术保护点】
一种基于ajax锚点的全站无缝伴随式音频播放系统，包括声音加载器、播放器逻辑控制器、前端ajax锚点异步加载器，其中：声音加载器，在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，服务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器；播放器逻辑控制器，从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令；前端ajax锚点异步加载器，当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。

【技术特征摘要】
1.一种基于ajax锚点的全站无缝伴随式音频播放系统，包括声音加载器、播放器逻辑控制器、前端ajax锚点异步加载器,其中: 声音加载器，在网页载入时发起加载页面的请求，获取播放列表的第一首的音频流，月艮务器返回声音加载器需要加载的音频ID和音频流，将得到的音频流输出给播放器逻辑控制器； 播放器逻辑控制器，从服务器获取音频信息，将得到的音频信息和音频流渲染到前端网页的播放器上，并向网页输出逻辑控制命令； 前端ajax锚点异步加载器，当网页发生变化时通过ajax请求在网页上设下锚点，获取变化部分的数据，以保证网页上播放器不变的情况下更新网页的其他区域。2.根据权利要求1所述的基于ajax锚点的全站无缝伴随式音频播放系统，其特征在于，播放器逻辑控制器获取的音频信息包括音频名称、音频时长、音频图片。3.根据权利要求1所述的基于ajax锚点的全站无缝伴随式音频播放系统，其特征在于，播放器逻辑控制器输出的逻辑控制命令包括声音控制、时间轴拖动、上/下...

【专利技术属性】
技术研发人员：丁其骏，
申请(专利权)人：上海证大喜马拉雅网络科技有限公司，
类型：发明
国别省市：上海;31