IM

im/src/plugins/recorder/record-sdk.js

@@ -0,0 +1,45 @@
+import Recorder from './recorder'
+
+export default class Record {
+  startRecord(param) {
+    let self = this
+    try {
+      Recorder.get(rec => {
+        if (rec.error) return param.error(rec.error)
+        self.recorder = rec
+        self.recorder.start()
+        param.success('开始录音')
+      })
+    } catch (e) {
+      param.error('开始录音失败' + e)
+    }
+  }
+
+  stopRecord(param) {
+    let self = this
+    try {
+      let blobData = self.recorder.getBlob()
+      param.success(blobData)
+    } catch (e) {
+      param.error('结束录音失败' + e)
+    }
+  }
+
+  play(audio) {
+    let self = this
+    try {
+      self.recorder.play(audio)
+    } catch (e) {
+      console.error('录音播放失败' + e)
+    }
+  }
+
+  clear(audio) {
+    let self = this
+    try {
+      self.recorder.clear(audio)
+    } catch (e) {
+      console.error('清空录音失败' + e)
+    }
+  }
+}

im/src/plugins/recorder/recorder.js

@@ -0,0 +1,239 @@
+export default class Recorder {
+  constructor(stream, config) {
+    //兼容
+    window.URL = window.URL || window.webkitURL
+    navigator.getUserMedia =
+      navigator.getUserMedia ||
+      navigator.webkitGetUserMedia ||
+      navigator.mozGetUserMedia ||
+      navigator.msGetUserMedia
+
+    config = config || {}
+    config.sampleBits = config.sampleBits || 16 //采样数位 8, 16
+    config.sampleRate = config.sampleRate || 8000 //采样率(1/6 44100)
+
+    this.context = new (window.webkitAudioContext || window.AudioContext)()
+    this.audioInput = this.context.createMediaStreamSource(stream)
+    this.createScript =
+      this.context.createScriptProcessor || this.context.createJavaScriptNode
+    this.recorder = this.createScript.apply(this.context, [4096, 1, 1])
+
+    this.audioData = {
+      size: 0, //录音文件长度
+      buffer: [], //录音缓存
+      inputSampleRate: this.context.sampleRate, //输入采样率
+      inputSampleBits: 16, //输入采样数位 8, 16
+      outputSampleRate: config.sampleRate, //输出采样率
+      oututSampleBits: config.sampleBits, //输出采样数位 8, 16
+      input: function(data) {
+        this.buffer.push(new Float32Array(data))
+        this.size += data.length
+      },
+      compress: function() {
+        //合并压缩
+        //合并
+        let data = new Float32Array(this.size)
+        let offset = 0
+        for (let i = 0; i < this.buffer.length; i++) {
+          data.set(this.buffer[i], offset)
+          offset += this.buffer[i].length
+        }
+        //压缩
+        let compression = parseInt(this.inputSampleRate / this.outputSampleRate)
+        let length = data.length / compression
+        let result = new Float32Array(length)
+        let index = 0,
+          j = 0
+        while (index < length) {
+          result[index] = data[j]
+          j += compression
+          index++
+        }
+        return result
+      },
+      encodeWAV: function() {
+        let sampleRate = Math.min(this.inputSampleRate, this.outputSampleRate)
+        let sampleBits = Math.min(this.inputSampleBits, this.oututSampleBits)
+        let bytes = this.compress()
+        let dataLength = bytes.length * (sampleBits / 8)
+        let buffer = new ArrayBuffer(44 + dataLength)
+        let data = new DataView(buffer)
+
+        let channelCount = 1 //单声道
+        let offset = 0
+
+        let writeString = function(str) {
+          for (let i = 0; i < str.length; i++) {
+            data.setUint8(offset + i, str.charCodeAt(i))
+          }
+        }
+
+        // 资源交换文件标识符
+        writeString('RIFF')
+        offset += 4
+        // 下个地址开始到文件尾总字节数,即文件大小-8
+        data.setUint32(offset, 36 + dataLength, true)
+        offset += 4
+        // WAV文件标志
+        writeString('WAVE')
+        offset += 4
+        // 波形格式标志
+        writeString('fmt ')
+        offset += 4
+        // 过滤字节,一般为 0x10 = 16
+        data.setUint32(offset, 16, true)
+        offset += 4
+        // 格式类别 (PCM形式采样数据)
+        data.setUint16(offset, 1, true)
+        offset += 2
+        // 通道数
+        data.setUint16(offset, channelCount, true)
+        offset += 2
+        // 采样率,每秒样本数,表示每个通道的播放速度
+        data.setUint32(offset, sampleRate, true)
+        offset += 4
+        // 波形数据传输率 (每秒平均字节数) 单声道×每秒数据位数×每样本数据位/8
+        data.setUint32(
+          offset,
+          channelCount * sampleRate * (sampleBits / 8),
+          true
+        )
+        offset += 4
+        // 快数据调整数 采样一次占用字节数 单声道×每样本的数据位数/8
+        data.setUint16(offset, channelCount * (sampleBits / 8), true)
+        offset += 2
+        // 每样本数据位数
+        data.setUint16(offset, sampleBits, true)
+        offset += 2
+        // 数据标识符
+        writeString('data')
+        offset += 4
+        // 采样数据总数,即数据总大小-44
+        data.setUint32(offset, dataLength, true)
+        offset += 4
+        // 写入采样数据
+        if (sampleBits === 8) {
+          for (let i = 0; i < bytes.length; i++, offset++) {
+            let s = Math.max(-1, Math.min(1, bytes[i]))
+            let val = s < 0 ? s * 0x8000 : s * 0x7fff
+            val = parseInt(255 / (65535 / (val + 32768)))
+            data.setInt8(offset, val, true)
+          }
+        } else {
+          for (let i = 0; i < bytes.length; i++, offset += 2) {
+            let s = Math.max(-1, Math.min(1, bytes[i]))
+            data.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7fff, true)
+          }
+        }
+        return new Blob([data], {
+          type: 'audio/wav',
+        })
+      },
+    }
+  }
+
+  //开始录音
+  start() {
+    this.audioInput.connect(this.recorder)
+    this.recorder.connect(this.context.destination)
+
+    //音频采集
+    let self = this
+    this.recorder.onaudioprocess = function(e) {
+      self.audioData.input(e.inputBuffer.getChannelData(0))
+    }
+  }
+
+  //停止
+  stop() {
+    this.recorder.disconnect()
+  }
+
+  //获取音频文件
+  getBlob() {
+    this.stop()
+    return this.audioData.encodeWAV()
+  }
+
+  //回放
+  play(audio) {
+    audio.src = window.URL.createObjectURL(this.getBlob())
+  }
+
+  //清理缓存的录音数据
+  clear(audio) {
+    this.audioData.buffer = []
+    this.audioData.size = 0
+    audio.src = ''
+  }
+
+  static checkError(e) {
+    const { name } = e
+    let errorMsg = ''
+    switch (name) {
+      case 'AbortError':
+        errorMsg = '录音设备无法被使用'
+        break
+      case 'NotAllowedError':
+        errorMsg = '用户已禁止网页调用录音设备'
+        break
+      case 'PermissionDeniedError':
+        errorMsg = '用户已禁止网页调用录音设备'
+        break // 用户拒绝
+      case 'NotFoundError':
+        errorMsg = '录音设备未找到'
+        break
+      case 'DevicesNotFoundError':
+        errorMsg = '录音设备未找到'
+        break
+      case 'NotReadableError':
+        errorMsg = '录音设备无法使用'
+        break
+      case 'NotSupportedError':
+        errorMsg = '不支持录音功能'
+        break
+      case 'MandatoryUnsatisfiedError':
+        errorMsg = '无法发现指定的硬件设备'
+        break
+      default:
+        errorMsg = '录音调用错误'
+        break
+    }
+    return {
+      error: errorMsg,
+    }
+  }
+
+  static get(callback, config) {
+    if (callback) {
+      if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
+        navigator.mediaDevices
+          .getUserMedia({
+            audio: true,
+            video: false,
+          })
+          .then(stream => {
+            let rec = new Recorder(stream, config)
+            callback(rec)
+          })
+          .catch(e => {
+            callback(Recorder.checkError(e))
+          })
+      } else {
+        navigator
+          .getUserMedia({
+            audio: true,
+            video: false,
+          })
+          .then(stream => {
+            let rec = new Recorder(stream, config)
+            callback(rec)
+          })
+          .catch(e => {
+            // Recorder.checkError(e)
+            callback(Recorder.checkError(e))
+          })
+      }
+    }
+  }
+}

im/src/plugins/sms-lock.js

@@ -0,0 +1,76 @@
+/**
+ * 短信倒计时锁
+ */
+class SmsLock {
+  // 发送倒计时默认60秒
+  time = null
+
+  // 计时器
+  timer = null
+
+  // 倒计时默认60秒
+  lockTime = 60
+
+  // 锁标记名称
+  lockName = ''
+
+  /**
+   * 实例化构造方法
+   *
+   * @param {String} purpose 唯一标识
+   * @param {Number} time
+   */
+  constructor(purpose, lockTime = 60) {
+    this.lockTime = lockTime
+    this.lockName = `SMSLOCK_${purpose}`
+
+    this.init()
+  }
+
+  // 开始计时
+  start(time = null) {
+    this.time = time == null || time >= this.lockTime ? this.lockTime : time
+
+    this.clearInterval()
+
+    this.timer = setInterval(() => {
+      if (this.time == 0) {
+        this.clearInterval()
+        this.time = null
+        localStorage.removeItem(this.lockName)
+        return
+      }
+
+      this.time--
+
+      // 设置本地缓存
+      localStorage.setItem(this.lockName, this.getTime() + this.time)
+    }, 1000)
+  }
+
+  // 页面刷新初始化
+  init() {
+    let result = localStorage.getItem(this.lockName)
+
+    if (result == null) return
+
+    let time = result - this.getTime()
+    if (time > 0) {
+      this.start(time)
+    } else {
+      localStorage.removeItem(this.lockName)
+    }
+  }
+
+  // 获取当前时间
+  getTime() {
+    return Math.floor(new Date().getTime() / 1000)
+  }
+
+  // 清除计时器
+  clearInterval() {
+    clearInterval(this.timer)
+  }
+}
+
+export default SmsLock

im/src/plugins/ws-socket.js

@@ -0,0 +1,275 @@
+class WsSocket {
+  /**
+   * Websocket 连接
+   *
+   * @var Websocket
+   */
+  connect;
+
+  /**
+   * 服务器连接地址
+   */
+  url;
+
+  /**
+   * 配置信息
+   *
+   * @var Object
+   */
+  config = {
+    heartbeat: {
+      enabled: false, // 是否发送心跳包
+      time: 10000, // 心跳包发送间隔时长
+      setInterval: null, // 心跳包计时器
+    },
+    reconnect: {
+      lockReconnect: false,
+      setTimeout: null, // 计时器对象
+      time: 5000, // 重连间隔时间
+      number: 1000, // 重连次数
+    },
+  };
+
+  /**
+   * 自定义绑定消息事件
+   *
+   * @var Array
+   */
+  onCallBacks = [];
+
+  /**
+   * 创建 WsSocket 的实例
+   *
+   * @param {Function} urlCallBack url闭包函数
+   * @param {Object} events 原生 WebSocket 绑定事件
+   */
+  constructor(urlCallBack, events) {
+    this.urlCallBack = urlCallBack;
+
+    // 定义 WebSocket 原生方法
+    this.events = Object.assign(
+      {
+        onError: (evt) => {},
+        onOpen: (evt) => {},
+        onClose: (evt) => {},
+      },
+      events
+    );
+  }
+
+  /**
+   * 事件绑定
+   *
+   * @param {String} event 事件名
+   * @param {Function} callBack 回调方法
+   */
+  on(event, callBack) {
+    // 对应 socket-instance.js
+    console.log("事件绑定", event, callBack);
+    this.onCallBacks[event] = callBack;
+    return this;
+  }
+
+  /**
+   * 加载 WebSocket
+   */
+  loadSocket() {
+    // 判断当前是否已经连接
+    if (this.connect != null) {
+      this.connect.close();
+      this.connect = null;
+    }
+
+    this.url = this.urlCallBack();
+    const connect = new WebSocket(this.url);
+    connect.onerror = this.onError.bind(this);
+    connect.onopen = this.onOpen.bind(this);
+    connect.onmessage = this.onMessage.bind(this);
+    connect.onclose = this.onClose.bind(this);
+
+    this.connect = connect;
+  }
+
+  /**
+   * 连接 Websocket
+   */
+  connection() {
+    this.loadSocket();
+  }
+
+  /**
+   * 掉线重连 Websocket
+   */
+  reconnect() {
+    console.log("掉线重连接");
+    let reconnect = this.config.reconnect;
+    if (reconnect.lockReconnect || reconnect.number == 0) {
+      return;
+    }
+
+    this.config.reconnect.lockReconnect = true;
+
+    // 没连接上会一直重连，设置延迟避免请求过多
+    reconnect.setTimeout && clearTimeout(reconnect.setTimeout);
+
+    this.config.reconnect.setTimeout = setTimeout(() => {
+      this.connection();
+
+      this.config.reconnect.lockReconnect = false;
+      this.config.reconnect.number--;
+
+      console.log(
+        `网络连接已断开，正在尝试重新连接(${this.config.reconnect.number})...`
+      );
+    }, reconnect.time);
+  }
+
+  /**
+   * 解析接受的消息
+   *
+   * @param {Object} evt Websocket 消息
+   */
+  onParse(evt) {
+   
+    const res = JSON.parse(evt.data).result;
+
+    //如果创建时间是时间戳类型则转换为 日期类型，否则新压入栈的消息的创建时间和从数据库读取出来的创建时间格式对不上，处理的时候会出异常。
+    if (typeof res.createTime == "number") {
+      res.createTime = this.unixToDate(res.createTime, "yyyy-MM-dd hh:mm");
+    }
+    return res;
+  }
+
+  /**
+   * 将unix时间戳转换为指定格式
+   * @param unix   时间戳【秒】
+   * @param format 转换格式
+   * @returns {*|string}
+   */
+  unixToDate(unix, format) {
+    if (!unix) return unix;
+    let _format = format || "yyyy-MM-dd hh:mm:ss";
+    const d = new Date(unix);
+    const o = {
+      "M+": d.getMonth() + 1,
+      "d+": d.getDate(),
+      "h+": d.getHours(),
+      "m+": d.getMinutes(),
+      "s+": d.getSeconds(),
+      "q+": Math.floor((d.getMonth() + 3) / 3),
+      S: d.getMilliseconds(),
+    };
+    if (/(y+)/.test(_format))
+      _format = _format.replace(
+          RegExp.$1,
+          (d.getFullYear() + "").substr(4 - RegExp.$1.length)
+      );
+    for (const k in o)
+      if (new RegExp("(" + k + ")").test(_format))
+        _format = _format.replace(
+            RegExp.$1,
+            RegExp.$1.length === 1
+                ? o[k]
+                : ("00" + o[k]).substr(("" + o[k]).length)
+        );
+    return _format;
+  }
+
+  /**
+   * 打开连接
+   *
+   * @param {Object} evt Websocket 消息
+   */
+  onOpen(evt) {
+    this.events.onOpen(evt);
+
+    if (this.config.heartbeat.enabled) {
+      this.heartbeat();
+    }
+  }
+
+  /**
+   * 关闭连接
+   *
+   * @param {Object} evt Websocket 消息
+   */
+  onClose(evt) {
+    console.log("关闭连接", evt);
+    if (this.config.heartbeat.enabled) {
+      clearInterval(this.config.heartbeat.setInterval);
+    }
+    console.log("evt", evt);
+
+    if (evt.code == 1006) {
+      this.reconnect();
+    }
+
+    // this.events.onClose(evt);
+  }
+
+  /**
+   * 连接错误
+   *
+   * @param {Object} evt Websocket 消息
+   */
+  onError(evt) {
+    this.events.onError(evt);
+  }
+
+  /**
+   * 接收消息
+   *
+   * @param {Object} evt Websocket 消息
+   */
+  onMessage(evt) {
+    let result = this.onParse(evt);
+    console.log("接收消息", result, "color:red");
+    // 判断消息事件是否被绑定
+    // event_talk;
+
+    // 指定推送消息
+    this.onCallBacks["event_talk"](result);
+  }
+
+  /**
+   * WebSocket心跳检测
+   */
+  heartbeat() {
+    console.log("WebSocket心跳检测");
+    this.config.heartbeat.setInterval = setInterval(() => {
+      this.connect.send("PING");
+    }, this.config.heartbeat.time);
+  }
+
+  /**
+   * 聊天发送数据
+   *
+   * @param {Object} message
+   */
+  send(message) {
+    this.connect.send(JSON.stringify(message));
+  }
+
+  /**
+   * 关闭连接
+   */
+  close() {
+    this.connect.close();
+  }
+
+  /**
+   * 推送消息
+   *
+   * @param {String} event 事件名
+   * @param {Object} data 数据
+   */
+  emit(event, data) {
+    if (this.connect && this.connect.readyState === 1) {
+      this.connect.send(JSON.stringify(data));
+    } else {
+      console.error("WebSocket 连接已关闭...", this.connect);
+    }
+  }
+}
+
+export default WsSocket;