Бесплатный онлайн-чат для сайта на JS?

Question

[Sanvi]

Привет, подскажите скрипт бесплатного онлайн чата для сайта? Я планирую его интегрировать с crm.

Comments

[Владислав Лысков]

На гитхабе же их полно
Выбирай любой

[Михаил Р.]

Владислав Лысков, например? поделитесь ссылочками, что на Ваш взгляд заслуживает внимания

[Владислав Лысков]

Михаил Р., я не скину ничего определённого
всё зависит от языка, который нужен и хоть каких-либо стартовых требований, кроме того, что это "чат для сайта"

[Михаил Р.]

Владислав Лысков,

кроме того, что это "чат для сайта"

Очевидно, что это будет js, т.к. выполнение идет в браузере. Не думаю, что Вы найдете wasm вариант :)

[Владислав Лысков]

Михаил Р., на бэке что-то должно быть?

[Михаил Р.]

Владислав Лысков, и с бэком и без, интересно глянуть на оба

[Владислав Лысков]

Михаил Р.,
https://github.com/socketio/socket.io/tree/main/ex...
застилить под дизайн сайт сайта и вперед

[Михаил Р.]

Владислав Лысков, но это не чат сайта, это библиотека, которая предоставляет абстракцию над веб-сокетами. а мне интересно уже готовое решение именно "онлайн-чат" для сайта.

Answer 1

[Михаил Р.]

https://www.chatwoot.com/
https://github.com/chatwoot/chatwoot

Self-hosted, десктоп/мобильное приложение, интеграции, боты, бесплатно!

Comments

[My1Name]

Sanvi поделитесь впечатлениями от использования готовых решений. А то я сам пишу... Простенький чат, а кода много получается.

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

[Михаил Р.]

My1Name,

поделитесь впечатлениями от использования готовых решений. А то я сам пишу... Простенький чат, а кода много получается.

В целом, все как и везде:
- Платное - все готово, ну или почти все, только плати.
- Бесплатное - меньше выбора, все ставить самому, интегрировать и поддерживать, зато, бесплатно.

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

Платные да, с бесплатными сложнее. Хотя, мой пример в ответе - поддерживает этот вариант, он кладет куку в браузер, и если клиент возвращается не позже времени жизни куки - подтягивается старая история чата.

[My1Name]

Михаил Р., Спасибо. Я о куки как-то и не подумал... Я подтягиваю историю через сервер, при выборе пользователя - событие load. А как с куки такое проделать, на голом js - мне даже трудно представить.

[Михаил Р.]

My1Name,

Я о куки как-то и не подумал

Так это основной вариант "помнить" пользователя. Когда он авторизуется и уйдет с сайта, а затем вернется - как его вспомнить безопасным методом? Аналогично и с чатом. Вы же не хотите, чтобы за Вашей, например, интим-беседой наблюдало пол района? ;) Еще конечно есть всякие jwt авторизации, но это как по мне - сложнее для пользователя, который простой зашел на сайт спросить "почем кирпич".

Я подтягиваю историю через сервер, при выборе пользователя - событие load

Не понял, о чем речь. Пояснительную бригаду плиз.

как с куки такое проделать, на голом js - мне даже трудно представить.

Голый js может поставить куку, для этого он шлет запрос на сервер, что такой то тип зашел на сайт, если сервер его узнает, то он вернет js куку, который тот поставит в браузер.

[My1Name]

Так это основной вариант "помнить" пользователя

А если у пользователя, скажем 30 чатов с разными людьми; как такую инфу запихнуть в куки?

Не понял, о чем речь

- Через WebSocket connection подтягиваются данные. И я как-раз сейчас думаю (точней ищу информацию), как идентифицировать сокет клиента, чтоб не проверять у всех message = event.data; ? - Я не хочу, чтоб за интим-беседой наблюдало пол района :)

[Михаил Р.]

My1Name,

А если у пользователя, скажем 30 чатов с разными людьми; как такую инфу запихнуть в куки?

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

Через WebSocket connection подтягиваются данные. И я как-раз сейчас думаю (точней ищу информацию), как идентифицировать сокет клиента, чтоб не проверять у всех

Если уже используются куки, то при установлении WebSocket-соединения эти куки будут также отправлены серверу.

Я не хочу, чтоб за интим-беседой наблюдало пол района :)

Кстати, интересный бизнес-план, можно платиновым подписчикам давать больше возможностей :)))

[My1Name]

Михаил Р.,

По куке сервер понимает

- Сам чат (обёртка) является частью frontend, и я пока что пишу именно "представление"... О куки не думал (забыл), потому что пишу под Spring проект. В спринге они занимают ровно одну строчку кода

setCacheControl(CacheControl.maxAge(100, TimeUnit.MILLISECONDS));

а на данный момент у меня стоит setCachePeriod(0); Я запускаю сервер и постоянно обновляю страницу в браузере, пока делаю разметку в notepad++ и пишу скрипты в блокноте.txt :) Как работают куки в Spring-е на практике - не знаю. Для этого (для практики) собственно говоря и пишу (соц. сеть) :D Ну, и так как чат уже почти написан, а мои знания javaScript (jQuery) поверхностные, думаю нужно выложить его куда-то (без соединений с сервером, но с комментариями типа - "request тута"), чтоб все желающие могли "попробовать код", а более опытные доработать...

[Михаил Р.]

My1Name,

Я запускаю сервер и постоянно обновляю страницу в браузере, пока делаю разметку в notepad++ и пишу скрипты в блокноте.txt :)

Раз Вы все равно пишите на Java, то может стоит перенести это садомазо из notepad и блокнота в какую нить более подходящую IDE? Ну hotreaload подключить тоже не помешает.

Как работают куки в Spring-е на практике - не знаю.

Разумеется со своими особенностями, но в целом - как и в любом другом серверном ЯП.

чтоб все желающие могли "попробовать код", а более опытные доработать

Да, это будет отличный вариант по рефакторингу.

[My1Name]

Михаил Р.,

перенести это садомазо из notepad и блокнота в какую нить более подходящую IDE?

- Мне так удобно. Получается три легковесных окна, абсолютно разные на вид (для глаза), между которыми можно быстро переключаться. В блокноте немного неудобно из-за отсутствия подсказок, но в целом так удобно (хардкодить)).

это будет отличный вариант по рефакторингу

- я тоже так думаю. Тем более я взял за основу Bootstrap (glyphicon) и CKEDITOR 4. Всё просто и понятно. Поэтому и хочу выложить код для допиливания или "перепиливания" в таком формате :)

Answer 2

[My1Name]

Прототип чата (JavaScript & jQuery) на основе Bootstrap и CKEDITOR 4. Ориентирован на работу с сервером ̶S̶p̶r̶i̶n̶g̶ (как в соц. сетях или сайтах знакомств) с приватной перепиской. download

Comments

[My1Name]

p.s. Михаил Р. критика, рекомендации и правки приветствуются.