Question

我想在每次将文件上传到文件夹时刷新我的网页。

我有一个用烧瓶编写的Web服务，其中包含以下处理程序

@app.route('/getlatest/')
def getlatest():
    import os
    import glob
    newset = max(glob.iglob('static/*'),key=os.path.getctime)
    Return newest;

这为我提供了文件夹中最新文件的名称。

我在我的JS（客户端）中有一个Ajax调用来不断从上面的函数中获取数据。

function GetLatest()
            {
                $.ajax({
                    url: "http://localhost:5000/getlatest", 
                    success: function(result)
                    {
                        if(previousName != result){
                            previousName = result;
                            $("#image").attr("src","/"+previousName);
                        }
                    }
                });
            }

每秒调用服务器。

(function myLoop (i) {          
    setTimeout(function () {   
    GetLatest();                         
    if (--i) myLoop(i);
       }, 1000)
})(100);

这个工作正常[几乎]。 我的问题是：有没有更好的方法[必须有]？

我愿意接受各种技术选择[node，angualr等]

Answer 1

是的，你可以使用websockets（flask-socketio）。这将让你在你和服务器之间建立一个开放的连接，每次在文件夹中都会有一张新照片显示在选定的div上

http://flask-socketio.readthedocs.io/en/latest/
https://pypi.python.org/pypi/Flask-SocketIO/2.9.1

Answer 2

所以我就是这样做的。

首先要感谢 https://blog.miguelgrinberg.com/post/easy-websockets-with-flask-and-gevent 完美地解释它。

我在阅读几篇博客时学到了什么。

使用http协议启动的所有通信都是客户端服务器通信，客户端始终是启动器。因此，在这种情况下，我们必须使用不同的协议：Web套接字，允许您创建全双工（双向）连接。

这是服务器代码;

socketio = SocketIO(app, async_mode=async_mode)
thread = None
prevFileName = ""

def background_thread():
    prevFileName = ""
    while True:
        socketio.sleep(0.5)
        if(isNewImageFileAdded(prevFileName) == "true"):
            prevFileName = getLatestFileName()
            socketio.emit('my_response',
              {'data': prevFileName, 'count': 0},
              namespace='/test');

def getLatestFileName():
    return max(glob.iglob('static/*'),key=os.path.getctime)

def isNewImageFileAdded(prevFileName):
    latestFileName = max(glob.iglob('static/*'),key=os.path.getctime)
    if(prevFileName == latestFileName):
        return "false"
    else:
        return "true"

创建单独的线程以保持套接字打开。 emit 将msg从服务器发送到客户端...

@socketio.on('connect', namespace='/test')
def test_connect():
    global thread
    if thread is None:
        thread = socketio.start_background_task(target=background_thread)
    emit('my_response', {'data': 'Connected', 'count': 0})

这是客户端。[用以下代码替换了ajax调用]

var socket = io.connect(location.protocol + '//' + document.domain + ':' + 
location.port + namespace);

socket.on('my_response', function(msg) {    
            setTimeout(function(){ $("#image").attr("src","/"+msg.data)},1000)
                });

如果我错了，请纠正我。

刷新文件夹中的网页

2 个答案: