Wechat Wecat

WeCat

представлять

• Проект мгновенного чата на основе Vue.js Family Bucket + WebSocket + Node.js + Koa2 + MongoDB
• Функциональная часть относится к WeChat с добавлением некоторых интересных функций. Комментарии к коду проекта очень подробные, и это хороший полноценный вводный проект для изучения Vue, Node.js и koa.
• Фронтенд и развертывание проекта выполняются самостоятельно. Если есть какие-либо несовершенства в различных взаимодействиях и различных функциях бизнес-логики, смело их поднимайте.

Отображение проекта

1. Войдите в систему

2. Зарегистрируйтесь

3. Получить пароль

4. Регистрация прошла успешно, выберите аватарку

5. Основная панель

6. Добавьте друзей

7. Панель информации о друзьях

8. Отправляйте сообщения и файлы

9. Многофункциональная панель отправки смайлов

10. Меню персонализированных настроек.

11. Страница администратора, информация о пользователе.

12. Запросить все записи чата

13. Подробности истории чата

14. Документация по API

Структура каталогов

1. сервер это сервер
2. public — это статический файл
3. db — это экспортная резервная копия MongoDB.
4. src — папка проекта

Руководство по установке

1. Клонируйте проект git clone https://github.com/imzusheng/Wecat.git
2. Корневой каталог проекта cd, установка зависимостей npm install
3. Запустить службу npm run serve
4. cd ./server, а затем установите зависимости сервера npm install
5. Импортируйте базу данных mongorestore -d wecat ./db
6. Запустите сервер npm run dev

Тестовый аккаунт

идентификатор пользователя: [email protected]
пароль: a123456

TODO

• Авторизоваться
• Предотвращение дублирования входов в систему
• Время последнего входа в систему
• Место последнего входа в систему (провинция-город-район)
• Зарегистрироваться (подтверждение электронной почты)
• Получить пароль (подтверждение электронной почты)
• Выберите аватар пользователя
• выход
• Одноранговый чат с друзьями
• Соединение WS Heartbeat и повторное соединение при отключении
• Подсказки для друзей онлайн и оффлайн
• Добавляйте друзей и проверяйте запросы на добавление в друзья
• Уведомление о запросе на добавление в друзья
• Напоминание о непрочитанном сообщении
• Поиск пользователей
• Персонализированная конфигурация пользователя
• Ленивая загрузка истории чата
• Статус ввода друга обновляется в режиме реального времени
• В заголовке сайта отображается количество непрочитанных сообщений в режиме реального времени.
• Друзья, с которыми вы недавно общались, закреплены вверху.
• Серверное управление
• Загрузка изображения чата и файла (многократная загрузка)
• Предварительный просмотр и загрузка изображений и файлов чата
• групповой чат
• Карточка профиля пользователя
• удалить друга
• Создать группу
• Информационная карточка группы
• Присоединяйтесь к группе
• Покинуть группу

Сопутствующий стек технологий

• ВуэКли 3
• Вуэкс
• Node.js
• Элемент-UI
• аксиомы
• МонгоБД
• коа2
• Вебсокеты
• WS

Примечания и резюме

• Загрузка нескольких файлов по частям
• Развертывается в некорневом каталоге веб-сайта в режиме истории маршрутизатора Vue.
• Мониторинг клавиатуры js реализует комбинацию клавиш Ctrl + Enter для отправки сообщений
• Используйте модуль ES6 для инкапсуляции собственного сервиса Websocket.

о

• Электронная почта [email protected]
• Адрес проекта
• Обо мне
• github
• гити