我正在建立我的第一个基本网站的过程中使用Flask 在Python.我已经成功地创建了一个网站,在该网站上我从一个API(特别是ThingSpeak)检索值,并将它们显示在一个表中.我目前面临的挑战是弄清楚是否有可能在不重新运行代码的情况下从API获取实时数据.

目前的情况是,每次我运行代码时,我都会从API中获取值.然而,我正在寻找一种方法来连续接收更新值,而不需要手动重新运行代码.有没有一种方法或途径可以在我的FlaskTM应用程序中实现这种实时数据更新?

推荐答案

其基本思想是在您的HTML文件中添加一个Java脚本函数(在代码中标记为1),该函数设置一个间隔计时器(在代码中为2),比方说,每3秒.当该间隔过go 时,调用函数(3).在该函数中,您向FlaskApp(代码中为5)发出一个AJAX请求(代码中为4).您的FlASK应用程序收集最新数据并将其发送回Java脚本函数(代码中为6),然后该函数可以将新行添加到包含最新数据(代码中为7)的网页.

我已经将所有的Java脚本、HTML和Python放在一个文件中,并且避免了所有的CSS、JJJA模板和错误处理,这样你就可以看到它是如何实际工作的.你可以自己添加花哨的造型.

#!/usr/bin/env python3

from flask import Flask, jsonify, request, url_for, redirect, session
app = Flask(__name__)

# This is the HTML, normally you would abstract it out into a template file and have Jinja render it
HTML = """
<!DOCTYPE html>
<html>
<head>
 <title>Continuous Update Demo</title>
 <!-- Pull in jQuery from Google-->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>

<body>
 <div>
   <h2>A continuously updated list:</h2>
   <ul id="culist">
   </ul>
 </div>

<script type="text/javascript">

function requestUpdate() {                         // 3

   console.log("DEBUG: requesting update");

   $.getJSON('/_refresh', function(result) {       // 4
      console.log("DEBUG: Received " + result.data);
      var HTML = "<li>" + result.data + "</li>";
      $("#culist").append(HTML);
   });

}

// This fires just once when the site initially loads
$(document).ready(function() {                      // 1
    console.log("DEBUG: document ready");
    // Get first element for list
    requestUpdate();
    // Ensure list is updated every 3s
    setInterval(requestUpdate, 3000);               // 2
});

</script>

</body>
</html>
"""

@app.route('/_refresh')                                # 5
def refresh():
    # print(request.args) to see what the Javascript sent to us
    print('DEBUG: Refresh requested');


    # Query your Thingspeak here and then pass the new data back to Javascript below


    # Build our response (a Python "dict") to send back to Javascript
    response =  { 
        'status' : 'Success', 
        'data': "A new line derived from Thingspeak",
    }
    print(f'DEBUG: Sending response {response}')
    return jsonify(response)                          # 6 - send the result to client


@app.route('/')
def main():
    print(f'DEBUG: Sending main page')
    return HTML

if __name__ == '__main__':
    app.run(debug=True)

在打开Web浏览器控制台的情况下运行此代码-它将在浏览器的"Developer Tools""Debug Tools"设置中,然后您将看到所有消息.


你可以根据自己的需要来调整它:

  • 更改更新率,
  • Css-更好地设计样式,
  • 在顶部而不是底部添加最新行,
  • 限制显示列表的长度并在新元素到达 timeshift 除较旧的元素,
  • 处理ThingSpeech中没有新数据可用的情况--也许可以将返回的JSON对象中的status: "Success"更改为status: "Unchanged"
  • 以此类推.

另一种完全不同的方法可能是打开flask和Java脚本之间的Web套接字.然后,只要ThingSpeech有更新,就可以从flask端启动所有更新,而不是每N秒判断一次Java脚本端.这一方法在第my other answer节中有描述.


以下是它运行的一小段视频.在黑色终端中,您可以看到顶部运行的(非常无样式的)网页,下方是Java脚本控制台,下方是flask的输出.

enter image description here

Python相关问答推荐

Asyncio与队列的多处理通信-仅运行一个协程

单击Cookie横幅错误并在Selenium中启用搜索栏

是否有方法将现有的X-Y图转换为X-Y-Y1图(以重新填充)?

删除pandas rame时间序列列中未更改的值

使用Python Cerberus初始化一个循环数据 struct (例如树)(v1.3.5)

当密钥是复合且唯一时,Pandas合并抱怨标签不唯一

Class_weight参数不影响RandomForestClassifier不平衡数据集中的结果

Django管理面板显示字段最大长度而不是字段名称

在Python Attrs包中,如何在field_Transformer函数中添加字段?

在Pandas DataFrame操作中用链接替换'方法的更有效方法

将tdqm与cx.Oracle查询集成

在np数组上实现无重叠的二维滑动窗口

如何设置视频语言时上传到YouTube与Python API客户端

Django admin Csrf令牌未设置

如何在PySide/Qt QColumbnView中删除列

手动设置seborn/matplotlib散点图连续变量图例中显示的值

寻找Regex模式返回与我当前函数类似的结果

如何检测鼠标/键盘的空闲时间,而不是其他输入设备?

基于另一列的GROUP-BY聚合将列添加到Polars LazyFrame

基于Scipy插值法的三次样条系数