美文网首页
初尝WebSocket

初尝WebSocket

作者: c4a1d989518e | 来源:发表于2018-05-03 21:55 被阅读138次

为什么要用WebSocket,因为我要让服务器主动发消息给客户端。最容易想象一个应用场景就是实时日志的查看。

我的项目前端用的是Vue,后端用的是Python。后端的框架是Flask,所以我选择的是flask_socketio这个包,要说的一点是,Websocket是一个通信协议,flask_socketio这是要利用Websocket协议的包。就像是requests这个包是根据的http协议。

直接看我服务端python用的代码:

#!/usr/bin/env python
from flask import Flask, render_template, session, request,jsonify
from flask_socketio import SocketIO, emit
import time
import requests

app = Flask(__name__, template_folder='./')
app.config['SECRET_KEY'] = 'secret!'

socketio = SocketIO(app)


@app.route('/hh',methods=['POST'])
def test_msg():
    a=str(request.data,encoding="utf-8")
    socketio.emit('tv_response', {'data': a})
    return "hello"



if __name__ == '__main__':
    socketio.run(app, host='0.0.0.0',port='5001')

前端的代码是

<script>
    import VueSocketio from 'vue-socket.io';
    import io from 'socket.io-client';
    import Vue from 'vue'

    // Vue.use(VueSocketio, socketio('http://0.0.0.0:5001'))

    var MyLogs = [];
    
    

    export default{
        data() {
            return {
                AllLogs:[{'sdf':'dfjd'}],
                MyLogs:MyLogs,

            }
        
        },
       
    };
    var socket = io.connect('http://localhost:5001/');
    socket.on('connect',function(){
        console.log("socket已连接")
        //连接成功
    });
    socket.on('tv_response',function(msg){
        //这里实现了数据绑定,数据实时更新的效果,将MyLogs声明在了外卖
        
        MyLogs.push(msg.data)
        console.log(MyLogs)
        
    });
</script>

我在使用后端的socketio的时候,实际上是把它当做了一个端口为5001的服务器,我另一个端口5000的服务在进行一个轮询的产生日志的操作,每一次循环,就通过post请求发送到5001端口,然后通过Websocket发送到前端。

相关文章

  • 初尝WebSocket

    为什么要用WebSocket,因为我要让服务器主动发消息给客户端。最容易想象一个应用场景就是实时日志的查看。 我的...

  • 初尝

    高枕虽不虞,惊起皆空虚; 耳添丝竹乐,确乱三千丝。

  • 初尝

    继上次中午和二哥聊了很久之后,心里一直想的就是『不忘初心』,便重新尝试找回留学时的冲劲,更多的去接受新的东西。成也...

  • 初尝

    社会真的有那么残酷吗? 谈恋爱就是看脸和身材,前几天学姐说:“又有谁看你的舞姿不过就是看脸和身材”学姐很漂亮,说得...

  • 初尝

    每每看到别人记录的点点滴滴都有动笔写下自己的生活的念头,本身自己就是一个爱忘记生活过往的人,一年前的事情被家人朋友...

  • 毕业这年

    初尝爱情,初尝不易,初感兼迎

  • WebSocket初认识

    首先我们来看个典型的Websocket握手(借用Wikipedia的。。) 熟悉HTTP的童鞋可能发现了,这段类似...

  • 初尝摄影

  • 初尝生活

    来学校已经三天了,除了今天上午开了一次班会再无其他任何活动!虽说刚来,对一切都很新奇,但九月的天气除了早晚仍然很热...

  • 初尝催眠

    焦点长期班第二期陈曼丽 持续分享第88天 20180724 周二 晴 上周,提前约了苹暇姐做了一次基础催眠,...

网友评论

      本文标题:初尝WebSocket

      本文链接:https://www.haomeiwen.com/subject/gealrftx.html