Tyloo Chat

Tyloo-chat (모방 wechat)

온라인 액세스 주소는 일시적으로 닫힙니다

설명

이 프로젝트 포크는 General-Chat에서 최적화되고 업그레이드되었습니다. 오픈 소스 아이디어에 대해 Boss Genal 에게 감사합니다!

여전히 최적화 할 시간이므로 계속 지켜봐 주시기 바랍니다 !!!

꽤 좋다고 생각되면 별을 클릭하여 격려하십시오 !!!

Electron 버전 클라이언트가 출시되었으며 자세한 내용은 릴리스를 참조하십시오.

일부 기능의 스크린 샷

• 전체 인터페이스

• 콘택트 렌즈

• 그룹 채팅 기능 (그룹 회원 목록, 온라인 상태, 그룹 구성원 추가 지원)
• 세션 목록 (상단/삭제)

• 메시지 퇴치 기능

Electron 버전 클라이언트 (Electron_Version 브랜치에 위치)

• Windows 버전 (exe)

• Mac 버전 (DMG)

특징

• 사용자 로그인 등록 (타사 시스템에 포함 된 단일 로그인 지원)
  • 단일 로그인 주소, 로그인 후 오른쪽 상단의 온라인 통신 버튼을 클릭합니다.
• 그룹 채팅 (QQ 그룹과 유사)
  • 친구를 초대하여 그룹 채팅에 참여하십시오
  • 그룹 이름/그룹 발표를 수정하십시오
• 친구 기능
• 연락처서 기능 (제 3 자 시스템 조직 구조에 대한 액세스 지원 및 직접 채팅을 시작합니다)
• 채팅 기능
  • 이모티콘 이모티콘 팩
  • 이미지 보내기/사진 미리보기
  • 첨부 파일을 보냅니다
  • 메시지 페이지 매김
  • 메시지 reptraction/copy
• 맞춤 테마
• 세션 상단/삭제
• 알림을 다시 연결하십시오
• Smart Assistant (기본 지점에있는 기본값, ES 검색 엔진을 사용하여 ES 동의어 사전의 수동 생성이 필요합니다)
• 타사 API 로봇 (feature_apirobot 지점에 위치한 현재 온라인 데모 버전)
• 전자 버전 (Electron_version Branch에 위치하여 DMG 및 EXE 클라이언트 생성을 지원합니다)

기술 스택

• 프론트 엔드

  • Vue Cli 4.x
  • vue를위한 Antd

• 후단

  • Nestjs
  • Typeorm
  • MySQL

• socket.io

• Elasticsearch ES 검색 엔진 (빠르고 자동 응답을위한 로봇에 사용)

• Nodejieba 노드 버전 중국어 단어 세그먼트

데이터베이스 테이블 구조 설계

환경 준비

• MySQL
• 채팅 데이터베이스 (수동으로 만들어야합니다. 데이터베이스 인코딩 형식은 utf8bm64``utf8bm64``utf8bm64 입니다 !!! )
• 노드 v10.16.3

코드를 가져올 때 주목해야 할 사항

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

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

프로젝트를 실행하십시오

 // client
cd client 
cnpm i
npm start 

 // server
cd server
cnpm i
npm run start 

배포하는 방법

배포

Centos 아래에 채팅방을 배치하십시오

타사 통합/단일 로그인

• 다음 점프 코드는 타사 시스템에 포함되며 userId 및 username 매개 변수가 필요합니다.

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

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

• 채팅방은 매개 변수를 얻고 로그인을 자동으로 완료합니다 (처음 로그인 한 경우 계정을 자동으로 등록합니다).

• 채팅방 클라이언트 VUE_APP_ORG_URL 설정하여 타사 시스템의 조직 구조의 인터페이스 주소를 얻으려면

  • vue_app_org_url을 설정하십시오

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

  • 연락처 인터페이스로 전환하여 요청을 자동으로 발행하십시오

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

  • 반환 값 형식은 다음과 같습니다

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

  • 타사 조직 구조를 통합 할 필요가 없다면 VUE_APP_ORG_URL 명확하게하고 다른 상황에서 직접 사용자 정의하고 수정하십시오.

아이디어 개요

WebSocket 설립 프로세스

TODO

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

커뮤니케이션 그룹