Проект

Микрочат — это веб-версия чата, разработанная на основе разделения передней и задней частей с использованием SpringBoot + Vue.

Для обеспечения безопасности используется Spring Security, который отвечает за шифрование паролей, их хранение и логику входа и выхода. Обмен сообщениями осуществляется через WebSocket + Socket.js + Stomp.js. Для хранения файлов используется FastDFS. Данные экспортируются с помощью EasyExcel. Отображение диалоговых окон и таблиц данных реализовано с помощью Vue.js в сочетании с Element UI. Дизайн всего интерфейса системы выполнен с применением MyBatis и MySQL. Наконец, для развёртывания проекта с разделением передней и задней части используется Nginx.

Функции: групповые и личные чаты, отправка электронной почты, отправка эмодзи и изображений, управление пользователями, администрирование групповых чатов, экспорт данных в Excel.

Адрес предварительного просмотра проекта: http://www.javahai.top/index.html

Исходный код переднего плана: https://github.com/JustCoding-Hai/subtlechat-vue

Исходный код заднего плана: https://github.com/JustCoding-Hai/subtlechat

Упрощённая версия заднего плана (без использования RabbitMQ и Redis): https://github.com/JustCoding-Hai/subtlechat-mini

Технологический стек проекта

Задний план

1. Spring Boot.
2. Spring Security.
3. MyBatis.
4. MySQL.
5. WebSocket.
6. RabbitMQ.
7. Redis.

Передний план

1. Vue.
2. ElementUI.
3. axios.
4. vue-router.
5. Vuex.
6. WebSocket.
7. vue-cli4 и др.

Графические материалы проекта

Интерфейс клиента: главный экран группового чата

Интерфейс клиента: личный чат

Административный интерфейс: управление пользователями

Административный интерфейс: администрирование групповых чатов

Процесс развёртывания

1. Клонируйте проект на локальный компьютер.
2. Создайте пустую базу данных subtlechat в локальной MySQL и запустите предоставленный скрипт базы данных subtlechat.sql для создания таблиц и импорта данных.
3. Подготовьте Redis заранее. В файле application.yml модуля mail в проекте измените конфигурацию на свою.
4. Подготовьте RabbitMQ заранее. В файлах application.yml и application-dev.properties модулей mail и web в проекте соответственно измените конфигурацию на свою.
5. Зарегистрируйте код авторизации электронной почты. Вставьте его в файл application.yml в модуле mail.

6. Настройте сервер fastdfs. Измените файл fastdfs-client.properties в соответствии со своими настройками.

7. Откройте проект subtlechat в IntelliJ IDEA и запустите модули mail и web. Сначала запустите модуль mail, затем — web.

8. Запустите проект Vue.

Документация

Пожалуйста, посетите wiki проекта для получения дополнительной информации. Документация проекта

Заключение

Если у вас есть вопросы или комментарии, пожалуйста, свяжитесь со мной по QQ: 1912737955. Буду рад обсудить!

Если этот проект был вам полезен, прошу поставить звёздочку!