Система чата, реализованная Vue, доступна онлайн.

Vue.js

В последнее время были улучшены функции системы чата, а затем реализована функция управления фоном. После некоторой самостоятельной отладки ошибок не так много, и они развертываются на сервере ночью.

repo

Если вы обнаружите какие-либо проблемы в использовании, я надеюсь, что ценный совет йо. Добро пожаловать, чтобы оставить ваши ценные комментарии.

Уведомление:

  1. Загрузка файлов еще не завершена.
  2. Использование, связанное с webRTC, может быть нестабильным.
  3. Рекомендовать ссылку друзей со многими кругами друзей:со-сообщение R. Пока горячо. Только 9 из /#/user/5's…
  4. Из-за недостаточной оптимизации кода и сервера водопровода первый доступ может быть медленным, наберитесь терпения.
  5. Пожалуйста, дайте мне знать, если вы обнаружите какие-либо проблемы.

Предыдущий контент:

1. Функции

  1. Общение с друзьями, вопросы в службу поддержки, изображения, смайлики, аудио- и видеозвонки и доски (для реализации WebRTC).
  2. поддержка друзейПримечания, функция группировки, группы можно добавлять, изменять и удалять.
  3. Поддержка обмена сообщениями между друзьямипрочитать напоминание о статусе, вы можете мгновенно узнать, прочитал ли другой абонент сообщение.
  4. Статистика онлайн-друзей, в каждомгруппировкаможно просмотреть текущийКоличество онлайн-друзейи выделить аватары онлайн-друзей.
  5. Групповой чат, групповой чат в настоящее время поддерживает только форму текста, изображений и выражений, а в настоящее время сообщения группового чата не поддерживают напоминания о прочтении (последующие улучшения).
  6. Space, как и Qzone, можетПубликуйте свои посты, проверяйте посты друзей.
  7. Динамическое редактирование, который поддерживаетудалить, редактироватьоперация.
  8. Динамическое взаимодействие, поддержкаНравится, комментируйте, отвечайте на комментарииФункция.
  9. Добавление друзей и добавление групповых чатов требует согласия другой стороны после их добавления.
  10. Управление расписанием, поддерживает функции создания и удаления расписаний.
  11. Фоновое управление: самостоятельный проект, реализованный с помощью React.
  12. Мы приветствуем более подробные функции после того, как я разверну код онлайн в ближайшие несколько дней.

2. Стек технологий

Vue, Vuex, Element-UI, React, axios, sass, ES6, WebSocket, Node и т. д.

3. Трудности

  1. Разделение различных компонентов, файловая структура проекта.
  2. Измените группы пользователей, и пользовательский интерфейс сразу же отреагирует на группировку.
  3. После получения сеанса выполняется логика обработки для получения последнего сообщения каждого сеанса.
  4. Подключитесь к облаку Qiniu, чтобы реализовать загрузку изображений.
  5. Технология вебRTC.
  6. Мгновенные напоминания о получении сообщений и количестве непрочитанных сообщений.
  7. Настройки напоминания о прочтении сообщения.
  8. После выхода пользователя из системы внутренняя информация для входа немедленно очищается.
  9. Пространственная динамика комментариев и ответов Комментарии. Реализация.
  10. В ответ на операцию, выполняемую между различными компонентами страницы.

Скриншот проекта

Сторона ПК

1. Домашняя страница

2. Чат

3. Круг друзей

4. Настройки темы

5. Расписание

6. Персональный центр

мобильный

1. Войти

2. Список чатов

3. Интерфейс чата

4. Предварительный просмотр изображения

5, корки

6. Круг друзей

За проектом я буду следить в последнее время, пока не будет реализована относительно полная система чата, а затем я оптимизирую и обновлю ее позже. адрес проекта:github.com/CCZX/wechatПриветствуем ваши ценные комментарии, если вы можетеPRилиissuesдаже лучше. Если вы считаете, что проект все еще в порядке, пожалуйста, оставьте свойstar✨Бар 🌹.