在烧瓶中动态更新变量答案

【问题标题】：Update a variable dynamically in flask在烧瓶中动态更新变量
【发布时间】：2017-06-27 10:56:38
【问题描述】：

我正在使用烧瓶，需要在 HTML 页面上显示一个 python 变量并实时更新它而无需刷新。我已经搜索但无法做到。为了找到解决方案，我在 python 脚本中创建了一个时间变量，该变量应该在页面中动态更新。这是我的代码：

<script>
    $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
    (function(){
        $.getJSON(
            $SCRIPT_ROOT+"/get_data",
            function(data) {
               $("#testt").text(data.time);
            }
        setInterval(arguments.callee, 1000);
        );
    });
</script>
<span id="testt">?</span>

import datetime
from flask.app import Flask
from flask.json import jsonify

app=Flask(__name__)

@app.route('/get_data', methods=['GET'])
def get_data():
    return jsonify(time=str(datetime.datetime.now().time()))
if __name__=="__main__":
    app.run(debug = True, host='0.0.0.0')

编辑：在我的解决方案中，时间仅在我刷新页面时更新。希望它实时更新。

【问题讨论】：

然后？究竟是什么问题？除非您想设置 websocket，否则 ajax 轮询（您在这里所做的）是解决问题的常用“简单”方法。
那么请更新您的帖子以解释 1/ 您的解决方案“不起作用”和 2/ 如何它不起作用（因为“不起作用”是对问题最无用的描述）。另外：您是否在浏览器的检查器/调试器中调试过这个？如果是的话，你看到了什么？
编辑了我的帖子，请帮忙

标签： javascript jquery python ajax flask

【解决方案1】：

你没有具体说明你的问题是什么（“不起作用”并没有真正的帮助），所以这充其量只能是一个猜测的答案。

第一点，你定义了一个匿名函数但从不调用它，所以它被执行的机会严格等于零。如果您希望在 dom 准备好时执行该函数（这是明智的做法，因为它引用了在函数之后定义的 dom 元素，您可以使用$(document).ready(yourfunc)，即：

$(document).ready(function(){
    $.getJSON(
        $SCRIPT_ROOT+"/get_data",
        function(data) {
           $("#testt").text(data.time);
        }
    setInterval(arguments.callee, 1000);
    );
});

另外，您当然不想从函数本身调用window.setInterval()（然后每次调用该函数时都会再次调用），所以它应该是这样的：

$(document).ready(function(){
    function _update_time() { 
        $.getJSON(
            $SCRIPT_ROOT+"/get_data",
            function(data) {
               $("#testt").text(data.time);
            });
    }
    // do a first call at load time
    _update_time();
    // then repeat it every second
    window.setInterval(_update_time, 1000);
    );
});

另外，我不是 Jinja2 专家（因为它是 Flask 并且从外观上看我认为是 Jinja2 模板），但是：

$SCRIPT_ROOT = {{ request.script_root|tojson|safe }};

对我来说似乎不正确。

首先，你希望$SCRIPT_ROOT 是一个字符串，所以你必须引用它：

$SCRIPT_ROOT = "{{ request.script_root|tojson|safe }}";

然后我在这里看不到 tojson 和 safe 过滤器的意义 - safe 告诉模板引擎不要对您的变量进行 html 转义，但 url 很少包含 html 标记，并 jsonifying 一个简单的字符串对我来说没有意义。

再一次，这充其量只是胡乱猜测，而且可能完全错误。如果您想要更好的答案，您将不得不做功课并发布更多信息，包括：

呈现的 html（以及相关部分）
浏览器检查器窗口/调试工具栏/无论在浏览器中调用的任何错误消息。

【讨论】：

谢谢你的回答我不明白这个函数是如何只被拒绝并且永远不会被调用的（因为时间变量正确地替换了我的呈现的模板是同一个 html 文件，其中javascript函数被定义并调用它只是一个时间必须出现的。我的意思是“不起作用”是数据是静态的，只有当我刷新我的时间才会改变页面。我的调试工具栏中没有出现错误:)
“渲染模板”表示模板被 jinja2 渲染后得到的内容。 IOW 你在浏览器中得到了什么。
已经尝试了我发现的所有可能的 ajax 解决方案，并且页面仅在我手动刷新时更新：/

【解决方案2】：

您可以使用 websocket 动态更新您的页面。有一个名为 Socket.Io 的项目，它由 Flask 实现以使用 websockets。

您可以在此处阅读文档：https://flask-socketio.readthedocs.io/en/latest/ 并观看一个快速示例以了解此处的概念：https://www.youtube.com/watch?v=RdSrkkrj3l4

【讨论】：