---
title: Tailchat —— 插件化的开源聊天平台
description: Tailchat 是一款易拓展、方便使用，并且完全免费开源的聊天平台
authors: moonrailgun
slug: intro
image: /img/logo.svg
keywords:
  - tailchat
  - 介绍
  - 开源
  - 开源聊天工具
tags: [介绍]
---

## 前言 First of all

大家好，我是[moonrailgun](https://github.com/moonrailgun)，今天为大家介绍的是我个人开发的开源插件式聊天软件: [Tailchat](https://github.com/msgbyte/tailchat)

Tailchat 是一款易拓展、方便使用，并且完全免费开源的聊天平台。在部分思想上借鉴了 [Discord](https://discord.com/) 并在此致敬！


## 动机 Motivation

曾经痴迷于 TRPG, 并花了4年的业余时间做了人生第一款聊天软件 [TRPG Engine](https://github.com/TRPGEngine/Client)。但是受限于题材方面的问题，使用的人虽然一直有，但是并没有太多。

而且因为开发之初受到经验的限制，虽然当初经过了很多次重构，但是仍然背负上了很多的技术债务。而且因为当初没有做好分布式架构的设计，因此在面对实际的单机业务性能瓶颈时也没有非常好的解决方案，导致在高峰期只能让用户处于相对慢的系统响应中。

因此我将在 [TRPG Engine](https://github.com/TRPGEngine/Client) 的开发中遇到的问题收集起来，并重新整理了我的业务需求，开发出了新的继承者 [Tailchat](https://github.com/msgbyte/tailchat)。

因为最开始首先于小众的业务, [Tailchat](https://github.com/msgbyte/tailchat) 的设计之初就做好了易于拓展的准备。定位是除了核心的聊天场景以外，其他的业务需要都是由插件提供的。甚至是聊天的富文本渲染方式、消息的通知也是由插件提供的。作为使用者/开发者，能够方便得为 [Tailchat](https://github.com/msgbyte/tailchat) 拓展新的能力，或者将已有的能力集成到 [Tailchat](https://github.com/msgbyte/tailchat) 中

[Tailchat](https://github.com/msgbyte/tailchat) 名字来源于其logo，是两只猫尾巴纠缠在一起的形象，表示猫与猫之间最直接的沟通方式。

## 功能 Feature

### 登录页

![](/img/blog/intro/1.png)

登录页除了支持正常的 **登录**、**注册**，为降低使用门槛还允许先进行 **游客访问**，无需注册直接使用。同时还支持 **忘记密码** 功能。向通过用户发送邮件来帮助用户重置密码

> **NOTICE**: 忘记密码功能需要管理员配置SMTP服务

此处以访客为例，创建一个名为 `猫之使徒` 的访客:

![](/img/blog/intro/2.png)


进入主页面后如下显示:
![](/img/blog/intro/3.png)

可以通过点击最上面的认领账号来补充用户信息以方便下次登录

### 添加好友

切换到 `添加好友` 标签页，可以看到系统为您生成的4位唯一标识:

![](/img/blog/intro/4.png)

在本例中的唯一标识是`猫之使徒#1216`，您可以通过将这段字符串发送给好友来添加好友。

![](/img/blog/intro/5.png)

### 插件中心

[Tailchat](https://github.com/msgbyte/tailchat) 设计之初就提供了强大的插件系统，通过插件系统能极大拓展[Tailchat](https://github.com/msgbyte/tailchat)自身的能力。

![](/img/blog/intro/6.png)

> NOTICE: 插件本身设计是运行在 可信执行环境(TEE) 中, 请不要随意通过手动安装的方式安装不明来源的第三方插件

### 个人设置

![](/img/blog/intro/7.png)

用户可以在左下方的"···"中打开个人设置。可以自定义头像，修改名称，修改密码等操作。

![](/img/blog/intro/8.png)

通过剪裁工具可以很方便的选出自己想要的部分

![](/img/blog/intro/9.png)

### 系统设置

在系统设置中可以修改界面语言和界面主题。

主题除了 [Tailchat](https://github.com/msgbyte/tailchat) 自带的`暗色主题`和`亮色主题`以及根据当前系统设置自动切换的`自动`以外均为插件提供

![](/img/blog/intro/10.png)

> 目前 Tailchat 支持的语言仅为 `简体中文` 和 `英语`。欢迎有能力的开发者帮助 Tailchat 进行国际化翻译的工作

### 群组聊天

![](/img/blog/intro/11.png)

点击左上角导航栏的绿色加号即可创建群组

![](/img/blog/intro/12.png)

预设了两个布局模板，直接选择`默认群组`

![](/img/blog/intro/13.png)

随意取个名字，点击创建。系统则会创建一个群组并自动跳转到该群组

界面布局如下:

![](/img/blog/intro/14.png)

![](/img/blog/intro/15.png)

输入框支持 `@` 群组成员:

![](/img/blog/intro/16.png)

### 群组设置

点击左上角的标题栏可以点开群组详情页

![](/img/blog/intro/17.png)

点击查看详情可以进入到群组的详情页

![](/img/blog/intro/18.png)

在此处可以:
- 修改群组头像
- 修改群组名称
- 管理群组面板

#### 面板管理

![](/img/blog/intro/19.png)

创建面板可以直接创建一个面板，内置的面板类型有:
- 聊天频道
- 面板分组
- 网页面板

网页面板可以直接输入一个网址，可以将自己喜好的网址直接集成到 Tailchat 的群组侧边栏

![](/img/blog/intro/20.png)

比如我们插入一个访问 Bilibili 的网页面板，则效果如下:

![](/img/blog/intro/21.png)

![](/img/blog/intro/22.png)


> NOTICE: 因为浏览器的安全策略问题，如果当前 Tailchat 使用了https协议，那么只能支持嵌入 https 协议的网页

> NOTICE: 因为浏览器的安全策略问题，嵌入的网址需要允许被使用iframe嵌入

## 相关连接

开源地址:
- [https://github.com/msgbyte/tailchat](https://github.com/msgbyte/tailchat)
- [https://github.com/msgbyte/tailchat-server](https://github.com/msgbyte/tailchat-server)
