Как узнать разрешение экрана на стороне сервера при Server-Side Rendering?
Используем Nuxt 2. Есть mixin, который отрисовывает компонент предназначенный для разных разрешений экрана (mobile, tablet, desktop). Mixin ориентируется на ширину экрана (если ширина экрана неизвеста, то отрисовывает компонент для мобильных устройств). Проблема заключается в том, что при генерации разметки nuxt'ом на стороне сервера неизвестна ширина экрана, по этому mixin всегда отдает компонент для мобильных устройств. Затем на стороне клиента (в браузере) все-равно приходится перерендеривать разметку для версий tablet и desktop.
Вопрос заключается в том: как сразу на стороне сервера генерировать разметку под ту версию устройства с которого пришел HTTP запрос?
Короткий ответ: смотри выше.
Длинный ответ: тебе оно и не надо. SSR при работе юзера с твоим сайтом отрабатывает ровно один раз - при первой загрузке, дальше сайт работает как обычное SPA. Соответственно, разок можно и потерпеть загрузку "лишнего".
В остальных случаях твой SSR увидят только боты, и вот тут тебе стоит подумать, что именно лучше им отдавать по-умолчанию, возможно лучше сделать дефалтной как раз десктоп версию.
Всё, что сервер может узнать о клиенте, находится в HTTP заголовках запроса, в строке User-Agent. Узнать, мобильный клиент запрашивает контент или десктопный, можно распарсив эти данные.
А вот какое разрешение экрана у устройства — вообще не дело сервера. Если я сожму окно браузера на ноутбуке до форточки размером 400х300 пикселей, я стану мобильным устройством?
