@jp-web/ts-sdk/output/we-chat/conference/debug/pages/sample/sample.js

视频客服，视频会议Web端及微信小程序端SDK

const {JuphoonWeChatConference, Reporter, LoggerLevel, ConferenceEventType, ConferenceErrorType, ConferenceClientState, MediaRemoteRecordPictureSize} = getApp().globalData.sdk;
const config = getApp().globalData.config;
Reporter.setLogLevel(LoggerLevel.DEBUG);
// pages/sample/sample.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    versionInfo: JSON.stringify(JuphoonWeChatConference.getVersion()),
    environmentAddress: config.webacdEnvironment,
    appKey: config.appKey,
    token: '',
    conferenceNumber: '',
    nickname: '',
    accountName: '',
    accountPassword: '',
    capacity: 16,
    mtcConfPasswordKey: '',
    facingMode: 'user',
    route: 'speaker',
    recordVideoWidth: 640,
    recordVideoHeight: 360,
    recordFrameRate: 18,
    recordBitrate: 0,
    recordFileName: '',
    recordStorageProtocol: 'aws',
    recordRemoteFileName: '',
    channelId: '',
    audioOutput: true,
    uploadAudioStream: true,
    uploadVideoStream: true,
    messageType: '',
    messageContent: '',
    takePhotoImage: '',
    clientEnable: false,
    interfaceEnable: false,
    remoteRecordEnable: false,
    startRemoteRecordEnable: false,
    stopRemoteRecordEnable: false,
    mergeModeList: [
      {value: 1, label: "平铺模式"},
      {value: 2, label: "讲台模式"},
      {value: 3, label: "演讲模式"},
      {value: 4, label: "自定义模式"},
      {value: 5, label: "智能模式"},
    ],
    mergeModeIndex: 0,
    intellegenceMergeModeList: [
      {value: 1, label: "FREE_LAYOUT"},
      {value: 2, label: "RECT_LAYOUT"},
      {value: 3, label: "BIG_SMALLX2"},
      {value: 4, label: "BIG_SMALLX3"},
      {value: 5, label: "BIG_SMALLX4"},
      {value: 6, label: "BIG_SMALLX5"},
      {value: 7, label: "BIG_SMALLX6"},
      {value: 8, label: "BIG_SMALLX7"},
      {value: 9, label: "BIG_SMALLX8"},
      {value: 10, label: "BIG_SMALLX9"},
      {value: 11, label: "BIG_SMALLX10"},
      {value: 12, label: "BIG_SMALL_TOP"},
      {value: 13, label: "BIG_SMALL_BOTTOM"}
    ],
    intellegenceMergeModeIndex: 0,
    screenShareModeList: [
      {value: 1, label: "SCREEN"},
      {value: 2, label: "PLATOFORM"},
      {value: 3, label: "PLATFORM_COVER"},
      {value: 4, label: "SPEAKER"}
    ],
    screenShareModeIndex: 0,
    recordResolutionList: [
      {value: 0, label: "NONE"},
      {value: MediaRemoteRecordPictureSize.MIN, label: "MIN"},
      {value: MediaRemoteRecordPictureSize.SMALL, label: "SMALL"},
      {value: MediaRemoteRecordPictureSize.LARGE, label: "LARGE"},
      {value: MediaRemoteRecordPictureSize.MAX, label: "MAX"},
    ],
    recordResolutionIndex: 0,
    recordMergeModeList: [
      {value: 1, label: "SCREEN"},
      {value: 2, label: "PLATFORM"},
      {value: 3, label: "SPEAKER"},
      {value: 4, label: "LAYOUT"},
      {value: 5, label: "INTELLEGNCE"},
      {value: 6, label: "SCREEN_SHARING"},
    ],
    recordMergeModeIndex: 0,
    buttonStateMap: {
      createClient: true,
      destroyClient: false
    },
    clientState: null
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let sdkConfig;
    try {
      sdkConfig = wx.getStorageSync('sdkConfig');
    } catch (e) {
      wx.showModal({
        title: '获取缓存数据失败',
        content: e
      });
    }

    this.setData({
      ...sdkConfig
    });
    JuphoonWeChatConference.setConfig({address: this.data.environmentAddress});
  },

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

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

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    wx.setStorageSync('sdkConfig', {
      environmentAddress: this.data.environmentAddress,
      appKey: this.data.appKey
    });
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
  },
  getToken() {
    JuphoonWeChatConference.getToken()
      .then(token => this.setData({
        token,
        'buttonStateMap.createClient': true
      }));
  },
  createClient() {
    this.client = JuphoonWeChatConference.createConferenceClient(this.data.appKey, this.data.token);
    this.client.setPageTarget(this);

    this.client.login({accountName: this.data.accountName, accountPwd: this.data.accountPassword});

    this.client.addEventListener('login', (ev) => {
      this.setData({'buttonStateMap.destroyClient': true});
      this.setData({clientEnable: true});
    })
    this.client.addEventListener(ConferenceEventType.ERROR, (ev) => {
      switch (ev.error) {
        case ConferenceErrorType.LOGIN_PASSWORD_ERROR:
          wx.showModal({content: '用户名或密码错误'});
          this.setData({
            clientEnable: false,
            interfaceEnable: false
          });
          break;
        default:
          wx.showModal({content: JSON.stringify(ev.message)}).then();
          this.setData({
            clientEnable: false,
            interfaceEnable: false
          });
          break;
      }
    }, {once: true});

  },
  destroyClient() {
    this.client.destroy();
  },
  environmentAddressChange(e) {
    this.setData({environmentAddress: e.detail.value});
    JuphoonWeChatConference.setConfig({address: this.data.environmentAddress});
  },
  appKeyChange(e) {
    this.setData({appKey: e.detail.value});
  },
  conferenceNumberChange(e) {
    this.setData({conferenceNumber: e.detail.value});
  },
  nicknameChange(e) {
    this.setData({nickname: e.detail.value});
  },
  accountNameChange(e) {
    this.setData({accountName: e.detail.value});
  },
  accountPasswordChange(e) {
    this.setData({accountPassword: e.detail.value});
  },
  mtcConfPasswordKeyChange(e) {
    this.setData({mtcConfPasswordKey: e.detail.value});
  },
  join() {
    this.client.join(this.data.conferenceNumber, true, {
      displayName: this.data.nickname,
      conferencePassword: this.data.mtcConfPasswordKey,
      enableRecord: this.data.remoteRecordEnable,
      capacity: Number.parseInt(this.data.capacity)
    })
      .then(() => {
        this.setData({interfaceEnable: true});
      })
      .catch(reason => {
        console.log(reason);
        wx.showModal({content: JSON.stringify(reason.message)});
      });
    this.client.addEventListener(ConferenceEventType.RECORD_DELIVERY_JOIN, (ev) => {
      this.setData({startRemoteRecordEnable: true});
    });

    this.client.addEventListener(ConferenceEventType.ERROR, (ev) => {
      console.log(ev);
      switch (ev.error) {
        case ConferenceErrorType.CONFERENCE_PASSWORD_ERROR:
          wx.showModal({
            content: '会议密码错误'
          });
          break;
      }
    });
    this.client.addEventListener(ConferenceEventType.CONFERENCE_DESTROY, () => {
      this.client.destroy();
      this.setData({
        clientEnable: false,
        interfaceEnable: false
      });
    })
  },
  stop() {
    this.client.stop()
      .then(() => {
        this.setData({
          clientEnable: false,
          interfaceEnable: false
        })
      });
  },
  leave() {
    this.client.leave();
    this.client.addEventListener(ConferenceEventType.CONFERENCE_LEAVE, (ev) => {
      this.setData({
        clientEnable: false,
        interfaceEnable: false
      })
    });
  },
  openCamera() {
    var that = this;
    this.client.startCameraVideo('cover')
      .then(stream => {
        this.localStream = stream;
        stream.start('local-stream', that);
      })
    this.client.startVideo()
      .then(stream => {
        this.remoteStream = stream;
        stream.start('remote-stream', that);
      })
  },
  switchCamera() {
    this.data.facingMode = this.data.facingMode === 'user' ? 'environment' : 'user';
    this.client.switchCamera({facingMode: this.data.facingMode});
  },
  switchAudioRoute() {
    this.data.route = this.data.route === 'speaker' ? 'ear' : 'speaker';
    this.client.setAudioRoute(this.data.route);
  },
  triggerAudioOutput() {
    this.data.audioOutput = !this.data.audioOutput;
    this.data.audioOutput ? this.client.enableAudioOutput() : this.client.disableAudioOutput();
  },
  triggerVideoInput() {
    this.data.uploadVideoStream = !this.data.uploadVideoStream;
    this.data.uploadVideoStream ? this.client.enableUploadVideoStream() : this.client.disableUploadVideoStream();
  },
  triggerAudioInput() {
    this.data.uploadAudioStream = !this.data.uploadAudioStream;
    this.data.uploadAudioStream ? this.client.enableUploadAudioStream() : this.client.disableUploadAudioStream();
  },
  messageTypeInput(e) {
    this.setData({messageType: e.detail.value});
  },
  messageContentInput(e) {
    this.setData({messageContent: e.detail.value});
  },
  sendMessage() {
    this.client.sendMessage(this.data.messageType, this.data.messageContent);
  },
  takePhoto() {
    this.localStream.snapshot('raw')
      .then(res => {
        this.setData({
          takePhotoImage: res.tempImagePath
        })
      });
  },
  startRemoteRecord() {
    this.client.addEventListener(ConferenceEventType.START_REMOTE_RECORD_RESULT, (ev) => {
      console.log(ev);
      if (ev.message.result) {
        this.setData({
          startRemoteRecordEnable: false,
          stopRemoteRecordEnable: true
        })
      }
    });
    this.client.recorder.startRemoteRecord({
      videoWidth: this.data.recordVideoWidth,
      videoHeight: this.data.recordVideoHeight,
      recordResolution: this.data.recordResolutionList[this.data.recordResolutionIndex].value,
      frameRate: this.data.recordFrameRate,
      bitrate: this.data.recordBitrate,
      mergeMode: this.data.recordMergeModeList[this.data.recordMergeModeIndex].value,
      storage: {
        protocol: this.data.recordStorageProtocol
      },
      fileName: this.data.recordFileName,
      remoteFileName: this.data.recordRemoteFileName
    })
      .then(() => wx.showModal({content: '开启远端录制成功'}))
      .catch(reason => wx.showModal({title: '开启远端录制失败', content: JSON.stringify(reason)}))
  },
  stopRemoteRecord() {
    this.client.recorder.stopRemoteRecord()
      .then(() => wx.showModal({content: '停止远端录制成功'}))
      .catch(reason => wx.showModal({title: '停止远端录制失败', content: JSON.stringify(reason)}));
    this.client.addEventListener(ConferenceEventType.STOP_REMOTE_RECORD_RESULT, (ev) => {
      if (ev.message.result) {
        this.setData({
          startRemoteRecordEnable: true,
          stopRemoteRecordEnable: false
        })
      }
    })

  },
  query() {
    this.client.query(this.data.channelId)
      .then(info => {
        wx.showModal({content: JSON.stringify(info)});
      })
      .catch(reason => {
        wx.showModal({content: reason.message});
      });
  },
  mergeModeChange: function (e) {
    this.setData({mergeModeIndex: Number.parseInt(e.detail.value, 10)});
    this.client.videoLayout.setMergeModeEx(this.data.mergeModeList[this.data.mergeModeIndex].value);
  },
  intellegenceMergeModeChange: function (e) {
    this.setData({intellegenceMergeModeIndex: Number.parseInt(e.detail.value, 10)});
    this.client.videoLayout.setIntellegenceMergeModeEx(
      this.data.intellegenceMergeModeList[this.data.intellegenceMergeModeIndex].value,
      this.data.screenShareModeList[this.data.screenShareModeIndex].value,
      this.client.selfParticipant
    );
  },
  screenShareModeChange: function (e) {
    this.setData({screenShareModeIndex: Number.parseInt(e.detail.value, 10)});
    this.client.videoLayout.setIntellegenceMergeModeEx(this.data.intellegenceMergeModeList[this.data.intellegenceMergeModeIndex].value);
  },
  remoteRecordEnableChange: function (e) {
    this.setData({remoteRecordEnable: e.detail.value});
  },
  tokenChange: function (e) {
    this.setData({token: e.detail.value});
  },
  recordResolutionChange: function (e) {
    this.setData({recordResolutionIndex: Number.parseInt(e.detail.value, 10)});
  },
  recordMergeModeChange: function (e) {
    this.setData({recordMergeModeIndex: Number.parseInt(e.detail.value, 10)});
  },
  recordVideoWidthInput: function (e) {
    this.setData({recordVideoWidth: Number.parseInt(e.detail.value, 10)});
  },
  recordVideoHeightInput: function (e) {
    this.setData({recordVideoHeight: Number.parseInt(e.detail.value, 10)});
  },
  recordFrameRateInput: function (e) {
    this.setData({recordFrameRate: Number.parseInt(e.detail.value, 10)});
  },
  recordBitrateInput: function (e) {
    this.setData({recordBitrate: Number.parseInt(e.detail.value, 10)});
  },
  recordFileNameInput: function (e) {
    this.setData({recordFileName: e.detail.value});
  },
  recordStorageProtocolInput: function (e) {
    this.setData({recordStorageProtocol: e.detail.value});
  },
  recordRemoteFileNameInput: function (e) {
    this.setData({recordRemoteFileName: e.detail.value});
  },
  capacityChange: function (e) {
    this.setData({capacity: e.detail.value});
  },
  channelIdChange: function (e) {
    this.setData({channelId: e.detail.value});
  }
});