js/pages/common/wx.js
/************************ websocket begin ********************************/
function connectSocket(obj) {
var _socketTask = new SocketTask(obj);
return _socketTask;
// var bmWebSocket = weex.requireModule('bmWebSocket');
}
function onSocketOpen(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onopen(function (e) {
return callback();
});
}
function onSocketMessage(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onmessage(function (e) {
return callback({data: e.data});
});
}
function onSocketError(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onerror(function (e) {
return callback({errMsg: e.data});
});
}
function onSocketClose(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onclose(function (e) {
return callback({code: e.code,reason:""});
});
}
function sendSocketMessage(obj) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.send(obj.data);
}
function closeSocket(obj) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.close(obj.code, obj.reason);
}
/************************ websocket end ********************************/
connectSocket,
onSocketOpen,
onSocketMessage,
onSocketError,
onSocketClose,
sendSocketMessage,
closeSocket,
js/pages/common/SocketTask.js
module.exports = class SocketTask {
constructor(obj) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.webSocket(obj.url);
}
onOpen(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onopen(function (e) {
return callback();
});
}
onMessage(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onmessage(function (e) {
return callback({data: e.data});
});
}
onError(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onerror(function (e) {
return callback({errMsg: e.data});
});
}
onClose(callback) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.onclose(function (e) {
return callback({code: e.code, reason: ""});
});
}
close(obj) {
var bmWebSocket = weex.requireModule('bmWebSocket');
bmWebSocket.close(obj.code, obj.reason);
}
}
demo
<template>
<scroller ref="list" :style="page_style">
<refresh class="refresh" @refresh="onrefresh" :display="refreshing ?'show':'hide'">
<text class="indicator-text">正在刷新 ...</text>
<loading-indicator class="indicator"></loading-indicator>
</refresh>
<text @click="click" style="padding:20px;font-size:50px;">跳转第二页</text>
<text style="font-size:50px">{{msg}}</text>
<text v-for="(num, index) in arr" class="text">这是第 {{num}} 条数据</text>
</scroller>
</template>
<style scoped>
.text {
font-size: 50px;
}
.refresh {
width: 750px;
position: absolute;
height: 120px;
top: 0;
align-items: center;
}
.indicator-text {
color: #888888;
font-size: 42px;
text-align: center;
}
.indicator {
margin-top: 16px;
height: 40px;
width: 40px;
color: blue;
}
</style>
<script>
import wx from './../../common/wx'
import console from './../../common/console'
export default {
data() {
return {
arr: [],
refreshing: false,
msg:""
}
},
mixins: [require('./../../common/publish').publish],
created() {
//this.getData();
},
computed: {
page_style: function () {
var statusBarHeight = weex.config.eros.statusBarHeight ? weex.config.eros.statusBarHeight : 40;
return {paddingTop: statusBarHeight};
}
},
methods: {
click() {
var that = this;
wx.connectSocket({
url: 'ws://192.168.1.161:8090'
})
wx.onSocketOpen(function(res) {
//wx.alert("onSocketOpen");
wx.sendSocketMessage({data:'hello'})
});
wx.onSocketClose(function(res) {
that.msg ="websocket close,code:" + res.code + ",reason:" +res.reason;
});
wx.onSocketError(function(res) {
that.msg = "errMsg:" + res.errMsg;
});
wx.onSocketMessage(function(res) {
that.msg = "msg:" + res.data;
});
},
getData() {
this.arr = [];
var random = Math.random();
for (let i = 0; i < 30; i++) {
this.arr.push(random + i + 1)
}
},
onrefresh() {
this.refreshing = true;
setTimeout(() => {
this.getData();
this.refreshing = false;
}, 1000)
}
}
}
</script>
server demo
// websocket.js
const WebSocket = require('ws');
var colors = require('colors');
var config = require(__dirname +"/config.js");
var file = config.eros_dev_js;
colors.setTheme({
log: 'bgGreen',
help: 'cyan',
warn: 'yellow',
success: 'bgBlue',
error: 'red'
});
const wss = new WebSocket.Server({port: 8090});
wss.on('connection', function connection(ws) {
console.log('开启连接')
ws.on('message', function incoming(result) {
console.log(result);
ws.send(result + " back");
});
ws.on('close', function incoming(result) {
console.log('关闭连接')
});
});