Tyloo Chat

Tyloo-chat (imitation WeChat)

L'adresse d'accès en ligne est temporairement fermée

illustrer

Cette fourche de projet a été optimisée et mise à niveau à partir du chat général. Merci au boss Genal pour ses idées open source!

Il est encore temps de continuer à optimiser, alors restez à l'écoute !!!

Si vous pensez que c'est plutôt bien, cliquez sur Star pour l'encourager !!!

Electron Version Client a été publié, voir version pour plus de détails

Captures d'écran de certaines fonctions

• Interface globale

• Contacts

• Fonction de chat de groupe (liste des membres du groupe, statut en ligne, support pour l'ajout de membres du groupe)
• Liste des sessions (top / supprimer)

• Fonction de rétraction des messages

Client de la version électronique (située dans la succursale Electron_version)

• Version Windows (EXE)

• Version Mac (DMG)

Fonctionnalité

• Enregistrement de la connexion de l'utilisateur (prend en charge la connexion unique intégrée dans des systèmes tiers)
  • Adresse de connexion unique, cliquez sur le bouton de communication en ligne dans le coin supérieur droit après avoir enregistré
• Chat de groupe (similaire à QQ Group)
  • Invitez des amis à rejoindre le chat de groupe
  • Modifier le nom du groupe / annonce de groupe
• Fonctionne les amis
• Fonction du livre de contact (prend en charge l'accès à la structure organisationnelle du système tiers et initie directement le chat)
• Fonction de chat
  • Emoji Emoji Pack
  • Aperçu d'image / aperçu de l'image
  • Envoyer des pièces jointes
  • Pagination de message
  • Rétraction / copie de messages
• Thème personnalisé
• Session Top / Supprimer
• RECONDITION DE RECONNEX
• Assistant intelligent (par défaut, situé dans la branche principale, en utilisant le moteur de recherche ES nécessite une création manuelle du thésaurus ES)
• Robot API tiers (version de démonstration en ligne actuelle, située dans la succursale de fonctionnalité_apirobot)
• Version électronique (située dans la succursale Electron_version, prend en charge la génération de clients DMG et EXE)

Pile technologique

• l'extrémité avant

  • Vue CLI 4.x
  • Antd pour Vue

• extrémité arrière

  • Nichés
  • Type temporel
  • Mysql

• Socket.io

• Moteur de recherche Elasticsearch ES (utilisé pour les robots pour des réponses rapides et automatiques)

• Version de nœud nodejieba segmentant de mots chinois

Conception de la structure de la table de base de données

Préparation environnementale

• mysql
• Base de données de chat (doit être créée manuellement, veuillez noter que le format de codage de base de données est utf8bm64``utf8bm64``utf8bm64 !!! )
• Node V10.16.3

Choses à noter lors de la tir du code

 // windows系统需要配置一下,提交时转换为LF，检出时不转换
git config --global core.autocrlf input

 // 设置为区分大小写
git config core.ignorecase false

Exécuter le projet

 // client
cd client 
cnpm i
npm start 

 // server
cd server
cnpm i
npm run start 

Comment déployer

Déployer

Déploier des salles de chat sous CentOS

Intégration tierce / connexion unique

• Le code de saut suivant est intégré dans le système tiers, et userId et username sont nécessaires.

 let chatUrl // 当前聊天室客户端地址
let userId // 当前系统用户userId
let username // 当前系统用户昵称

window . open ( ` ${ chatUrl } ?userId= ${ userId } &username= ${ username } ` ) ;

• La salle de chat obtient des paramètres et termine automatiquement la connexion (si c'est la première fois que vous vous connectez, vous enregistrerez automatiquement un compte)

• Définissez le client de salle de chat VUE_APP_ORG_URL pour obtenir l'adresse d'interface de la structure organisationnelle du système tiers

  • Définir Vue_App_org_url

   // .env.xxx
  // 此接口可以获取到第三方系统的所有部门和人员信息,注意为嵌套tree结构
  VUE_APP_ORG_URL = http : / / 127.0 .0 .1 : 8080 / api / getDeptUsersTree

  • Passez à l'interface de contact pour émettre automatiquement les demandes

   // Contact.vue
  axios . post ( process . env . VUE_APP_ORG_URL ) . then ( ( res ) => {
      this . organizationArr = res . data . data ;
  } ) ;

  • Le format de valeur de retour est le suivant

   interface node {
      id: string ; // id
      label: string ; // 名称
      flag: boolean ; // 是否有下级结点
      children: node [ ] ; // 下级结点
  }

  • Si vous n'avez pas besoin d'intégrer la structure organisationnelle tierce, effacez simplement VUE_APP_ORG_URL , et personnalisez-le et le modifiez-le vous-même dans d'autres situations.

Aperçu des idées

Processus d'établissement de WebSocket

FAIRE

• @功能实现
• 消息转发
• 代码性能优化
• 群聊功能继续完善
• 微信快捷登陆
• Electron客户端检查更新

Groupe de communication