vue-socket.io-koa2

2019独角兽企业重金招聘Python工程师标准>>>

server

const Koa = require('koa');

const app = new Koa();

// ----
// app.use
// router.get|post
// 这些写在中间
// ----

const server = require('http').Server(app.callback());
const io = require('socket.io')(server);
io.on('connection', function (socket) {
    socket.emit('connect', 'ok');
    socket.on('connect',  (data) => {
    });
});

_.emit = (sid, action, data) => {
    if (!sid || !io.sockets.sockets[sid]) return;
    io.sockets.sockets[sid].emit(action, data);
}

server.listen(_.config.server.port, function () {
    _.debug('http://localhost:' + _.config.server.port, _.env);
});

====================
'/api/import': {
        post: async (ctx, next) => {
            const sid = ctx.query.sid || '';

            _.emit(sid, 'imprst', `---- 开始导入 ----`);

            _.emit(sid, 'imprst', `---- 导入完成 ----`);
        }
}

client

main.js

import VueSocketio from 'vue-socket.io';
Vue.use(VueSocketio, config.apiUrl);

===============

import.vue

export default {
    data() {
        return {
            uploadUrl: config.apiUrl + '/api/import?sid=' + this.$socket.id,
            rstList: []
        }
    },
    sockets:{
        connect: function(){
        },
        imprst: function(val){
            this.rstList.push(val);
        }
    },
    mounted(){
        this.$socket.emit('connect', this.$router.id);
    },
}

 

转载于:https://my.oschina.net/qiongtaoli/blog/1913928