You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
109 lines
2.5 KiB
109 lines
2.5 KiB
const app = getApp();
|
|
const config = app.config;
|
|
const wafer = require('../../vendors/wafer-client-sdk/index');
|
|
const lab = require('../../lib/lab');
|
|
|
|
Page({
|
|
data: {
|
|
status: 'waiting',
|
|
url: 'wss://' + config.host + '/ws',
|
|
connecting: false,
|
|
hintLine1: '完成服务器开发，',
|
|
hintLine2: '让服务器支持 WebSocket 连接'
|
|
},
|
|
|
|
/**
|
|
* WebSocket 是否已经连接
|
|
*/
|
|
socketOpen: false,
|
|
|
|
/**
|
|
* 开始连接 WebSocket
|
|
*/
|
|
connect() {
|
|
this.setData({
|
|
status: 'waiting',
|
|
connecting: true,
|
|
hintLine1: '正在连接',
|
|
hintLine2: '...'
|
|
});
|
|
this.listen();
|
|
wafer.setLoginUrl(`https://${config.host}/login`);
|
|
wafer.login({
|
|
success: () => {
|
|
const header = wafer.buildSessionHeader();
|
|
const query = Object.keys(header).map(key => `${key}=${encodeURIComponent(header[key])}`).join('&');
|
|
wx.connectSocket({
|
|
// 小程序 wx.connectSocket() API header 参数无效，把会话信息附加在 URL 上
|
|
url: `${this.data.url}?${query}`,
|
|
header
|
|
});
|
|
},
|
|
fail: (err) => {
|
|
this.setData({
|
|
status: 'warn',
|
|
connecting: false,
|
|
hintLine1: '登录失败',
|
|
hintLine2: err.message || err
|
|
});
|
|
}
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 监听 WebSocket 事件
|
|
*/
|
|
listen() {
|
|
wx.onSocketOpen(() => {
|
|
this.socketOpen = true;
|
|
this.setData({
|
|
status: 'success',
|
|
connecting: false,
|
|
hintLine1: '连接成功',
|
|
hintLine2: '现在可以通过 WebSocket 发送接收消息了'
|
|
});
|
|
console.info('WebSocket 已连接');
|
|
});
|
|
wx.onSocketMessage((message) => {
|
|
this.setData({
|
|
hintLine2: message.data
|
|
});
|
|
lab.finish('websocket');
|
|
});
|
|
wx.onSocketClose(() => {
|
|
this.setData({
|
|
status: 'waiting',
|
|
hintLine1: 'WebSocket 已关闭'
|
|
});
|
|
console.info('WebSocket 已关闭');
|
|
});
|
|
wx.onSocketError(() => {
|
|
setTimeout(() => {
|
|
this.setData({
|
|
status: 'warn',
|
|
connecting: false,
|
|
hintLine1: '发生错误',
|
|
hintLine2: 'WebSocket 连接建立失败'
|
|
});
|
|
});
|
|
console.error('WebSocket 错误');
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 发送一个包含当前时间信息的消息
|
|
*/
|
|
send() {
|
|
wx.sendSocketMessage({
|
|
data: new Date().toTimeString().split(' ').shift() + '.' + (new Date().getMilliseconds())
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 关闭 WebSocket 连接
|
|
*/
|
|
close() {
|
|
this.socketOpen = false;
|
|
wx.closeSocket();
|
|
}
|
|
}); |