Сен
Php отправка данных на сервер
Решил сделать себе шпаргалку об основных методах отправки и получения данных с веб сервера средствами php и js. Так и родилась эта заметка. В ней я рассмотрел наиболее часто используемые приёмы обмена данными между веб клиентом и веб сервером, которые используют php разработчики.
Главными фаворитами отправки данных являются php get запрос и php запрос post, за ними идёт технология AJAX. Так в чём же отличия get и post запросов.
- get запрос передаётся в адресной строке (в http заголовке) и виден пользователю
- post запрос передаётся в теле документа
- объём get запроса ограничен (максимум 276 символов)
- метод get не передаёт файлы
- метод post передаёт файлы
Php get запрос
Что бы сделать php get запрос нам для начала следует создать html форму с полем для ввода данных. В теге form указываем к какому файлу на сервере обращаться
и каким методом производить отправку <form action="get.php" method="post" >. Так же не забываем задавать полю атрибут name,
это будет название ячейки массива GET $_GET["data"]; из которого мы получим данные в файл на сервере. Как отправлять данные get через форму я думаю ясно, теперь попробуем
передать их через адресную строку. index.php?data=1 если мы вобьём такой запрос в адресную строку и отправим, то в файле в index.php мы получим
из $_GET["data"] значение 1. С этим я думаю то же всё понятно, теперь пример.
Задача: есть файл index.php с формой отправки get запроса к другому файлу например get.php. При получении гет запроса файл get.php должен передать массив с данными в index.php. В index.php полученный массив должен вывестись.
Реализация. Файл index.php
<?php
//получаем данные из get.php
$data = $_GET["data"];
//если данные есть выводим их на экран
if(isset($data)){
//вся магия в ф-ии unserialize
print_r(unserialize($data));
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
//В форме методом get через скрытое поле посылаем значение 1
<form action="get.php" method="get" >
<input type="hidden" name="flag" value="1"/>
<button type="submit">Отправить запрос</button>
</form>
</body>
Файл get.php
<?php
//массив который нужно передать
$users = array(
0 => array(
"login" => "Administrator",
"password" => "h734yuiw8"
),
1 => array(
"login" => "John",
"password" => "78dfud776s"
)
);
//получаем флаг
$flag=$_GET['flag'];
//если флаг 1 то передаём массив гетом
//магия в функции serialize
if($flag==1){
header('Location: index.php?data='.serialize($users).'');
exit;
}else{
header('Location: index.php');
exit;
}
?>
Php запрос post
Php запрос post передаётся так же через форму, только атрибут в теге form будет method="post". И получать данные в указанном файле мы будем
из массива пост $_POST['search'] и сразу приведём пример.
Задача: отправить данные из index.php методом POST на сервер в файл get.php и получить их обратно, если поле отправки данных пустое вывести сообщении о незаполненном поле. Решение начнём с index.php
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<form action="get.php" method="post">
<label for="search">Поисковый запрос</label>
<input type="text" name="search"/><br>
<?php
//если гетом получили ответ в err 1
//то выводим сообщ о незаполненном поле
if($_GET['err']==1){
?>
<div>
<p><strong>Заполните поле запроса</strong></p>
</div>
<?php
}
?>
<p>Введённый запрос:
<?php
//если гетом получили ответ search
//то выводим его значение
if(isset($_GET['search'])){
echo $_GET['search'];
}
?>
</p>
<button type="submit">Отправить запрос</button>
</form>
</body>
Файл get.php
<?php
if(!empty($_POST['search'])){
//если получили пост переменную search то
//гетом отправляем её значение назад
$s=$_POST['search'];
header('Location: index.php?search='.$s.'');
exit;
}else{
//если не получили пост переменную search то
//гетом отправляем перем err с значением 1
header('Location: index.php?err=1');
exit;
}
?>
Передача массива AJAX
Выполним ту же самую задачу с помощью ajax. Вообще то ajax это технология относящаяся к javascript, но в рамках заметки о передаче данных на
сервер затронем и эту технологию. Конечно ajax это тема отдельной статьи.
В процессе запроса ещё будем выводить гифку индикатора загрузки.
Так же имеем два файла index.php и get.php. Файл index.php. Не забываем подключать jquery. Обращу внимание, для
скрытия гифки при первой загрузке страницы назначаем блоку box стиль display: none
<script src="/js/jquery-3.1.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
//вешаем событие на кнопку отправить
$('.submit').click(function(){
$.ajax({
//как будем передавать данные
type: "GET",
//куда передаём
url: "get.php",
//какие данные передаём
data: {flag: 1},
//событие перед отправкой ajax
beforeSend: function(){
//выводим гифку
$(".box").show();
},
//событие после получения ответа,
//получаем массив в data
success: function(data){
//скрываем гифку
$(".box").hide();
var html = '';
//ф-я JSON.parse переводит json данные в объект
var dt=JSON.parse(data);
for (var i = 0; i < dt.length; i++) {
html +=dt[i].login+' : '
html +=dt[i].password+'<br>'
}
//вывод данных
$('#chat').html(html);
}
});
});
});
</script>
<input type="submit" name="" value="Отправить" class="submit"/>
<div class="box" style="width: 50px; height: 50px; display: none;">
<img src="/load.gif" style="width: 100%;">
</div>
<div id="chat"></div>
Файл get.php. В файл получаем данные из гет массива и из php передаём массив в javascript. Что бы передать php массив в js, его нужно привести к формату json. Для этого используем php ф-ю json_encode. После перекодировки производится отправка json php средствами, а конкретно вызываем echo.
<?php
header('Content-Type: text/html; charset=utf-8');
//передаваемый массив
$users = array(
0 => array(
"login" => "Administrator",
"password" => "h734yuiw8"
),
1 => array(
"login" => "John",
"password" => "78dfud776s"
)
);
if($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest') {
//проверяем какой флаг пришёл
if($_GET['flag']==1) {
//установили задержку для вывода гифки загрузки
sleep(2);
//волшебная ф-я json_encode переделывает массив
//в формат json
$users_json = json_encode($users);
//передача данных
echo $users_json;
}
}
?>
Комментарии
Александр
08.09.2016 08:44 Ответить
Спасибо. Это очень интересно.
Андрей
08.09.2016 21:08 Ответить
Полезная заметка.
Посетитель
01.02.2017 08:17 Ответить
Шарюсь по подобным сайтам изредка и удивляюсь, вот вы никак без jQuery не можете обойтись? Вы навешиваете **ву гору событий на страницу, не подозревая что юзеры сидящие с мобил уныло убегают с подобных сайтов, т.к. их браузеры беспечно тупят! Неужели трудно зайти в гугл и нагуглить уроки по js? Поверьте, ваша жизнь изменится сразу после того как вы самостоятельно напишите несколько подобных jQuery функций на чистом js, и браузеры пользователей сразу будут улыбаться и перестанут ступить!)
С уважением разработчик html css js php mysqli - DimmoS
Спасибо за внимание!
Алексей Григорьев
01.02.2017 21:11 Ответить
Да по моему использование jq стало уже стандартом. Все основные css фреймвёрки требуют jq. Куча слайдеров, меню, модальных окон написано на jq. Да и синтаксис jq лучше чем наитивного js. На счёт тормозов под мобильные разрешения не слышал.