一直想做一个从爬虫到数据处理，到API部署，再到小程序展示的一条龙项目，最近抽了些时间，实现了一个关于知乎热榜的，今天就来分享一下！由于代码还没有完全整理好，今天只给出一个大致的思路和部分代码，最终的
一直想做一个从爬虫到数据处理，到API部署，再到小程序展示的一条龙项目，最近抽了些时间，实现了一个关于知乎热榜的，今天就来分享一下！
由于代码还没有完全整理好，今天只给出一个大致的思路和部分代码，最终的详细代码可以关注后续的文章！
数据爬取
首先我们看下需要爬取的知乎热榜
https://www.zhihu.com/billboard
.这个热榜可以返回50条热榜数据，而这些数据都是通过页面的一个 JavaScript 返回的
于是我们就可以通过解析这段 JS 代码来获取对应数据
url =然后我们再点击一个热榜，查看下具体的热榜页面，我们一直向下下拉页面，并打开浏览器的调试板，就可以看到如下的一个请求
该接口返回了一个包含热榜回答信息的 json 文件，可以通过解析该文件来获取对应的回答
数据存储
获取到数据之后，我们需要存储到数据库中，以便于后续使用。因为后面准备使用 Flask 来搭建 API 服务，所以这里存储数据的过程也基于 Flask 来做，用插件 flask_sqlalchemy。
定义数据结构
我们定义三张表，分别存储知乎热榜的详细列表信息，热榜的热度信息和热榜对应的回答信息
定时任务
由于我们需要定时查询热榜列表和热榜的热度值，所以这里需要定时运行相关的任务，使用插件 flask_apscheduler 来做定时任务
我们的定时任务，涉及到了网络请求和数据入库的操作，把这部分定时任务代码单独拉出来，在 Flask 项目的根目录下创建一个文件 apschedulerjob.py，由于在运行该文件时，是没有 Flask app 变量的，所以我们需要手动调用 app_context() 方法来创建 app 上下文
当然，这里的 scheduler 变量是在 create_app 中初始化过的
接着，我们就可以根据前面的两个爬虫函数，来分别入库数据了
入库热榜热度数据
update入库热榜列表数据
new入库热榜回答数据
最后我们就可以在 Flask 的入口程序中启动定时任务了
编写 API
热榜列表 API
我们首先先来做热榜列表的接口，在数据库表 ZhihuMetrics 中拿到当天的热榜最新热度信息，然后再根据热榜热度信息来获取对应的列表信息，可以总结到如下的一个函数中
接着定义一个视图函数返回 json 数据
热榜详情 API
下面再来做热榜详情接口，该接口可以返回热榜热度走势信息，为前端画图提供数据。
def zhihudetail(hot_id):
zhihumetrics_details = ZhihuMetrics.query.filter_by(hot_cardid=hot_id).order_by(ZhihuMetrics.update_time).all()
Column = {接入小程序
对于小程序端，我们这里使用了 uni-app 框架，这是一个可以一份代码多端运行的框架，还是比较不错的。
创建项目
首先通过 IDE HBuilder 创建一个 uni-app 模板
改造项目
我们简单改造下该模板，首先修改下 index.nvue 文件，把 tabList 修改如下
我们暂时只保留两个 tab 页签，没错后面还要再做微博的热榜！
接下来打开 news-page.nvue 文件，修改网络请求地址把 URL 地址指向我们自己的 API 服务地址
然后再添加我们自己的新闻参数再修改函数 goDetail 如下
goDetail(detail) {
点击每条热榜时，就会跳转到 url 对应的 /pages/detail/detail-new 页面
引入 uCharts
下面编写 detail-new.nvue 文件，这里主要用到了 uni-app 的插件 uCharts。
这是一个高性能的跨端图表插件，非常好用。
template 部分创建两个 view，分别用于展示柱状图和折线图
再编写 script 部分
getServerData(){
console.log(再根据 uCharts 的官方文档编写对应的展示图表函数
showColumn(canvasId,chartData){
canvaColumn=new uCharts({
这样，基本上我们就可以到小程序的模拟器来查看效果啦
热榜列表页面
热榜详情页面
基本的效果是有了，不过还有很多需要优化的地方，下一次，我会分享出优化后的代码以及如何把 API 服务部署到云端，同时还是提供出供大家练习的 API，不要错过哦！
...
广告
- 0