vue-cli app и socket.io
Пытаюсь перенести пример-приложение (https://github.com/websockets/ws/tree/master/examples/serverstats) на vue-cli и socket.io
<template>
<div id="app">
<span v-if="isConnected">Connected!!!</span><br/>
<strong>Server Stats</strong><br>
RSS: <span id='rss' :v-model="rss">{{rss}}</span><br/>
Heap total: <span id='heapTotal' :v-model="heapTotal">{{heapTotal}}</span><br>
Heap used: <span id='heapUsed' :v-model="heapUsed">{{heapUsed}}</span><br>
</div>
</template>
<script>
export default {
name: 'app',
data() {
return {
heapUsed: '',
heapTotal:'',
rss:'',
isConnected: false,
}
},
sockets: {
connect() {
this.isConnected = true;
},
dissconnect() {
this.isConnected = false;
}
}
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
margin-top: 60px;
}
</style>
main.js
import Vue from 'vue'
import App from './App.vue'
import VueSocketIO from 'vue-socket.io'
Vue.config.productionTip = false;
Vue.use(new VueSocketIO({
debug: false,
connection: 'http://localhost:3000'
}));
new Vue({
render: h => h(App),
}).$mount('#app');
server.js
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.use((req, res, next) => {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
res.setHeader('Access-Control-Allow-Credentials', true);
next();
});
app.get('/', (req, res) => {
let time = setInterval(() => {
res.send(JSON.stringify(process.memoryUsage()));
},100);
});
io.on('connection', socket => {
socket.on('disconnect', () => {
});
});
http.listen(3000, () => {
console.log('Listening on *:3000');
});
Что же не так?
