微信小程序 websocket 实现SpringMVC+Spring+Mybatis


Posted in Javascript onAugust 04, 2017

微信小程序实现websocket步骤:

后台:

1. 添加maven依赖
 2. 创建握手
 3. 创建处理器
 4. spring配置(xml配置或javabean方式配置任选一种)

微信小程序:

1. 书写连接

java后台

1.添加maven依赖

<!-- websocket -->
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-websocket</artifactId>
    <version>${spring.version}</version>
  </dependency>
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-messaging</artifactId>
    <version>${spring.version}</version>
  </dependency>

  <!-- 其中spring版本 -->
  <!-- 注意spring版本一定要为4以上版本 -->
  <spring.version>4.3.7.RELEASE</spring.version>

2.创建握手

package com.ahutshop.websocket;

import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.http.server.ServletServerHttpRequest;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.server.HandshakeInterceptor;

/**
 * 此类用来获取登录用户信息并交由websocket管理
 */
public class MyWebSocketInterceptor implements HandshakeInterceptor {

  @Override
  public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse arg1, WebSocketHandler arg2,
      Map<String, Object> arg3) throws Exception {
    // 将ServerHttpRequest转换成request请求相关的类,用来获取request域中的用户信息
    if (request instanceof ServletServerHttpRequest) {
      ServletServerHttpRequest servletRequest = (ServletServerHttpRequest) request;
      HttpServletRequest httpRequest = servletRequest.getServletRequest();

    }

    System.out.println("连接到我了");

    return true;
  }

  @Override
  public void afterHandshake(ServerHttpRequest arg0, ServerHttpResponse arg1, WebSocketHandler arg2, Exception arg3) {
    // TODO Auto-generated method stub

  }

}

3.创建处理器

package com.ahutshop.websocket;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.WebSocketMessage;
import org.springframework.web.socket.WebSocketSession;

public class WebSocketPushHandler implements WebSocketHandler {
  private static final List<WebSocketSession> users = new ArrayList<>();

  // 用户进入系统监听
  @Override
  public void afterConnectionEstablished(WebSocketSession session) throws Exception {
    System.out.println("成功进入了系统。。。");
    users.add(session);

    sendMessagesToUsers(new TextMessage("今天晚上服务器维护,请注意"));
  }

  //
  @Override
  public void handleMessage(WebSocketSession session, WebSocketMessage<?> message) throws Exception {
    // 将消息进行转化,因为是消息是json数据,可能里面包含了发送给某个人的信息,所以需要用json相关的工具类处理之后再封装成TextMessage,
    // 我这儿并没有做处理,消息的封装格式一般有{from:xxxx,to:xxxxx,msg:xxxxx},来自哪里,发送给谁,什么消息等等
    // TextMessage msg = (TextMessage)message.getPayload();
    // 给所有用户群发消息
    //sendMessagesToUsers(msg);
    // 给指定用户群发消息
    //sendMessageToUser(userId, msg);

  }

  // 后台错误信息处理方法
  @Override
  public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {

  }

  // 用户退出后的处理,不如退出之后,要将用户信息从websocket的session中remove掉,这样用户就处于离线状态了,也不会占用系统资源
  @Override
  public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus) throws Exception {
    if (session.isOpen()) {
      session.close();
    }
    users.remove(session);
    System.out.println("安全退出了系统");

  }

  @Override
  public boolean supportsPartialMessages() {
    return false;
  }

  /**
   * 给所有的用户发送消息
   */
  public void sendMessagesToUsers(TextMessage message) {
    for (WebSocketSession user : users) {
      try {
        // isOpen()在线就发送
        if (user.isOpen()) {
          user.sendMessage(message);
        }
      } catch (IOException e) {
        e.printStackTrace();
      }
    }
  }

  /**
   * 发送消息给指定的用户
   */
  public void sendMessageToUser(String userId, TextMessage message) {
    for (WebSocketSession user : users) {
      if (user.getAttributes().get("").equals(userId)) {
        try {
          // isOpen()在线就发送
          if (user.isOpen()) {
            user.sendMessage(message);
          }
        } catch (IOException e) {
          e.printStackTrace();
        }
      }
    }
  }
}

4.spring配置

javabean方式配置(推荐)

package com.ahutshop.websocket;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

@Configuration
@EnableWebSocket
public class WebSocketConfig extends WebMvcConfigurerAdapter implements WebSocketConfigurer {
  @Override
  public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {

    registry.addHandler(WebSocketPushHandler(), "/webSocketServer.action").addInterceptors(new MyWebSocketInterceptor()).setAllowedOrigins("*");
    registry.addHandler(WebSocketPushHandler(), "/sockjs/webSocketServer.action")
        .addInterceptors(new MyWebSocketInterceptor()).withSockJS();
  }

  @Bean
  public WebSocketHandler WebSocketPushHandler() {
    return new WebSocketPushHandler();
  }

}

spring.xml中配置扫描包
<!-- 扫描包 -->
<context:component-scan base-package="com.ahutshop.websocket" />

注意:

1. /webSocketServer.action之所以要加上.action的后缀,是因为web.xmlk中配置了拦截的后缀名为.action

<!-- springmvc模块 -->
<servlet>
  <servlet-name>DispatcherServlet</servlet-name>
  <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
  <init-param>
    <param-name>contextConfigLocation</param-name>
    <param-value>classpath:springmvc.xml</param-value>
  </init-param>
  <load-on-startup>1</load-on-startup>
  <!-- 支持异步 -->
  <async-supported>true</async-supported>
</servlet>
<servlet-mapping>
  <servlet-name>DispatcherServlet</servlet-name>
  <url-pattern>*.action</url-pattern> 
</servlet-mapping>

2 .setAllowedOrigins(“*”)中的*代表合法的请求域名,该方法接受一个可变数组作为参数,一定要配置,不然会请求时会出现403

xml方式配置(省略)

微信小程序

1.websocket.wxml

<!--pages/websocket/websocket.wxml-->
<view class="page">
 <view class="page__hd">
 </view>
 <view class="page__bd">

 <button bindtap="connectWebsocket" type="primary">连接websocket</button>

 </view>
</view>

2.websocket.js

// pages/websocket/websocket.js
Page({

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

 },
 connectWebsocket: function () {
  wx.connectSocket({
   url: 'ws://localhost:8080/AhutShop/webSocketServer.action',
   data: {
   },
   header: {
    'content-type': 'application/json'
   },
   method: "GET"
  })
  wx.onSocketOpen(function (res) {
   console.log('WebSocket连接已打开!')
  })
  wx.onSocketError(function (res) {
   console.log('WebSocket连接打开失败,请检查!')
  })
  wx.onSocketMessage(function (res) {
   console.log('收到服务器内容:' + res.data)
  })
 }
})

运行效果

微信小程序 websocket 实现SpringMVC+Spring+Mybatis

以上就是微信小程序 后台的建立,如有疑问请留言或者到本站社区交流讨论,本站关于微信小程序的文章还有很多,希望大家多多搜索查阅,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
accesskey 提交
Jun 26 Javascript
jquery插件jbox使用iframe关闭问题
Feb 09 Javascript
jquery获取子节点和父节点的示例代码
Sep 10 Javascript
javascript框架设计读书笔记之字符串的扩展和修复
Dec 02 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
Sep 21 Javascript
jquery实现垂直和水平菜单导航栏
Aug 27 Javascript
jquery插件uploadify多图上传功能实现代码
Aug 12 Javascript
Node.js中使用jQuery的做法
Aug 17 Javascript
基于Vue实现的多条件筛选功能的详解(类似京东和淘宝功能)
May 07 Javascript
详解js常用分割取字符串的方法
May 15 Javascript
JavaScript通如何过RGraph实现动态仪表盘
Oct 15 Javascript
通过vue.extend实现消息提示弹框的方法记录
Jan 07 Vue.js
Angular实现响应式表单
Aug 04 #Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 #Javascript
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 #jQuery
JavaScript正则表达式校验与递归函数实际应用实例解析
Aug 04 #Javascript
js模拟百度模糊搜索的实例
Aug 04 #Javascript
JavaScript模拟文件拖选框样式v1.0的实例
Aug 04 #Javascript
addeventlistener监听scroll跟touch(实例讲解)
Aug 04 #Javascript
You might like
克隆一个新项目的快捷方式
2013/04/10 PHP
改写ThinkPHP的U方法使其路由下分页正常
2014/07/02 PHP
PHP中cookie和session的区别实例分析
2014/08/28 PHP
PHP统计目录大小的自定义函数分享
2014/11/18 PHP
zend framework重定向方法小结
2016/05/28 PHP
newxtree.js代码
2007/03/13 Javascript
一个选择最快的服务器转向代码
2009/04/27 Javascript
Jquery乱码的一次解决过程 图解教程
2010/02/20 Javascript
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
2013/06/17 Javascript
jQuery的控件及事件(输入控件及回车事件)使用示例
2013/07/25 Javascript
jquery 实现密码框的显示与隐藏示例代码
2013/09/18 Javascript
使用mouse事件实现简单的鼠标经过特效
2015/01/30 Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
2016/01/09 Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
2016/03/30 Javascript
全面解析Javascript无限添加QQ好友原理
2016/06/15 Javascript
轻松掌握JavaScript中介者模式
2016/08/26 Javascript
vue与TypeScript集成配置最简教程(推荐)
2017/10/17 Javascript
webpack 3.X学习之多页面打包的方法
2018/09/04 Javascript
微信小程序中如何使用flyio封装网络请求
2019/07/03 Javascript
React学习之JSX与react事件实例分析
2020/01/06 Javascript
用Python编写脚本使IE实现代理上网的教程
2015/04/23 Python
Python2和Python3中print的用法示例总结
2017/10/25 Python
numpy的文件存储.npy .npz 文件详解
2018/07/09 Python
python itsdangerous模块的具体使用方法
2020/02/17 Python
基于Python获取docx/doc文件内容代码解析
2020/02/17 Python
澳大利亚儿童精品仓库:Goo & Co.
2019/06/20 全球购物
中东最大的在线宠物店:Dubai Pet Food
2020/06/11 全球购物
RealTek面试题
2016/06/28 面试题
服装厂厂长岗位职责
2013/12/27 职场文书
小区物业门卫岗位职责
2014/04/10 职场文书
促销活动总结报告
2014/04/26 职场文书
退休教师欢送会致辞
2015/07/31 职场文书
2016校本研修培训心得体会
2016/01/08 职场文书
SpringAop日志找不到方法的处理
2021/06/21 Java/Android
Log4j.properties配置及其使用
2021/08/02 Java/Android
python分分钟绘制精美地图海报
2022/02/15 Python