и
). Для этого применяется набор атрибутов formaction
, formmethod
, formenctype
и formtarget
, которые являются аналогами соответствующих атрибутов без приставки form. В примере 4 показано использование этих атрибутов.Пример 4. Отправка формы
HTML5
IE
Cr
Op
Sa
Fx
Отправка формы
Все новые атрибуты форм не поддерживаются некоторыми браузерами, в частности, Internet Explorer и Safari.
Одной из самых востребованных функций на сайте является форма заявки или заказа, данные из которой отправляются на почту владельцу сайта. Как правило такие формы являются простыми и состоят из двух трех полей для ввода данных. Как же создать такую форму заказа? Здесь потребуется использование языка разметки HTML и языка программирования PHP.
Язык разметки HTML сам по себе несложен, нужно всего лишь разобраться в том как и где ставить те или иные теги. С языком программирования PHP все немного сложнее.
Для программиста создать такую форму не составит труда, а вот HTML верстальщику может показаться сложным некоторые действия.
Создаем форму отправки данных в html Первая строка будет следующей
Теперь соберем все вместе.
Теперь сделаем так, чтобы поля в форме стали обязательными для заполнения. Имеем следующий код:
Создаем файл, принимающий данные из HTML формы Это будет файл с именем send.php
В файле на первом этапе нужно принять данные из пост массива. Для этого создаем две переменные:
$fio = $_POST["fio"]; $email = $_POST["email"];
Перед названиями переменных в php ставиться знак $, в конце каждой строки ставиться точка с запятой. $_POST это массив в который передаются данный из формы. В форме html при этом указан метод отправки method="post". Так, приняты две переменные из формы html. Для целей защиты своего сайта нужно провести эти переменные через несколько фильтров - функций php.
Первая функция преобразует все символы, которые пользователь попытается добавить в форму:
При этом новые переменные в php не создаются, а используются уже имеющиеся. Что сделает фильтр, он преобразует символ "<" в "<". Также он поступить с другими символами, встречающимися в html коде.
Вторая функция декодирует url, если пользователь попытается его добавить в форму.
$fio = urldecode($fio); $email = urldecode($email);
Третей функцией мы удалим пробелы с начала и конца строки, если таковые имеются:
$fio = trim($fio); $email = trim($email);
Существуют и другие функции, позволяющие отфильтровать переменные php. Их использование зависит от того, насколько вы опасаетесь того, что злоумышленник попытается добавить программный код в данную форму отправки данных на почту html.
Проверка данных, передаваемых от HTML формы в файл PHP
Для того, чтобы проверить, работает ли этот код, передаются ли данные можно просто их вывести на экран при помощи функции echo:
echo $fio; echo " "; echo $fio;
Вторая строка здесь нужна для того, чтобы разделить вывод переменных php на разные строки.
Отправляем полученные данные из формы HTML на почту при помощи PHP Для отправки данных на почту нужно воспользоваться функцией mail в PHP.
mail("на какой адрес отправить", "тема письма", "Сообщение (тело письма)","From: с какого email отправляется письмо \r\n");
Например, нужно отправить данные на email владельца сайта или менеджера [email protected] .
Тема письма должна быть понятной, а сообщение письма должно содержать то, что указал пользователь в HTML форме.
mail("[email protected] ", "Заявка с сайта", "ФИО:".$fio.". E-mail: ".$email ,"From: [email protected] \r\n");
Необходимо добавить условие, которе проверит отправилась ли форма при помощи PHP на указанные адрес электронной почты.
if (mail("[email protected] ", "Заказ с сайта", "ФИО:".$fio.". E-mail: ".$email ,"From: [email protected] \r\n")) { echo "сообщение успешно отправлено"; } else { }
Таким образом программный код файла send.php, который отправит данные HTML формы на почту будет выглядеть следующим образом:
$fio = $_POST["fio"]; $email = $_POST["email"]; $fio = htmlspecialchars($fio); $email = htmlspecialchars($email); $fio = urldecode($fio); $email = urldecode($email); $fio = trim($fio); $email = trim($email); //echo $fio; //echo " "; //echo $email; if (mail("[email protected] ", "Заявка с сайта", "ФИО:".$fio.". E-mail: ".$email ,"From: [email protected] \r\n")) { echo "сообщение успешно отправлено"; } else { echo "при отправке сообщения возникли ошибки"; }?>
Три строки для проверки, передаются ли данные в файл закомментированы. При необходимости их можно удалить, так как они нужны были только для отладки.
Помещаем HTML и PHP код отправки формы в один файл
В комментариях к этой статье многие задают вопрос о том, как сделать, чтобы и HTML форма и PHP код отправки данных на почту находились в одном файле, а не двух.
Для реализации такой работы нужно поместить HTML код формы в файл send.php и добавить условие, которое будет проверять наличие переменных в массиве POST (этот массив передается из формы). То есть, если переменные в массиве не существуют, то нужно показать пользователю форму. Иначе нужно принять данные из массива и отправить их адресату.
Давайте посмотрим как изменить PHP код в файле send.php:
Форма заявки с сайта //проверяем, существуют ли переменные в массиве POST if(!isset($_POST["fio"]) and !isset($_POST["email"])){ ?>
} else { //показываем форму $fio = $_POST["fio"]; $email = $_POST["email"]; $fio = htmlspecialchars($fio); $email = htmlspecialchars($email); $fio = urldecode($fio); $email = urldecode($email); $fio = trim($fio); $email = trim($email); if (mail("[email protected] ", "Заявка с сайта", "ФИО:".$fio.". E-mail: ".$email ,"From: [email protected] \r\n")){ echo "Сообщение успешно отправлено"; } else { echo "При отправке сообщения возникли ошибки"; } } ?>Существование переменной в POST массиве мы проверяем PHP функцией isset(). Восклицательный знак перед этой функцией в условии означает отрицание. То есть, если переменной не существует, то нужно показать нашу форму. Если бы я не поставил восклицательный знак, то условие дословно означало бы - "если существует, то показать форму". А это неправильно в нашем случае. Естественно, что вы можете переименовать его в index.php. Если будуту переименовывать файл, то не забудьте переименовать название файла и в строке
Сохранив данный код в HTML-файле и просмотрев его с помощью вашего любимого браузера, вы увидите привычную HTML-форму:
Тэг
, собственно и задает форму. Его атрибуты - оба необязательные:
action - указывает URL (полный или относительный), на который будет отправлена форма.
Если этот атрибут не указать, большинство браузеров (точнее говоря, все известные мне браузеры)
отправляют форму на текущий документ, то есть "саму на себя". Это удобное сокращение, но по стандарту
HTML атрибут action обязателен.
method - способ отправки формы. Их два.
Если атрибут method не указан - подразумевается GET .
Тэг - задает элемент формы, определяемый атрибутом type:
Значение "text" задает однострочное текстовое поле ввода
Значение "submit" задает кнопку, при нажатии которой происходит отправка формы на сервер
Возможны и другие значения (да и - не единственный тэг, задающий элемент формы).
Итак, что же происходит, когда мы нажимаем кнопку "OK"?
Браузер просматривает входящие в форму элементы и формирует из их атрибутов name и value данные формы.
Допустим, введено имя Vasya . В этом случае данные формы - name=Vasya&okbutton=OK
Браузер устанавливает соединение с сервером, отправляет на сервер запрос документа, указанного в
атрибуте action тэга
Сервер анализирует полученный запрос, формирует ответ, отправляет его браузеру и закрывает соединение
Браузер отображает полученный от сервера документ
Отправка того же запроса вручную (с помошью telnet) выглядит следующим образом (предположим, что доменное имя сайта - www.example.com):
Telnet www.example.com 80
GET /cgi-bin/form_handler.cgi?name=Vasya&okbutton=OK HTTP/1.0\r\n
Host: www.example.com\r\n
\r\n
Как вы, скорее всего, уже догадались, нажатие submit-кнопки в форме с методом отправки "GET" аналогично вводу соответствующего URL (со знаком вопроса и данными формы в конце) в адресной строке браузера:
Http://www.example.com/cgi-bin/form_handler.cgi?name=Vasya&okbutton=OK
На самом деле, метод GET используется всегда, когда вы запрашиваете с сервера какой-либо документ, просто введя его URL, или щелкнув по ссылке. При использовании
Форма, приведенная в строках 8-12, содержит два элемента: name и okbutton . Атрибут method указывает метод отправки формы POST , атрибут же action , указывающий URL, на который отправляется форма, заполняется значением серверной переменной PHP_SELF - адресом выполняемого в данный момент скрипта.
=$_SERVER["PHP_SELF"]?> - сокращенная форма записи для echo $_SERVER["PHP_SELF"]; ?> .
Предположим, в поле name мы ввели значение Вася, и нажали кнопку OK. При этом браузер отправляет на сервер POST -запрос. Тело запроса: name=Вася&okbutton=OK . PHP автоматически заполняет массив $_POST:
$_POST
[
"name"
] =
"Вася"
$_POST
[
"okbutton"
] =
"OK"
В действительности, значение "Вася" отправляется браузером в urlencode-виде; для кодировки windows-1251 это значение выглядит как %C2%E0%F1%FF . Но, поскольку PHP автоматически осуществляет необходимое декодирование, мы можем "забыть" об этой особенности - пока не придется работать с HTTP-запросами вручную.
Так как в теле запроса указываются только имена и значения, но не типы элементов форм, PHP понятия не имеет, соответствует $_POST["name"] строке ввода, кнопке, или списку. Но эта информация нам, в общем-то, совершенно не нужна. :)
Поскольку знать, что написано на кнопке submit, нам необязательно, в строке 11 можно удалить атрибут name , сократив описание кнопки до . В этом случае, браузер отправит POST -запрос name=Вася.
А теперь - то же самое, но для GET-формы:
if (isset($_GET
[
"name"
])) {
echo
"Привет, "
.
$_GET
[
"name"
] .
" !"
;
}
?>
В строке 8 можно было бы с таким же успехом написать
Никаких новых приемов здесь не используется. Разберитесь, выполните код, попробуйте модифицировать...
Изменим последний пример, чтобы пользователю не нужно было повторно заполнять поля. Для этого заполним атрибуты value элементов формы только что введенными значениями.
$name
= isset($_POST
[
"name"
]) ?
$_POST
[
"name"
] :
""
;
$year
= isset($_POST
[
"year"
]) ?
$_POST
[
"year"
] :
""
;
If (isset($_POST
[
"name"
],
$_POST
[
"year"
])) {
if ($_POST
[
"name"
] ==
""
) {
echo
"Укажите имя! "
;
} else if ($_POST
[
"year"
] <
1900
||
$_POST
[
"year"
] >
2004
) {
echo
"Укажите год рождения! Допустимый диапазон значений: 1900..2004 "
;
} else {
echo
"Здравствуйте, "
.
$_POST
[
"name"
] .
"! "
;
$age
=
2004
-
$_POST
[
"year"
];
echo
"Вам "
.
$age
.
" лет "
;
}
echo
"
"
;
}
?>
Несколько непонятными могут оказаться строки 4 и 5. Все очень просто: строку 4 можно было бы записать так:
if (isset($_POST
[
"name"
]))
$name
=
$_POST
[
"name"
];
else
$name
=
""
;
Может возникнуть вопрос - почему бы не выбросить строки 4-5 и не написать:
Введите Ваше имя:
">
Введите Ваш год рождения:
">
Дело в том, что, если эти POST -переменные не определены - а так и будет, если форму еще не заполняли, - PHP выдаст предупреждения об использовании неинициализированных переменных (причем, вполне обоснованно: такое сообщение позволяет быстро находить труднообнаружимые опечатки в именах переменных, а также предупреждает о возможных "дырах" на сайте). Можно, конечно, поместить код с isset прямо в форму, но получится слишком громоздко.
Разобрались? А теперь попробуйте найти ошибку в приведенном коде. Ну, не совсем ошибку, - но недочет.
htmlspecialchars()
Не нашли? Я подскажу. Введите, например, в поле "имя" двойную кавычку и какой-нибудь текст, например, Ва"ся. Отправьте форму, и взгляните на исходный код полученной страницы. В четвертой строке будет что-то наподобие:
Введите Ваше имя:
То есть - ничего хорошего. А если бы хитрый пользователь ввел JavaScript-код?
Для решения этой проблемы необходимо воспользоваться функцией htmlspecialchars() , которая заменит служебные символы на их HTML-представление (например, кавычку - на "):
$name
= isset($_POST
[
"name"
]) ?
htmlspecialchars
($_POST
[
"name"
]) :
""
;
$year
= isset($_POST
[
"year"
]) ?
htmlspecialchars
($_POST
[
"year"
]) :
""
;
If (isset($_POST
[
"name"
],
$_POST
[
"year"
])) {
if ($_POST
[
"name"
] ==
""
) {
echo
"Укажите имя! "
;
} else if ($_POST
[
"year"
] <
1900
||
$_POST
[
"year"
] >
2004
) {
echo
"Укажите год рождения! Допустимый диапазон значений: 1900..2004 "
;
} else {
echo
"Здравствуйте, "
.
$name
.
"! "
;
$age
=
2004
-
$_POST
[
"year"
];
echo
"Вам "
.
$age
.
" лет "
;
}
echo
"
"
;
}
?>
Повторите опыт и убедитесь, что теперь HTML-код корректен.
Запомните - функцию htmlspecialchars() необходимо использовать всегда, когда выводится содержимое переменной, в которой могут присутствовать спецсимволы HTML.
phpinfo()
Функция phpinfo() - одна из важнейших в PHP. Она выводит информацию о настройках PHP, значения всевозможных конфигурационных переменных...
Почему я упоминаю о ней в статье, посвященной формам? phpinfo() - удобнейшее средство отладки. phpinfo() , помимо прочего, выводит значения всех $_GET , $_POST и $_SERVER переменных. Так что, если переменная формы "потерялась", самый простой способ обнаружить, в чем дело - воспользоваться функцией phpinfo() . Для того, чтобы функция выводила только значения переменных (и вам не пришлось прокручивать десяток страниц), ее следует вызвать следующим образом: phpinfo(INFO_VARIABLES); , или - что абсолютно то же самое - phpinfo(32) ;.
phpinfo
(32
);
?>
Или, например, такая ситуация: вы хотите узнать IP-адрес посетителя. Вы помните, что соответствующая переменная хранится в массиве $_SERVER , но - вот незадача - забыли, как именно переменная называется. Опять же, вызываем phpinfo(32); , ищем в табличке свой IP-адрес и находим его - в строке $_SERVER["REMOTE_ADDR"] .
Лабораторная работа 1. Протокол HTTP. Методы GET, POST. HTML формы.
Теоретическая часть
Жизненный цикл запроса в протоколе HTTP
Браузер открывает соединение
с сервером Браузер отправляет серверу запрос на получение страницы Сервер формирует ответ (чаще всего - HTML-код) браузеру и закрывает соединение
Браузер обрабатывает HTML-код и отображает страницу
Обратите внимание на выделенное жирным
. Еще до того, как вы увидели на экране запрошенную страницу, соединение с сервером закрыто, и он о вас забыл. И когда вы введете другой (или тот же самый) адрес, или щелкните по ссылке, или нажмете на кнопку HTML-формы - та же схема повторится снова.
Такую схему работы называют "клиент-сервер"
. Клиент в данном случае - браузер.
Итак, соединение с веб-сервером длится всего несколько секунд (или долей секунд) - это промежуток времени между щелчком по ссылке (или другим способом запроса) и началом отображения страницы. Большинство браузеров во время соединения отображают некий индикатор, например, MS Internet Explorer отображает анимацию в правом верхнем углу.
Чтобы навсегда избавиться от восприятия HTTP как "черного ящика", "притворимся" браузером с помощью telnet"а:
Запустим telnet ya.ru 80
Введем в окне терминала следующее (если ввод не отображается - ничего страшного):
GET / HTTP/1.0
[здесь нажмем Enter]Host: ya.ru
[здесь нажмем Enter дважды]
Нажатие Enter соответствует, как правило, комбинации символов CR + LF, обозначаемых как \r\n
. Далее будет использоваться именно это обозначение.
По экрану пробежит HTML-код страницы http://ya.ru/. Как видите - ничего сложного.
Исходный код текущей страницы можно просмотреть практически в любом браузере, выбрав в меню "View|Source".
Картинки, фреймы - все это дополнительные запросы, точно такие же. Собственно, откуда берутся картинки в окне браузера: при парсинге (обработке) HTML-кода, браузер, натыкаясь на тэг https://i1.wp.com/ картинка
"> осуществляет дополнительный запрос к серверу - запрос картинки
, и отображает ее на месте, где стоит тэг .
Попробуйте:
Telnet www.google.ru 80
GET /php/php5ru.png HTTP/1.0
\r\nHost: ya.ru
\r\n\r\n
По экрану пробежит то, что вы увидите, если просмотрите этот png-файл в текстовом редакторе.
I-2. HTML-формы. Методы отправки данных на сервер
С HTML-формами вы наверняка уже встречались:
Введите Ваше имя: