最近工作之余会听听评书，但主流门户收费加广告着实让人烦躁。作为IT人，怎能如此顺应别人家的产品规则。

下面以 python + taro 为例，写一个爬虫 + 小程序的播放应用：

最终实现的效果如下：

1132488286.jpg

原本听的喜马拉雅，但是资源有限。找到了个简陋的听书站点，资源是有了，但是广告一堆、交互生硬，谈不上用户体验了。

所以，爬它

爬虫

脚本不多，大概说下步骤：

获取全本的播放页面链接

循环页面链接获取每回的实际播放链接

重新组织数据结构打印输出

最终要的就是打印的 这个数据

完整脚本如下：

# -*-coding:utf-8-*-

import requests

from bs4 import BeautifulSoup

session = requests.session()

headers = {

'user-agent': 'Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0',

'accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',

'accept-language': 'zh-CN,zh;q=0.8,zh-TW;q=0.7,zh-HK;q=0.5,en-US;q=0.3,en;q=0.2',

'accept-encoding': 'gzip, deflate, br',

}

def getHrefs(url):

r = session.get(url,headers=headers, verify=False)

r.encoding = 'GBK'

soup = BeautifulSoup(r.text, 'lxml')

rich_media_content = soup.find_all('div', class_='player')

playDatas = []

for item in rich_media_content:

playData = item.find("a").attrs['href']

playData = playData.replace('//','http://')

playData = playData.replace('play','playdata')

playDatas.append({

'playData': playData,

'title': item.find("a").text

})

return playDatas

def getPlayUrls(bookTitle, playDatas):

if len(playDatas) == 0:

return

playUrls = []

for index, item in enumerate(playDatas):

r = session.post(item['playData'], headers=headers, verify=False)

resp = r.json()

playUrls.append({

'playUrl': resp['urlpath'].replace('flv','mp3'),

'title': '{bookTitle}-{title}'.format(bookTitle=bookTitle, title=item['title']),

'id': index,

'played': 0,

})

return playUrls

if __name__ == "__main__":

bookTitle = 'xxxx第六部'

playDatas = getHrefs('http://xxxx.xxxx.xxx/xxxxx/')

playUrls = getPlayUrls(bookTitle, playDatas)

print(playUrls)

小程序

既然是给自己用的，就没必要搞的太复杂了。直接把爬到的数据放应用本地吧，加上一个播放列表，一个播放详情页面即可。

我本身用react较顺手，选择了Taro框架写小程序，顺便用了下Taro-UI组件库。

列表页面

...

componentDidShow () {

const songId = Taro.getStorageSync('songId')

const songList = Taro.getStorageSync('songList')

if (songList) {

this.setState({listData: songList})

}else {

Taro.setStorageSync('songList', this.state.listData)

}

if (songId) {

this.setState({ songId })

}

}

...

{listData && listData.map((item,index) => (

title={item.title}

arrow='right'

extraText={this.getExtraText(songId,item)}

onClick={()=>this.handleClick(index)}

/>

))}

详情页面

详情页面主要做的是：获取从列表来的ID，播放这个回目，播放控制，自动下一首，记录当前播放的回目及时间。

核心代码如下

...

startPlay = (itemIndex) => {

const songId = Taro.getStorageSync('songId')

let playTime = 0

if (songId && songId.toString() === itemIndex.toString()) {

playTime = Taro.getStorageSync('playTime')

}

const {listData} = this.state;

const musicInfo = {

name: listData[itemIndex].title,

playUrl: listData[itemIndex].playUrl,

itemIndex: parseInt(itemIndex),

playTime: playTime

}

this.setState({

musicInfo,

}, () => {

Taro.setNavigationBarTitle({title: listData[itemIndex].title})

this.autoPlay(musicInfo)

})

}

...

autoPlay = (musicInfo) => {

const bgMusic = Taro.getBackgroundAudioManager();

this.setState({

myAudio: bgMusic

},() => {

const songList = Taro.getStorageSync('songList')

songList[musicInfo.itemIndex].played = 1;

Taro.setStorageSync('songList', songList)

})

Taro.setStorageSync('songId', musicInfo.itemIndex)

bgMusic.src = musicInfo.playUrl

bgMusic.title = musicInfo.name

if (musicInfo.playTime > 0) {

bgMusic.startTime = musicInfo.playTime

}else {

bgMusic.startTime = 0

}

bgMusic.onTimeUpdate(() => {

this.setState({

timeLenght: bgMusic.duration,

playTime: bgMusic.currentTime

}, () => {

Taro.setStorageSync('playTime', bgMusic.currentTime)

})

})

bgMusic.onEnded(() => {

this.next();

})

bgMusic.onError(() => {

Taro.atMessage({

'message': '播放错误，自动播放下一首',

'type': 'error',

'duration': 1500

})

setTimeout(() => {

this.next();

}, 2000)

})

}

ok, 打开微信开发者工具，加载打包文件，扫个体验码，自嗨去吧~~