socket推送与前端更新

服务器简介

1. 服务器端使用websocket协议，用socket.io的通讯方式来提供实时的信息推送；
2. 服务器端通过定义多个频道和事件，来对应前端需要处理的业务，其它包括：通知前端用户信息有更新、通知前端员工新朋友有更新、通知前端A分通知有更新、通知前端B分通知有更新、通知前端公告通知有更新、通知前端绩效分消息有更新、通知前端任务消息有更新、通知前端公司所有用户信息有更新(基础数据、权限等)；
3. 服务器和客户端保持实时连接，一直到前端关闭或者后台运行即断开连接；

提供频道

1. integral:employee:+员工ID (以下称：员工频道)
   示例代码：

   new Echo({
          broadcaster: 'socket.io',
          host: process.env.WEBSOCKET_API
        }).channel('integral:employee:'+this.$store.getters.user_info.id)
          .listen('.server.info', (e) => {
   
          });

2. site:+公司ID (以下称公司频道)
   示例代码：

   new Echo({
          broadcaster: 'socket.io',
          host: process.env.WEBSOCKET_API
        }).channel('site:'+this.$store.getters.user_info.site_id)
          .listen('.server.siteEmployee', (e) => {
   
          });

员工频道的事件定义

1. 通知前端用户信息有更新
   事件名称：server.info
   处理方式：清除user_info的缓存，重新拉取

2. 通知前端A分通知有更新
   事件名称：server.msgA
   处理方式：重新拉取消息通知

3. 通知前端B分通知有更新
   事件名称：server.msgB
   处理方式：重新拉取消息通知

4. 通知前端公告通知有更新
   事件名称：server.msgInformation
   处理方式：重新拉取消息通知，同时更新管理中心的公告

5. 通知前端绩效分消息有更新
   事件名称：server.msgPerformance
   处理方式：重新拉取消息通知

6. 通知前端任务消息有更新
   事件名称：server.msgTask
   处理方式：更新消息中心的任务数

公司频道的事件定义

1. 通知前端公司所有用户信息有更新(基础数据、权限等)
   事件名称：server.siteEmployee
   处理方式：清除user_info的缓存，重新拉取；清除SET_EMPLOYEE_MAP重新拉取

2. 通知前端员工新朋友有更新
   事件名称：server.employeeInvitation
   处理方式：更新组织架构的新成员右边角标提示

前端实现方式

• 前端分为两部分实现：APP和H5端
  APP存在多个窗口，它需要同时更新所有数据状态，H5则不存在这样的问题但是它存在缓存页面也要更新的问题，为了统一实现方式，使用已经定义的窗口通信（即缓存更新机制）来实现

1. 需要安装依赖
   npm install –save socket.io-client
   npm install –save laravel-echo
2. laravel-echo是一个配合服务器端实现socket.io通讯的标准库，它本身依赖socket.io-client
3. 在需要更新的界面上定义好相关的业务逻辑；
4. 接收服务器信息后，通过$keep_alive_update方法向所有页面发送更新通知；