不知道怎么的,突然江苏的几所大学就盛行一个改编《南山南》的风气,各个学校都争相在自己的官微上发布自己改编的《南山南》。好好的一首歌就这么被乱改我也是挺心痛的。不过话说回来,当我想在电脑上听歌的时候突然发现电脑竟然无法听歌,更别提下载了。下面就以南航的官微页面为例。
首先解决下听的问题,其实听的问题还是很普遍的。如果注意的话,你会发现很多能用手机打开的网页在电脑上打开的时候就会出现类似无法点击的异常情况。比如他的下载界面:
下面播放的地方是无法点击的,这是因为那些网页本来就是提供给他的客户端看的,并不需要能在电脑上看。因此他在设计的时候就没有考虑电脑的接口,于是就直接将客户认定为手机端。这样一来用电脑当然不能触发一些滑动、触摸的事件了。
解决的方法也很简单啦,毕竟我们的chrome 是很强大的,在开发者工具里就有一个用来模拟移动端设备的调试模式:
按F12 进入开发者模式后,点击左上脚的那个“小手机”的图标,进入模拟设备的模式。然后会在下面看到Emulation框已经激活。(当然也可以直接Enable emulation)。选择Device条目,将Model改为我们需要模拟的手机。接着就会在左边出现一个类似手机屏幕的框框,而且鼠标也变成了移动端的滚动球,这样就OK了。当然如果不想看这么小的屏幕,我们可以把下面的Enable screen resolution选项关掉(默认是开的)。
最后我们点开Network条目,会发现其中有一个填写User-agent的框框,而且已经被填上了类似:
Mozilla/5.0 (Linux; Android 4.3; Nexus 10 Build/JSS15Q) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2307.2 Safari/537.36
之类的移动端的User-agent了。这样我们就发现能点的动播放歌曲的按钮了。
查阅了一下资料,发现原来主要是考虑到版权的原因,所以不能提供下载链接。所以他的播放地址并不像平常的地方一样把url直接写在源码的显眼位置。而是藏在他硕大的js 文件里。显然,这对通过人脑识别地址的方法有一定的限制作用。然而,我们有chrome的过滤系统,任何偷偷与后台交互的数据都逃不掉。在network条目中,我们可以通过过滤 Media 来取得音频信息。
果然,在设置监听和过滤之后,再次点击播放按钮,我们就获得的一个请求音频资源的封包:
那么他的Request URL就是真正的下载地址了(打开后是一个播放框,右键另存为就好了),而我们也能通过Response包中的Content-type来判断出他是一个mp3格式的音乐。最后将下载得到的文件重命名并且加上.mp3后缀方便操作系统识别就好了。(当然也可以通过查看文件头来判断文件类型,见:利用文件头判断文件类型)