Реализовать чат на html без серверной стороны конечно не возможно. Но не обязательно для каждого чата писать chat server самому, можно воспользоватся готовым решением. И не смотря на то что это казалось бы очевидно набирается почти 800 запросов "html chat" в месяц и это только к яндексу.

В конце статьи прилагается файл на javascript реализующий простой чат, его достаточно вставить в html код страницы, и чат готов. Вся серверная сторона уже реализована.

Готовый движок чата на JavaScript для любого сайта.

Как говорилось выше реализовать html чат без серверной части работать не будет. Для работы чата требуется комет сервер который будет отправлять push уведомления всем участникам чата. Но для этого чата комет сервер предоставляется бесплатно, вам даже регистрироваться там не обязательно. В таком случаи чат будет общий для всех сайтов которые его вставят. Это даже не плохо, особенно для сайтов с небольшой посещаемостью. А те кто хотят иметь чат только для своего сайта или своей группы сайтов должны зарегистрироваться и получить идентификатор разработчика на comet-server.com а затем его указать в коде инициализации чата ( вместо dev_id: 3 указать свой полученный id).

Встраиваем чат в html вашего сайта.

В HTML код вставляем вот такой скрипт.

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" ></script>
 <script type="text/javascript" src="https://comet-server.com/CometServerApi.js" ></script>
 <script type="text/javascript" src="https://comet-server.com/doc/html_chat.js" ></script>

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

 <div id="html-chat"></div>
 <style>
   /* Здесь настроим css стили для чата*/

.holder-html-chat{ border: 1px solid #ccc;padding:10px; }
.html-chat-history{ max-width: 600px;overflow: auto;max-height: 900px; }
.html-chat-js-name{ margin-top:10px; }
.html-chat-js-input{ max-width: 600px;max-height: 100px;width: 600px;margin-top:10px; }
.html-chat-js-button-holder{ margin-bottom: 0px;margin-top: 10px; }
.html-chat-js-button-holder input{ width: 220px; }
.html-chat-js-answer{ float:right; }

 </style>

 <script>

   // Запуск api комет сервера
   CometServer().start({dev_id: 3 }) // Идентификатор разработчика на comet-server.com

   // Запуск чата. Передаём ему элемент в котором надо создать окно чата.
   htmljs_Chat_Init( $("#html-chat") )
 </script>

Скачать ajax chat бесплатно

Вы можете скачать исходники чата и модифицировать их под себя. Подробная статья с разбором работы чата

Живой пример работы чата