Система комментариев на php

PHP скрипт комментариев + AJAX + JS + MYSQL + CSS

В данной статье мы создадим PHP скрипт для реализации системы комментариев на сайте. Наш скрипт комментариев в основном будет реализован, как вы уже догадались на языке программирования PHP. Как сопутствующие языки программирования будут: MySQL, JavaScript, а также технология Ajax (Асинхронный javascript), он используется для реализации обмена данными с сервером без перезагрузки страницы, что очень удобно при создании системы комментариев. Само собой, нам понадобятся HTML и CSS, для реализации внешнего вида системы комментариев.

ВНИМАНИЕ! По многочисленным просьбам пользователей созданы исходники. Которые вы можете скачать с этой страницы: demo_comments.rar [26,1 kb] — исходники тестировались на Denwer.

Шаг 1 – Создание таблицы для комментариев в БД

Создание PHP скрипта комментариев следует начать из создания таблицы в БД. Для этого воспользуемся следующим MySQL запросом:

CREATE TABLE `comments` ( `id` int(11) NOT NULL auto_increment, `id_article` varchar(11) NOT NULL, `name` varchar(60) NOT NULL, `mail` varchar(60) NOT NULL, `text` varchar(500) NOT NULL, `date_add` varchar(18) NOT NULL, `public` int(1) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT=75 DEFAULT CHARSET=cp1251 AUTO_INCREMENT=75 ;

id – это идентификатор самого комментария, имеет значение NOT NULL auto_increment, он обязателен, думаю, вам понятно почему. Ведь это ключ для доступа к конкретному комментарию.

id_article – это идентификатор материала, к которому относится комментарий. В нашем случае это статья, в вашем, можете назвать его как угодно.

name – имя пользователя, который будет добавлять комментарий.

mail – e-mail пользователя.

text – текст комментария, или собственно сам комментарий.

date_add – дата добавления комментария, максимальное значение поля установлено 18 символов, это для того чтобы дата добавления комментария имела вид: 22.07.2011 в 14:03. То есть, получается, что в строке даты у нас 18 символов. А больше нам и не надо, поэтому устанавливаем значение varchar(18).

public – это будет нашим администраторским допуском к публикации комментария. Данное поле будет иметь всего 1 символ, причем цифровой: 1 или 0. (1 – публикуем, 2 – не публикуем).

Шаг 2 – PHP скрипт системы комментариев

Для реализации системы комментариев нам необходимо создать следующие функции:

2. Добавления комментариев

Добавление комментариев

Для этого создадим файл add_comment.php. Для начала напишем функцию добавления комментариев. Для этого вставьте в ваш файл, следующий код:

 // Устанавливаем значение даты $date = date('d.m.Yв H:i'); // Устанавливаем параметры валидации $nl = strlen($_POST['name']); $ml = strlen($_POST['mail']); $tl = strlen($_POST['text']); $id_article = $_GET['id_article']; $name = $_POST['name']; $mail = $_POST['mail']; $text = $_POST['text']; if($nl60 or $ml60 or $tl500 or $_POST['nr']!='nerobot') elseif(!eregi('^[a-z0-9]+(([a-z0-9_.-]+)?)@[a-z0-9+](([a-z0-9_.-]+)?)+\.+[a-z]$',$_POST['mail'])) else // Если прошли валидацию if($validate) < // Добавляем комментарий include("config.php"); mysql_query("insert into comments (id_article, name, mail, text, date_add, public) values ('', '', '', '', '', '0')") or die ("Error! query - add_comment"); echo 'Комментарий добавлен и ожидает проверки!'; > else < echo 'Заполните правильно поля ввода!'; > ?>

Немножко обговорим этот php скрипт. Верхний блок кода нужен для корректной работы ajax скриптов. Что происходит в этом блоке кода? Сначала идет задержка работы php скрипта на 1 секунду, это для того, чтобы увидеть анимацию ожидания, при добавлении комментария. Далее выводятся header, которые определяют кодировку контента и т.д. После мы преобразуем в нужную кодировку все входящие данные методом POST. Потому что они будут отосланы средствами ajax, и будут иметь другую кодировку.

Следующими строками php кода, мы устанавливаем параметры валидации . Чтобы все поля формы были заполнены корректно, и если валидация пройдена (true), то сохраняем комментарий в БД, и выводим сообщение, если нет, то выводим сообщение, что поля нужно заполнять верно.

Вывод комментариев

Теперь напишем вывод комментариев. Для удобства создадим еще один файл show_comments.php

И поместим в него следующий код:

Вот это уже настоящая функция для вывода комментариев. Здесь все просто. В предыдущем коде, я не объяснил об файле config.php, который подключается с помощью строки include(«config.php»); Этот файл нам необходим для работы с БД. В нем записаны параметры подключения, вот пример кода этого файла:

Как видите, здесь прописаны настройки подключения, и собственно подключение к БД. Вернемся к нашей функции show_comments($id_article). Она принимает один аргумент, это ид статьи, к которой относятся комментарии, вы должны будете посылать его туда сами. Надеюсь, с этим не будет вопросов. Еще рассмотрим строку: $res = mysql_query(«select * from comments where id_article like $id_article and public = 1 order by id», $con) or die («Error! query – show comments»);

В этой строке записан элементарный запрос к БД, где указывается, что мы выбираем комментарии, относящиеся только к данной статье ($id_article), и те которые одобрил администратор (public = 1).

Шаг 3 – Визуальный вывод комментариев

Для отображения списка комментариев создадим файл comments.php. Данный файл можно будет подключать в нужное место (низ статьи, или иного контента).

Вставьте в файл comments.php следующий код:

 
 
 
Комментарии по теме:
 Вмонтируйте название вашей статьи сюда  
 
 
 
 
Комментарий должен быть по теме и составлен корректно!
    я не робот.  >)' />
 
 

Вот так будет выглядеть наш файл, отвечающий за визуальное отображение блока комментариев, а также формы добавления комментариев. Если вы заметили, то дизайн будет подобным к дизайну системы комментариев на нашем сайте (sitear.ru).

Вот так будет выглядеть наш блок комментариев:

А вот так раскрытая форма добавления комментария:

Этот файл имеет HTML код, который не нужно объяснять веб-программисту. Единственное что нужно, внимательно просмотрите код, и там где подсказки типа: «Вмонтируйте…», вставьте свои значения для корректной работы php скрипта комментариев.

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

Шаг 4 – Вспомогательные Javascript и Ajax функции

Все эти функции хранятся в файле js_comments.js. Ниже предоставлена его исходная структура:

/* —————————- */ /* XMLHTTPRequest Enable */ /* —————————- */ function createObject() < var request_type; var browser = navigator.appName; if(browser == "Microsoft Internet Explorer")< request_type = new ActiveXObject("Microsoft.XMLHTTP"); >else < request_type = new XMLHttpRequest(); >return request_type; > function ajax(param) < var req = createObject(); method=(!param.method ? "POST" : param.method.toUpperCase()); if(method=="GET") < send=null; param.url=param.url+"&ajax=true"; >else < ; for (var i in param.data) send+= i+"="+param.data[i]+"&"; send=send+"ajax=true"; >req.open(method, param.url, true); if(param.statbox)document.getElementById(param.statbox).innerHTML = ‘ Пожалуйста подождите. ‘; req.setRequestHeader(«Content-Type», «application/x-www-form-urlencoded»); req.send(send); req.onreadystatechange = function() < if (req.readyState == 4 && req.status == 200) //если ответ положительный < if(param.success)param.success(req.responseText); >> > function toggle(id) < var e = document.getElementById(id); var dh = gh(id); var elems = e.getElementsByTagName('*'); if (e.style.display == "none") < for(var i=0; i=0;i-=5) < (function() < var pos=i; setTimeout(function() < e.style.height = (pos/100)*dh+"px"; if (pos<=0) < e.style.display = "none"; e.style.height=lh; >>,1000-(pos*5)); > )(); > return true; > return false; > function vhe(obj, vh) function gh(id) < var e = document.getElementById(id); if(e.style.display == "none") < e.style.visibility = "hidden"; e.style.display = "block"; dh = e.clientHeight||e.offsetHeight+5; // Высота e.style.display = "none"; e.style.visibility = "visible"; >else < dh = e.clientHeight||e.offsetHeight+5; // Высота >return dh; > function clearText(field)

Файл большой, но здесь все понятно. Начнем с самого простого, а самое интересное, оставим на потом.

functionclearText(field) – очищает поле ввода при фокусе, предназначена для удобства и дизайна.

functiontoggle(id) – сворачивает и разворачивает div блоки. Также имеет вспомогательные функции gh(), vhe(). Мы уже рассматривали о функции сворачивания и разворачивания блоков, в другой статье.

functioncreateObject() – создает объект XMLHTTPRequest, который будет производить обмен данными с сервером по технологии ajax.

functionajax(param) – функция принимает многомерный массив param, в котором указывается: куда отправлять данные (url), где выводить статус работы скрипта (statbox), метод отправки данных (method), data – все, что мы отправляем на сервер, success– указание на функцию, которая будет принимать ответ сервера и обрабатывать присланные данные.

Вот так вкратце о вспомогательном файле php скрипта комментариев. Как видите, если рассматривать php скрипт комментариев в одиночку, то он может показаться не сложным, но сложно связать вместе разные языки программирования. Только связав несколько языков программирования, получится все красиво и интересно.

Шаг 5 – другие вспомогательные файлы скрипта комментариев

Мы подходим к завершающей части нашей статьи, и рассмотрим CSS файл. Я дам пример его кода, но объяснять, у меня уже нет сил. Если вас не устраивает дизайн блока комментариев, вы легко можете поменять css файл.

*< margin: 0; padding: 0; >* a a:hover < color: #995;text-decoration: none; >h2 #coments #coments .title #coments .title h2 #coments .title .left #coments .addcoment #coments .addcoment img:hover #coments textarea < width:535px; font-size:14px; height: 180px; margin:10px; overflow:hidden; background:#FFF; border:1px solid #DDD;>#coments input[type="text"] #coments .addcoment span #coments #statusbox #coments img.button_add #coments .top #coments .main #coments .block_name #coments .name #coments .date #coments img < float:left;>#coments .coment

Также даю картинки, которые я использовал при создании дизайна комментариев. Еще раз напоминаю, можете менять все на свой вкус.

Скачать и установить скрипт комментариев

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

Заключение

Данный пример системы комментариев не до конца реализован. Вам самим необходимо дописать администраторскую сторону: Одобрения комментариев, Удаление комментариев и т.д. Но теперь у вас есть основы и понимание как создать php скрипт системы комментариев на вашем сайте.

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

Источник

Система комментариев на php

В этом разделе помещены уроки по PHP скриптам, которые Вы сможете использовать на своих ресурсах.

• 

Фильтрация данных с помощью zend-filter

Когда речь идёт о безопасности веб-сайта, то фраза «фильтруйте всё, экранируйте всё» всегда будет актуальна. Сегодня поговорим о фильтрации данных.

Контекстное экранирование с помощью zend-escaper

Обеспечение безопасности веб-сайта — это не только защита от SQL инъекций, но и протекция от межсайтового скриптинга (XSS), межсайтовой подделки запросов (CSRF) и от других видов атак. В частности, вам нужно очень осторожно подходить к формированию HTML, CSS и JavaScript кода.

Подключение Zend модулей к Expressive

Expressive 2 поддерживает возможность подключения других ZF компонент по специальной схеме. Не всем нравится данное решение. В этой статье мы расскажем как улучшили процесс подключение нескольких модулей.

Совет: отправка информации в Google Analytics через API

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

Подборка PHP песочниц

Подборка из нескольких видов PHP песочниц. На некоторых вы в режиме online сможете потестить свой код, но есть так же решения, которые можно внедрить на свой сайт.

Совет: активация отображения всех ошибок в PHP

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

Источник