Flask 如何在socketio和socketio中连续显示html上的数据_Flask_Socket.io_Flask Socketio

Flask 如何在socketio和socketio中连续显示html上的数据

flask socket.io

Flask 如何在socketio和socketio中连续显示html上的数据,flask,socket.io,flask-socketio,Flask,Socket.io,Flask Socketio,我需要在html套接字io（3.1.0）上通过flask web套接字Flasku socketio（5.0.1）连续显示html上的数据 #########index.html######### var socket=io（）； socket.on（'connect'，function（）{ emit（'my event'，{data:'I'm connected！'}）； }); 您的代码正是您现在所需要的！您的问题在前端部分，请将其更改为以下内容： <html> <he

我需要在html套接字io（3.1.0）上通过flask web套接字Flasku socketio（5.0.1）连续显示html上的数据

#########index.html#########


var socket=io（）；
socket.on（'connect'，function（）{
emit（'my event'，{data:'I'm connected！'}）；
});

您的代码正是您现在所需要的！您的问题在前端部分，请将其更改为以下内容：

<html>
<head>
<title>Chat Room</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.1.0/socket.io.js" 
     integrity="sha512-   
  +l9L4lMTFNy3dEglQpprf7jQBhQsQ3/WvOnjaN/+/L4i0jOstgScV0q2TjfvRF4V+ZePMDuZYIQtg5T4MKr+MQ=="></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {

    var socket = io.connect('http://127.0.0.1:5000');

    socket.on('connect', function() {
        socket.send('User has connected!');
    });

    socket.on('message', function(msg) {
        $("#messages").append('<li>'+msg+'</li>');
        console.log('Received message');
    });

    $('#sendbutton').on('click', function() {
        socket.send($('#myMessage').val());
        $('#myMessage').val('');
    });

});
</script>
<ul id="messages"></ul>
<input type="text" id="myMessage">
<button id="sendbutton">Send</button>
</body>
</html>


聊天室
$（文档）.ready（函数（）{
var socket=io.connect（'http://127.0.0.1:5000');
socket.on（'connect'，function（）{
send（'User has connected！'）；
});
socket.on（'message'，函数（msg）{
$（“#消息”）.append（“”+msg+””）；
console.log（“收到的消息”）；
});
$（'#sendbutton'）。在（'click'，function（）上{
send（$（'#myMessage'）.val（））；
$（'#myMessage'）.val（''）；
});
});

发送

附言：如果你不想在前部挣扎，可以在chrome上使用Firecamp extension：

<html>
<head>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.1.0/socket.io.js" 
     integrity="sha512-   
  +l9L4lMTFNy3dEglQpprf7jQBhQsQ3/WvOnjaN/+/L4i0jOstgScV0q2TjfvRF4V+ZePMDuZYIQtg5T4MKr+MQ==" 
  crossorigin="anonymous"></script>

<script type="text/javascript" charset="utf-8">
   var socket = io();
   socket.on('connect', function() {
    socket.emit('my event', {data: 'I\'m connected!'});
 });
 </script>
 </body>
 </html>

<html>
<head>
<title>Chat Room</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.1.0/socket.io.js" 
     integrity="sha512-   
  +l9L4lMTFNy3dEglQpprf7jQBhQsQ3/WvOnjaN/+/L4i0jOstgScV0q2TjfvRF4V+ZePMDuZYIQtg5T4MKr+MQ=="></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {

    var socket = io.connect('http://127.0.0.1:5000');

    socket.on('connect', function() {
        socket.send('User has connected!');
    });

    socket.on('message', function(msg) {
        $("#messages").append('<li>'+msg+'</li>');
        console.log('Received message');
    });

    $('#sendbutton').on('click', function() {
        socket.send($('#myMessage').val());
        $('#myMessage').val('');
    });

});
</script>
<ul id="messages"></ul>
<input type="text" id="myMessage">
<button id="sendbutton">Send</button>
</body>
</html>