GIF 消息

方法说明中并非所有的方法都会写在文档中，具体请前往相关文件查看代码逻辑。

文件位置

TIP

文件位于 src\views\_uc-chat\msg-chat\content-send\send-image\index.js sendGif

使用方法

代码可以参考 src\views\_uc-chat\msg-chat\content-send\contentSend.vue

// 引入图片上传模块
import {
  sendImage,
  sendGif,
} from "@/views/_uc-chat/msg-chat/content-send/send-image/index.js";

/**
 * 图片上传
 * @param {*} file 文件
 * @param {*} param1 传 { currentUserInfo, currentChatList }
 * @param {*} time 延时上传时间，一下子加很多文件，没有延时的话会有性能问题，比如选项卡切换不动
 */
sendGif(file, { currentUserInfo, currentChatList }, (time = 0));

上传 GIF 依赖文件

• import { UCMessage } from "@/control/message/messageSender.js"; 消息发送
• import { UC_File } from "@/control/uc-file/ucFile.js"; 文件上传
• import store from "@/store"; store 获取

代码分析

实例化消息体

let Content = {
  gifDataSize: file.size, // GIF图片大小
  height: 100, // GIF图片高度
  width: 100, // GIF图片宽度
  // localPath: file.path,
  remoteUrl: file.path, // GIF图片路径
  state: FileStatus.PREUPLOAD,
  extra: JSON.stringify({
    userId: currentUserInfo.memberid,
    userName: currentUserInfo.name,
    toId: currentChatList.targetId,
    toName: currentChatList.conversationTitle,
    from_c: "PC",
    pcMAC: ZX_CLIENT.getMAC(),
  }),
  user: {
    id: currentUserInfo.memberid,
    name: currentUserInfo.name,
    portrait: "",
  },
};
const gifMessage = new UCMessage("GIFMessage", Content);

向页面中添加消息体

gifMessage.preAppend({
  conversationType: currentChatList.conversationType,
  targetId: currentChatList.targetId,
  targetName: currentChatList.conversationTitle,
});

实例化GIF图片文件上传并上传

let uploadFile = new UC_File(gifMessage);
uploadFile.upload(file, (status, data) => {
  console.log(status, data);
  if (status == "success") {
    console.log("上传完成后返回的数据", data);
    let fileInfo = JSON.parse(data);
    // 获取远程服务器上的图片的路径，是一串数字，也就是文件ID
    const fileURL = fileInfo.atts[0].fileUrl;
    gifMessage.content.remoteUrl = fileURL;
    // gifMessage.content.localPath = fileURL;

    // 解决添加消息体后已经向数据库写入了，但是发送后不更新fileURL的问题
    ZX_CLIENT.ImMsg.updateChatMessage(
      {
        messageId: gifMessage.messageId,
      },
      {
        content: gifMessage.content,
      }
    );

    console.log("格式化上传完成后返回的数据", fileInfo, gifMessage);

    // 上传成功后将GIF消息发送出去
    gifMessage.sent({
      conversationType: currentChatList.conversationType,
      targetId: currentChatList.targetId,
      needAppend: false,
      targetName: currentChatList.conversationTitle,
    });

    // 修改消息状态
    changeMessageParams(gifMessage, "content", gifMessage.content);
  }
});