2017-10-15 98 views
-1

在我的烧瓶应用中使用socketio,我想显示发件人和消息的名称,但这里只显示消息,发件人的名字只在浏览器中显示“[object object] hello” 。Python烧瓶广播消息

**# server.py 

    from flask import Flask, render_template 
    from flask_socketio import SocketIO, emit 

    app = Flask(__name__) 

    app.config[ 'SECRET_KEY' ] = 'jsbcfsbfjefebw237u3gdbdc' 
    socketio = SocketIO(app) 

    @app.route('/') 
    def hello(): 
     return render_template('./index.html') 

    def messageRecived(): 
     print('message was received!!!') 

    @socketio.on('my event') 
    def handle_my_custom_event(json): 
     print('recived my event: ' + str(json)) 
     socketio.emit('my response', json, callback=messageRecived) 

    if __name__ == '__main__': 
     socketio.run(app, debug = True) 

的index.html

**

<form action="" method="POST"> 
    <b>Type your message below <span class="glyphicon glyphicon-arrow-down"></span></b> 
    <div class="clearfix" style="margin-top: 5px;"></div> 
    <div id="username">My Name</div> 
    <div style="padding-top: 5px;"></div> 
    <input type="text" class="message form-control" placeholder="Messages"> 
    <div style="padding-top: 5px;"></div> 
    <button type="submit" class="btn btn-success btn-block"><span class="glyphicon glyphicon-send"></span> Send</button> 
</form> 
</div> 
</div> 

**

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.min.js"></script> 
<script> 
    var socket = io.connect('http://' + document.domain + ':' + location.port) 
    // broadcast a message 
    socket.on('connect', function() { 
     socket.emit('my event', { 
     data: 'User Connected' 
    }) 
    var form = $('form').on('submit', function(e) { 
     e.preventDefault() 
     let username = $('#username').val() 
     let user_input = $('input.message').val() 
     socket.emit('my event', { 
      username : $("#username"), 
      message : user_input 
     }) 
     // empty the input field 
      $('input.message').val('').focus() 
     }) 
    }) 
    socket.on('my response', function(msg) { 
    console.log(msg) 
    if(typeof msg.username !== 'undefined') { 
     $('h1').remove() 
     $('div.message_holder').append('<div class="msg_bbl"><b style="color: #000">'+msg.username+'</b> '+msg.message+'</div>') 
     } 
    }) 
</script>** 
+0

请停止恢复编辑,您的原始格式非常糟糕。将代码块*格式化为代码块*,而不是引号。 – jonrsharpe

回答

0

您要发送DOM元素添加到服务器,而不是它的内容。添加.text()以获取实际用户名:

socket.emit('my event', { 
     username : $("#username").text(), 
     message : user_input 
    })