分类：消息中间件

关于CTS项目的微信小程序WebSocket开发

1、微信小程序前端

// 引入配置文件config
const urlList = require('../../utils/config.js');

var app = getApp();

Page({

  /**
   * 页面的初始数据
   */
  data: {
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    // 建立连接
    wx.connectSocket({
      url: 'ws://localhost:8081'
    })

    // 打开连接
    wx.onSocketOpen(function (res) {
      console.log('WebSocket连接已打开！')

      wx.sendSocketMessage({
        data: 'hi, jzh',
      })
    })
    
    // 接收数据
    wx.onSocketMessage(function (res) {
      console.log(res)
    })

    // 关闭连接
    wx.onSocketClose(function (res) {
      console.log('WebSocket连接已关闭！')
    })

    // 连接失败
    wx.onSocketError(function () {
      console.log('WebSocket连接失败！');
    })

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  },

  /**
   * 表单递交
   */
  formSubmit: function(e) {
    wx.sendSocketMessage({
      data: 'test'
    });
  }
})

2、后端可选 阅读全文

关于Java Tomcat和Html5实现WebSocket

1、Java8+Tomcat8。

package com.ssm.cts.websocket;

import javax.websocket.CloseReason;
import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.RemoteEndpoint;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;

import org.apache.log4j.Logger;

import java.nio.*;
import java.util.*;

/**
 * CopyRright (c)2018-2028: chanpinxue.cn 
 * Project: cts 
 * Module Name: CtsWebSocket
 * Comments: WebSocket服务端
 * JDK version used: JDK1.8 
 * Author: jzh 
 * Create Date: 2018-11-04
 * Modified By: jzh 
 * Modified Date: 2018-11-04
 * Why & What is modified:
 * Version: <1.0>
 */
// 注解@ServerEndpoint表示它是一个WebSocket服务端
@ServerEndpoint(value="/ctsWebSocket")
public class CtsWebSocket {
  protected final Logger logger = Logger.getLogger(CtsWebSocket.class);
  static List<Session> clientList = Collections.synchronizedList(new ArrayList<Session>());

  // 注解@OnOpen表示它在客户端连接时发生
  @OnOpen
  public void start(Session session) {
    // 每当有客户端连接进来时，收集该客户对应的session
    clientList.add(session);
    logger.info("客户端连接：" + session.getBasicRemote());
  }

  // 注解@OnMessage表示它在客户端消息到达时发生
  @OnMessage
  public void message(String message, Session session) throws Exception {
    // 收到消息后，将消息向所有客户发送一次
    logger.info("客户端消息：" + message);
    for (Session s : clientList) {
      RemoteEndpoint.Basic remote = s.getBasicRemote();
      remote.sendText(message);
    }
  }

  // 注解@OnClose表示它在客户端连接关闭时发生
  @OnClose
  public void end(Session session, CloseReason closeReason) {
    // 每当有客户连接关闭时，删除该客户对应的session
    clientList.remove(session);
  }

  // 注解@OnError表示它在客户端出错时发生
  @OnError
  public void error(Session session, Throwable throwable) {
    // 每当有客户连接出错时，删除该客户对应的session
    clientList.remove(session);
  }
}

2、websocket.html 阅读全文