Как передать размеры экрана пользователя на сайт

Иногда при создании сайтов веб-программисты сталкиваются с вопросом: как передать на сервер размеры экрана пользователя? Действительно, бывают ситуации, когда это необходимо, например, если на сайте имеется несколько вариантов какого либо файла и содержимое каждого зависит от размеров экрана. Но это только один пример, на самом деле ситуации могут быть самые разные и иногда желательно иметь данные параметры уже при создании кода страницы на сервере, а не обрабатывать её при помощи JavaScript уже после загрузки.

Как передать размеры экрана пользователя на сервер во время запроса? Это можно сделать двумя способами: методом GET, т.е. передать данные в адресе страницы, и методом POST. Рассмотрим оба варианта.

Как передать размеры экрана пользователя на сервер методом POST

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

Как видно из кода, здесь применены два скрытых поля - одно для указания высоты экрана (hidden_input_width), другое - ширины (hidden_input_height). При открытии страницы код на JavaScript внесёт в эти поля соответствующие данные, полученные за счёт screen.width и screen.height. Теперь при отправке данных при помощи кнопки форма передаст оба значения на сервер обработчику.

Соответственно, обработчик сможет получить эти данные из массива $_POST:

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

Как передать размеры экрана пользователя на сервер методом GET

Передача размера экрана через GET, т.е. через адрес страницы, имеет ряд недостатков. Например, при отправке запроса на сервер с компьютера адрес будет выглядеть приблизительно так:

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

А что "увидят" поисковики при индексации страницы? А вот что:

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

Допустим, что переход на другую страницу осуществляется при клике пользователем на какое-либо изображение:

 

 Что бы ввести в указанный адрес ещё две переменные, нужно при помощи JavaScript получить размеры экрана и заменить адрес на новый:

 

Теперь после загрузки страницы адрес ссылки изменится - к нему добавятся две переменные:

Останется только на стороне сервера получить эти данные из адреса и использовать их для дальнейших расчётов. Код, применяемый в обработчике запроса для извлечения данных, зависит от CMS - например, в Joomla это будет выглядеть так:

Соответственно, для получения более подробной информации необходимо обратится к документации вашей системы управления контентом (сайтом).

Заключение

Так стоит ли передавать данные о размерах экрана устройства пользователя на сервер указанными способами? Это решать вам: просто взвесьте все "плюсы" и "минусы", которые были указаны в статье. В большинстве случаев вполне удобно использовать JavaScript для подстраивания элементов страницы под монитор (дисплей) уже после загрузки страницы: данные скрипты просто получают от браузера необходимые параметры, производят перерасчёт и меняют соответствующие значения, указанные в CSS или аргументах. Как это происходит, читайте в статье "".