Простой чат на php

Дата публикации: 2018-12-21

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

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

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

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

Ну а если подумать — что собой представляет чат? По сути — это приложение, которое состоит из двух частей. Первая — это пользовательская, которая доступна пользователям, а вторая серверная, которая обрабатывает полученную информацию и отправляет ответы в предыдущую посредством сокетов.

Сокеты поддерживаются многими языками программирования, а значит, серверную часть можно написать на одном из них. Поэтому я хотел бы предложить вам посмотреть, как же можно реализовать чат, в котором на стороне сервера будет использоваться PHP скрипт. Мы с вами напишем простой чат, используя язык PHP.

На PHP мы реализуем только серверную часть, так как на стороне клиента будет использован все тот же JavaScript.

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

Таким образом, по итогам текущего урока на клиентской стороне будет отправлен запрос на подключение, а со стороны сервера данный запрос будет принят, обработан и отправлен успешный ответ.

Хотите изучить ООП PHP?

Посмотрите видео по объектно-ориентированному программированию на PHP (ООП PHP)!

Здравствуйте, уважаемые читатели блога LifeExample, в этой статье я хотел бы привести пример скрипта реализующего простой чат на php. Это простой скрипт чата сделан на основе PHP и JavaScript, с использованием OOP и AJAX.

Для работы с этим скриптом чата на php не нужна база данных.

Скрипт работает с текстовыми файлами, сохраненными на сервере, поэтому очень быстрый и не занимает много ресурсов сервера. Пользователь может добавить в чат смайлы и применять форматирование шрифтов текстовых сообщений: "жирный", "курсив", "подчеркивание". Имеется поддержка смайлов.

В чате имеется поддержка никнеймов, разделение по комнатам, настройки ВКЛ/ВЫКЛ для звукового сигнала сохраняются в cookies (на один день). Поэтому, при следующем визите их можно прочитать и воспользоваться с помощью файлов cookie. Скрипт был успешно протестирован на Mozilla Firefox, Internet Explorer, Google Chrome и Opera.

Минимальные требования для нашего чата на PHP следующие:

• PHP 5+
• Браузер с подключенным JavaScript (желательно с поддержкой для CSS3).

Как установить чат на PHP

После распаковки архива script_chat_simple.zip , скопируйте на сервер файл chat.php , папки: chatfiles, chattxt и chatex (со всеми файлами, в ту же самую директорию, в которой у вас находится файл, куда вы хотите включить чат). Файл test.php для теста.

Установите разрешения на чтение — запись — распаковку на директорию chattxt, CHMOD 0777 (или 0755). В этой директории PHP сохранит TXT файлы с чатом для каждой комнаты чата.

Добавьте следующий код в PHP файл, в который вы хотите включить этот скрипт чата:

Для надлежащей работы HTML страницы, возьмите эту строку кода (для CSS свойств) сначала файла chat.php:

Затем перенесите его в основной раздел страницы, куда вы вставили скрипт.

Этот скрипт также можно вставить в ".html" файлы, с помощью тегов или (но на сервере должен запускаться PHP). Поэтому для того чтобы добавить скрипт чата в ".html" файл (блог, форум), используйте один из следующих кодов:

dir/chat.php — путь к директории или файлу, где находится ваш скрипт. Если в той же папке, напишите только "chat.php".

Админские настройки

В файле setchat.php (в chatfiles/ директория) вы можете изменить настройки чата на php по умолчанию.

По умолчанию скрипт сохраняет и показывает последние 30 строк чата. Вы можете изменить этот номер в строке кода:

С помощью этого скрипта пользователи могут добавлять ссылки в чат (с атрибутом rel="nofollow"), но, если вы хотите удалить эту опцию, замените 1 на 0 в строке кода:

В следующей строке кода вы можете установить пароль, который вы будете использовать для очистки истории чата (замените "adminpass" на желаемый вами пароль):

Для очистки истории чата обратитесь через браузерер в файл chatfiles/setchat.php с ?mod=admin в URL-ле. Например:

Затем выберите историю чата на php, которую вы хотите удалить и введите пароль установленный в директиве CADMPASS.

Если у вас на сайте установлен скрипт регистрации и авторизации и вы хотите чтобы функция чата была доступна только зарегистрированным пользователям, установите константу CHATADD в значение 0. Затем установите $_SESSION[‘username’] в сессию используемую вашим скриптом для удержания авторизированных пользователей на следующий код в "setchat.php".

В этом случае вам необходимо добавить session_start(); в начало PHP файла, по примеру файла "test.php".

Смена звуков для чата на PHP

В директории "chatex/" представлены два дополнительных WAV файла: beep2.wav и beep3.wav. По умолчанию в скрипте используется beep1.wav. Если вы хотите изменить звуковой файл, который проигрывается при добавлении нового текстового сообщения в чате, измените в файле chatfunctions.js (строка 13) значение переменной:

Первоначально в скрипте "Чат на PHP" содержится две чат комнаты: на английском языке и языке по умолчанию. Если вам нужна только одна чат комната удалите строку кода, которая содержит переменную $chatrooms[] после названия чат комнаты. Для изменения названия комнаты измените число соответствующих переменных.

Если вам нужно больше чат комнат добавьте переменные $chatrooms[] со следующим синтаксисом:

В этом скрипте, реализующим чат на PHP, предусмотрена функция автоматического создания текстовых файлов для каждой чат комнаты, но обязательно должно быть установлено разрешение на запись (CHMOD 0777, или 0755) в директории chattxt. Скрипт можно легко изменить для использования на других языках. Достаточно перевести текст в файле texts.php (в папке chatfiles/). Если вы хотите изменить цвет и дизайн чата, отредактируйте CSS свойства в chatstyle.css ( или chatstyle_mini.css, в мини версии), в папке chatfiles/. Файл chatstyle_mini.css может быть использован в целях экономии трафика пользователей чата.

На этом я завершаю обзор скрипта чата, надеюсь данная статья поможет вам создать чат на PHP. Приятной работы!

Читайте также похожие статьи:

Чтобы не пропустить публикацию следующей статьи подписывайтесь на рассылку по E-mail или RSS ленту блога.

Когда обычных комментариев становится недостаточно, приходит время создать чат.

С помощью чата пользователи общаются друг с другом, повышая интерес к сайту. Это важный элемент для вебинарных площадок, порталов со службой поддержки и страниц, где необходимо более живое, нефорумное общение. Гайд поможет на практике скомбинировать знания по HTML, JS, PHP и AJAX и создать готовый продукт.

Если знаний ещё недостаточно, обратите внимание на курс «Веб-разработчик c нуля до PRO».

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

Каким должен быть чат

Удобство для пользователей превыше всего. Позаботьтесь, чтобы чат соответствовал современным требованиям:

• сообщения отображаются корректно на всех устройствах;
• их загрузка и отправка происходят без обновления страницы;
• есть дополнительный контент — изображения, аудиосообщения, смайлики, стикеры и прочее.

Каркас чата на HTML

В первую очередь создаём форму отправки и контейнер для отображения сообщений:

Задаём стили

Первый этап пройден:

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

Основная часть чата
на JS + PHP

Сообщения будут отправляться и загружаться с помощью AJAX. На JavaScript пишем функции работы с интерфейсом и связи с серверной частью, а на PHP — методы обработки полученных данных и взаимодействия с базой данных.

Создаем переменные на JS

Создаем функцию для запросов

Она получает переменную act, в которой хранится одно из трёх значений: auth (авторизация), load (загрузка) и send (отправка). От них зависит, какая информация будет передана в PHP-файл.

Создаём функцию обновления чата

И укажем для нашей функции интервал выполнения:

После отлавливается событие отправки формы — это поможет отказаться от обновления страницы:

Теперь займёмся самим обработчиком. В первую очередь с помощью функции session_start () запускается сессия, затем подключается база данных:

Создаём функцию авторизации

Создаём функцию загрузки

Создаём функцию отправки сообщений

В функции уже присутствует несложная валидация, но можно добавить и другие меры защиты от инъекций и спама:

• проверку на дублирование прошлого сообщения;
• удаление внешних ссылок;
• цензуру мата;
• премодерацию сообщений у некоторых групп пользователей и так далее.

Теперь, когда все функции готовы, пропишем их вызов.

Вызываем функции

Со стороны фронтенда мы ещё не реализовали авторизацию, но уже можем проверить чат, потому что в самом начале данные администратора были занесены в сессию. Вот как это выглядит:

Теперь, когда чат работает, пора добавить авторизацию. Для этого можно создать отдельную форму во фронте, но можно обойтись и модальными окнами. В функции send_request () дополним отправку запроса:

Вот как это выглядит:

Дополнительные функции

Минимальные возможности чата у нас есть, и продукт можно запускать в релиз, но добавим ещё несколько полезных штук.

Смайлики

Создадим свой набор смайликов чата. Работать это будет так:

• пользователь открывает специальное окошко и кликает по смайлику;
• в поле ввода добавляется код смайлика (например, : sad: или: crazy:);
• при выводе сообщения код смайлика заменяется на изображение.

Для начала добавим контейнер со смайликами и кнопку для его открытия:

Добавим скрипт для загрузки смайликов и открытия меню с ними:

А теперь и функцию добавления смайлика в поле:

После этого укажем, когда вызываются функции:

Приступим к загрузке смайликов и их преобразованию на PHP:

Эта функция сканирует папку со смайликами, а потом проверяет расширение файлов. Она очень удобна, потому что отображает в формате PNG все смайлики, которые мы добавили.

Чтобы вызвать её, добавим ещё один case в функцию switch () в конце обработчика:

Теперь с помощью регулярных выражений можно заменять код смайлика на изображение:

Вызывается эта функция при загрузке сообщений:

Вот как это выглядит:

Ответ на сообщения

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

Для этого в load () изменим формат сообщений, добавив span к нику:

Пишем саму функцию:

И вызываем функцию:

Заключение

Одной статьи недостаточно, чтобы охватить все возможности PHP и JS для разработки чатов. С помощью этих языков легко добавить:

• ответ на конкретные сообщения;
• форматирование текста;
• отправку аудио;
• разные «комнаты»;
• чат-бота и многое другое.

Научиться делать подобные вещи самому не просто. Придётся перерыть гору литературы или искать готовые решения. На нашем курсе вы получите практические знания, которые помогут разобраться во всех деталях и делать более сложные проекты.

Веб-разработчик c нуля до PRO

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