由于工作当中需要用的flask_socketio,所以自己学习了一下如何使用,查阅了有关文档,当看到回调函数callback的时候,发现文档里都描述的不太清楚,最后终于琢磨出来了,分享给有需要的朋友
首先看看官方文档及其译文
看到这里以后,我就开始照着文档敲代码,发现即使我按照文档里的写法写了,也没有调用我们的回调函数ack
废话不多说,直接上最终版代码
index.html
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>index1</title> <script type="text/javascript" src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script type="text/javascript" src="//cdn.bootcss.com/socket.io/1.5.1/socket.io.min.js"></script> <script type="text/javascript" charset="utf-8"> $(document).ready(function () { var socket = io.connect(':8000/'); socket.on('connect', function () { socket.emit('connect_event', {data: 'client,connected!'}); //客户端向服务端发起请求链接 }); socket.on('server_response', function (msg, ack) { $('#log').append('<br>' + $('<div/>').text('Received #' + ': ' + msg.data).html()); //将服务端发过来的信息,显示在页面上 ack('client received'); //响应服务端的回调函数,告知服务端,客户端已收到消息 }); socket.on('server_response1', function (msg) { $('#log').append('<br>' + $('<div/>').text('Received #' + ': ' + msg.data).html()); //将服务端发过来的信息,显示在页面上 // ack('msg'); //响应服务端的回调函数,告知服务端,客户端已收到消息 }); $('#aa').click(function (event) { socket.emit('client_event', {data: $('#emit_data').val()}, function (data) { console.log("server received data", data); // 此处data为服务端发送过来的回调参数,说明服务端已收到客户端的消息; }); }); }); </script> </head> <body> <h2>WebSokect</h2> <form id="emit" method="POST" action='#'> <input type="text" name="emit_data" id="emit_data" placeholder="Message"> <input type="button" value="Echo" id="aa"> </form> <div id='log'></div> </body> </html>