如何使用Flask和AJAX连续更新图像

Question

我想实现仪表板风格的本地网页。应该有一些动态更新的图像（无需刷新网页）。例如，应该有一个车门关闭，一个车门打开的图像。当事件在服务器的其他地方被触发时，我希望图像更新。

我打算通过轮询方法执行此操作，其中页面每秒使用AJAX刷新图像，Flask引擎确定应显示哪个图像。 有更好的方法吗？

我当前的代码在我的HTML页面中有这个。它只是图像的div容器和从Flask调用加载图像的脚本。

<div id="car_img" style="width:400px;height:400px;background:yellow"></div>

<script>
  setInterval(function(){
    $('#car_img').load($SCRIPT_ROOT + '/_curr_car_image');
  }, 2000) /* time in milliseconds (ie 2 seconds)*
</script>

在我的Flask python脚本中，我接到了调用，atm只返回一个带有image目录的字符串。

@app.route('/_curr_car_image')
def curr_car_image():
    # some logic here where the proper image would be selected
    return '/car_pics/car1.jpg'

如果我访问http://127.0.0.1:5000/_curr_car_image，我会看到正确的字符串，但是我可能需要将其引导到HTML图像的src属性中吗？或许我应该返回HTML代码？我真的不知道该怎么做。

那么，我在这里做错了什么？这只是一个5米的演示，没有必要做一些花哨或快速的事情，只是有用的东西，我们可以用于演示。