[Anne]在Dashboard中展示日活报表

上一篇博客我们使用Flask搭建了一个简单的应用，在这一篇中，我们会从MySQL中获取日活相关的数据，并在Dashboard上进行展示

从MySQL中读取日活数据

日活是很多APP常用的数据指标，我们先创建一张日活表并添加一些数据

CREATE TABLE DAU(
	`date` date,
	`province` varchar(20),
	`DAU` int,
	primary key(`date`, `province`)
);
INSERT INTO DAU VALUES
	('2021-01-01', 'Beijing', 100),
	('2021-01-01', 'Shanghai', 200),
	('2021-01-02', 'Beijing', 300);

Flask使用SQLAlchemy来链接数据库，通过设置app配置中的SQLALCHEMY_DATABASE_URI可以指定对应的URL链接

from flask_sqlalchemy import SQLAlchemy
app.config["SQLALCHEMY_DATABASE_URI"] = "mysql://root:root@localhost:3306/anne"
# 这是一个Flask SQLAlchemy事件系统的配置，不进行配置的话会触发warning，是否需要使用该配置可以看https://stackoverflow.com/questions/33738467/how-do-i-know-if-i-can-disable-sqlalchemy-track-modifications
app.config["SQLALCHEMY_TRACK_MODIFICATIONS"] = False
db = SQLAlchemy(app)

创建一个DAUModel，SQLAlchemy可以通过引擎自动或许字段名，简化代码

class DAU(db.Model):
    __tablename__ = "DAU"
    __table_args__ = {
   
        "autoload": True,
        "autoload_with": db.engine
    }

通过DAUModel就可以获取到日活相关的数据，比如

print(DAU.query.all())

就可以打印出整个张DAU表中的数据

通过URL返回DAU的数据

创建好DAU的model后就可以通过它获取整张表的数据，再创建一个路由就可以将数据返回给前端进行展示了，数据采用json格式返回
Flask提供了json序列化函数jsonify但要求对象是可序列化的，在返回数据返回之前需要对数据进行转换

@app.route("/data/dau")
def dau():
    data = DAU.query.all()
    ret = []
    for row in data:
        ret.append({
   
            "date": row.date,
            "province": row.province,
            "DAU": row.DAU,
        })
    return jsonify(ret)

现在访问/data/dau这个URL就可以获得结果

[{
   "DAU":100,"date":"Fri, 01 Jan 2021 00:00:00 GMT","province":"Beijing"},{
   "DAU":200,"date":"Fri, 01 Jan 2021 00:00:00 GMT","province":"Shanghai"},{
   "DAU":300,"date":"Sat, 02 Jan 2021 00:00:00 GMT","province"