Compartir tecnología

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

En la era de Internet móvil, la función de mensajería instantánea (IM) es una parte indispensable de muchas aplicaciones. Sin embargo, al desarrollar aplicaciones de mensajería instantánea, los desarrolladores a menudo se enfrentan a una elección difícil: desarrollar aplicaciones separadas para cada plataforma o desarrollarlas. desarrollar un desarrollo limitado para una determinada plataforma? La aparición de uni-app proporciona una respuesta eficaz a este problema. Con su concepto de "escribir una vez, ejecutar en múltiples terminales", uni-app brinda una comodidad sin precedentes a los desarrolladores.

uni-app es un marco para desarrollar todas las aplicaciones front-end basadas en Vue.js. Admite la compilación simultánea en iOS, Android, Web y varias plataformas de programas pequeños a través de un conjunto de códigos. Este modelo de desarrollo de "escribir una vez y ejecutar en múltiples terminales" no solo mejora en gran medida la eficiencia del desarrollo, sino que también reduce los costos de mantenimiento. Las funciones de iteración rápida y actualización en caliente permiten que las aplicaciones respondan rápidamente a las necesidades del mercado y de los usuarios y sigan siendo competitivas.

Este artículo se basará enSDK de aplicación única NetEase Yunxin IMComo base, le enseñaremos cómo integrar las capacidades de conversación por chat en el proyecto uni-app.

1. Preparación del proyecto

1. Registre una cuenta de desarrollador de NetEase Yunxin: primero, debeSitio web oficial de NetEase YunxinRegistre una cuenta de desarrollador en Internet y cree una aplicación para obtener la clave de aplicación y la clave secreta.

1. Instale el entorno de desarrollo uni-app: descargue e instale HBuilderX, que es la herramienta de desarrollo oficial de uni-app.

1. Integre el SDK de NetEase Cloud Trust: integre el SDK de mensajería instantánea de NetEase Cloud Trust en el proyecto uni-app. Normalmente, esto se logra introduciendo los archivos JavaScript del SDK en su proyecto.

2. Inicialice el SDK y la autenticación de inicio de sesión

Después de completar el trabajo de preparación, para garantizar que el SDK pueda interactuar de manera correcta y estable con los servicios back-end de NetEase Yunxin, debemos realizar operaciones de inicialización.

Durante este proceso, el SDK realizará una serie de preparativos, como cargar los recursos necesarios, establecer una conexión con el servidor, verificar la identidad de la aplicación, etc. Solo cuando el SDK se inicializa correctamente, su aplicación podrá utilizar las diversas funciones proporcionadas por el SDK, como enviar y recibir mensajes, administrar sesiones de usuario, etc.

Pasos de inicialización:

1. Introduzca NetEase Yunxin IM SDK en el proyecto uni-app.
2. Inicialice el SDK y pase la clave de la aplicación.
3. Implemente la lógica de inicio de sesión del usuario y obtenga accessToken.

Ejemplo de código:

import Nim from '@path/to/nim-sdk.js';
// 初始化SDK
Nim.init({
  appKey: 'YOUR_APP_KEY' // 替换为你的App Key
});
// 用户登录函数
async function login(accid, password) {
  try {
    // 调用SDK登录接口获取accessToken
    let loginResult = await Nim.login({
      accid: accid,
      password: password,
      rememberMe: true
    });
    
    // 存储accessToken到本地（这里使用uni-app的API）
    uni.setStorageSync('accessToken', loginResult.accessToken);
    
    console.log('登录成功', loginResult);
    // 成果：用户登录成功，accessToken已被存储，可以进行后续的IM操作
  } catch (error) {
    console.error('登录失败', error);
    // 处理登录失败的情况，例如提示用户重新输入账号密码或检查网络状态
  }
}
// 调用登录函数（这里只是示例，实际开发中你需要从用户输入或其他地方获取accid和password）
login('testUser', 'password123');
// 调用login函数后，将尝试使用提供的accid和password登录，并处理登录结果

3. Gestión de amigos

Una vez completada la inicialización, debemos completar las acciones básicas para implementar la función de mensajería instantánea, que implica el establecimiento, gestión y consulta de relaciones de amistad entre usuarios. A través de estas operaciones, los usuarios pueden invitar fácilmente a otros usuarios a unirse a su círculo social y gestionar sus relaciones con amigos:

(1) Agregar amigos: esto se logra llamando a la interfaz para agregar amigos del SDK.

let accessToken = uni.getStorageSync('accessToken');
// 添加好友函数
async function addFriend(userId, friendId) {
  try {
    // 检查accessToken是否有效
    if (!accessToken) {
      console.error('accessToken无效或不存在');
      return;
    }
    // 调用SDK添加好友接口
    let result = await Nim.friend.add({
      fromAccid: userId, // 当前用户ID
      toAccid: friendId, // 目标用户ID
      msg: '添加你为好友', // 邀请消息
    }, accessToken);
    
    console.log('添加好友结果', result);
    // 成果：如果成功，result将包含添加好友操作的响应信息
  } catch (error) {
    console.error('添加好友失败', error);
    // 处理添加好友失败的情况，例如提示用户检查网络或重新尝试
  }
}
// 调用添加好友函数（这里只是示例，实际开发中你需要从用户输入或其他地方获取userId和friendId）
addFriend('currentUser', 'targetUser');
// 调用addFriend函数后，将尝试添加指定的friendId为好友，并处理结果

(2) Eliminar amigos: esto se logra llamando a la interfaz de eliminación de amigos del SDK.

let accessToken = uni.getStorageSync('accessToken');
// 删除好友函数
async function deleteFriend(userId, friendId) {
  try {
    // 检查accessToken是否有效
    if (!accessToken) {
      console.error('accessToken无效或不存在');
      return;
    }
    // 调用SDK删除好友接口
    let result = await Nim.friend.delete({
      fromAccid: userId, // 当前用户ID
      toAccid: friendId, // 目标用户ID
    }, accessToken);
    
    console.log('删除好友结果', result);
    // 成果：如果成功，result将包含删除好友操作的响应信息
    // 根据返回结果更新本地好友列表（如果需要）
  } catch (error) {
    console.error('删除好友失败', error);
    // 处理删除好友失败的情况，例如提示用户检查网络或重新尝试
  }
}
// 调用删除好友函数（这里只是示例，实际开发中你需要从用户列表或其他地方获取userId和friendId）
deleteFriend('currentUser', 'targetUser');
// 调用deleteFriend函数后，将尝试删除指定的friendId为好友，并处理结果

(3) Obtener la lista de amigos: esto se logra llamando a la interfaz de obtención de la lista de amigos del SDK.

let accessToken = uni.getStorageSync('accessToken');
// 获取好友列表函数
async function getFriendList(userId) {
  try {
    // 检查accessToken是否有效
    if (!accessToken) {
      console.error('accessToken无效或不存在');
      return;
    }
    // 调用SDK获取好友列表接口
    let result = await Nim.friend.getFriendList({
      accid: userId, // 当前用户ID
    }, accessToken);
    
    console.log('好友列表', result);
    // 成果：成功获取好友列表，result将包含好友信息
    // 根据返回结果更新本地好友列表（如果需要）
  } catch (error) {
    console.error('获取好友列表失败', error);
    // 处理获取好友列表失败的情况，例如提示用户检查网络或重新尝试
  }
}
// 调用获取好友列表函数（这里只需要当前用户ID）
getFriendList('currentUser');
// 调用getFriendList函数后，将尝试获取当前用户的好友列表，并处理结果

4. Función de chat

A continuación, implementaremos las capacidades principales del chat, que implican múltiples pasos, como enviar mensajes, recibir mensajes y mostrar mensajes.

1. Envía un mensaje de texto:

// 发送文本消息函数
async function sendTextMessage(toAccid, content) {
  try {
    // 从本地存储中获取accessToken
    let accessToken = uni.getStorageSync('accessToken');
    
    // 检查accessToken是否有效
    if (!accessToken) {
      console.error('accessToken无效或不存在');
      return;
    }
    // 调用SDK发送文本消息接口
    let result = await Nim.message.sendText({
      toSessionType: Nim.SESSION_TYPE_SINGLE, // 会话类型：单人会话
      toAccid: toAccid, // 目标用户ID
      msgBody: {
        text: content // 消息内容
      }
    }, accessToken);
    
    console.log('发送文本消息结果', result);
    // 成果：如果成功，result将包含发送消息操作的响应信息
  } catch (error) {
    console.error('发送文本消息失败', error);
    // 处理发送文本消息失败的情况，例如提示用户检查网络或重新发送消息
  }
}
// 调用发送文本消息函数（这里只是示例，实际开发中你需要从用户输入或其他界面元素获取toAccid和content）
sendTextMessage('receiverAccid', 'Hello, this is a test message.');
// 调用sendTextMessage函数后，将尝试向指定用户发送文本消息，并处理结果

2. Recibir mensajes

La recepción de mensajes generalmente se logra escuchando los eventos proporcionados por el SDK. A continuación se muestra un ejemplo de cómo escuchar eventos de mensajes de texto:

// 监听文本消息事件
Nim.message.on(Nim.EVENT.NEW_MSG, function(msg) { 
 if (msg.sessionType === Nim.SESSION_TYPE_SINGLE 
                                   

                    上一篇
                    下一篇