Question

How to make html view/template that updates with new data from changed file

我正在开发聊天信使服务并将消息存储在SQL数据库中，我已经做出了类似上述问题的类似文件检查功能。每当检测到数据库有新变化时，是否有将此函数的输出添加到html中的方法？

Answer 1

您尚未详细说明用于执行此操作的内容，但是我将作答并假设您正在使用SocketIO。

无论何时每次检测到数据库的新更改时，是否都需要将此函数的输出添加到html中？

这可能是错误思考此问题的方式。您链接的问题涉及尾随文件，然后采取适当措施。您不需要检测数据库更改，因为您的事件函数应该处理所有消息。

我创建了一个非常基本的聊天应用程序的gist，其中包含您所需的功能。（基于自述文件中链接的教程）。

您应该具有处理来自用户的传入消息，然后将其发送到套接字上的功能，以便系统上的其他用户可以看到该消息。您要在此处更新数据库：

@socketio.on('my event')
def handle_my_custom_event(json, methods=['GET', 'POST']):
    """ handle an incoming chat message, add to db, then emit to room """

    # Unique ID for the session
    json['sid'] = request.sid

    print('received my event: ' + str(json)) # Just prints to server terminal

    # Build the database entry and commit
    new_db_entry = ChatHistory(sid = json['sid'],
                               message = json['message'],
                               username= json['user_name'])
    db_session.add(new_db_entry)
    db_session.commit()

    # Escape nasty html.  Do this for each var the user enters
    json['user_name'] = su.escape(json['user_name'])
    json['message'] = su.escape(json['message'])

    socketio.emit('my response', json, callback=messageReceived)

然后，您具有一些相应的Javascript，可在前端接收此事件并更新HTML：

socket.on( 'my response', function( msg ) {
        if( typeof msg.user_name !== 'undefined' ) {
          $( 'div.message_holder' ).append( '<div><b style="color: #000">'+msg.user_name+'</b> '+msg.message+'</div>' )
        }
      })

但是，当用户首次连接时，如何在用户的浏览器中呈现历史记录？您可以编写一些Javascript来执行此操作，但是我的示例仅在用户首次呈现session.html模板（前端）时查询数据库：

@app.route('/')
def sessions():
    history = ChatHistory.query.all()
    return render_template('session.html', history=history)

然后在相应的模板中，在加载时构建页面：

   <div class="message_holder">
      {% for chatItem in history %}
          <div><b style="color: #000">{{ chatItem.username }}</b> {{ chatItem.message }}</div>
      {% endfor %}
    </div>

这只是可以完成的操作的一个示例。

HTML模板，可使用更改后的文件中的新数据动态更新

1 个答案: