需要每 10 秒在 html 模板 td 标签中使用 flask 更新 render_template 传递的值

Question

I have this:

@views.route('/')
def home():
    while True:
        try:
            token=getToken()
            if(token!='null' or token!=''):
                plazas=getInfo(token,id)
        except:
            print('Conection failed')
            time.sleep(secs)

        return render_template("home.html", plazas=plazas)

Need update "plazas" variable value which is constantly refreshing with "while True" loop in my html template on td tag:

{% for parking in parkings %}
                <tr>
                    <td class="par"><img src={{parking.image}} alt="img"></td>
                    <td class="nombre">{{parking.nombre}}</td>
                    {% if plazas|int >= (totalplazas*30)/100 %}
                    <td class="num" style="color:#39FF00">
                    {{plazas}}</td>
                    {% elif plazas|int < 1%}
                    <td class="num" style="color:red"><p class="an">COMPLETO</p></td>
                    {% elif plazas|int <= (totalplazas*10)/100%}
                    <td class="num" style="color:red">
                    {{plazas}}</td>
                    {% else %}
                    <td class="num" style="color:yellow">
                    {{plazas}}</td>
                    {% endif %}
                    <td class="dir"><img src={{parking.direccion}} alt="img"></td>
                </tr>
            {% endfor %}

I have tried to use javascript, but when the 10 seconds pass it tells me that the result of {{plazas}} is undefined. Any help?

<script type="text/javascript">
window.onload = setInterval(refresh, 10000);
function refresh(places) {
    var elements = document.getElementsByClassName("num");
        for(let i = 0; i < elements.length; i++) {
            elements[i].innerHTML = places;
    }
    return elements[i].innerHTML = places;
}
</script>

Answer 1

To refresh it with new text, you can fetch to your own flask route and update the information using setInterval

HTML

<td id="num" style="color:#39FF00">{{plazas}}</td>
<script>
var element = document.findElementById("num")
async function reload() {
  const promise = await fetch('/myroute')
  const data = await promise.text()
  element.innerHTML = data
}
window.onload = setInterval(reload, 1000)
</script>

Flask

@app.route('/myroute')
def myroute():
  # time is just an example
  return time.time()