Pure Javascript Ширина поста в браузере до загрузки страницы

Question

Я хочу указать ширину браузера пользователя до загрузки тегов изображений .

Я использую этот код, но он работает после загрузки страницы.

var height = window.innerHeight;
var width = window.innerWidth;
var xhr = new XMLHttpRequest();
xhr.open("POST", 'ajax/window.php', true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
xhr.send('width='+width+'&height='+height);

Является что возможно? Мне нужно создать сеанс, который сохраняет ширину браузера пользователя ДО ЗАГРУЗКИ ТЭГОВ ИЗОБРАЖЕНИЯ.

Answer 1

Решение

Не мне решать, является ли это хорошей практикой. Вы делаете свое приложение так, как считаете нужным. Надо подумать над несколькими вещами.

1. Что произойдет, если пользователь изменит размер страницы?
   • Вы можете вызвать событие javascript, которое повторно отправит новый размер страницы.
2. Вы готовы отложить загрузку страницы?
   • Если пользователь посещает вашу страницу, он должен будет опубликовать сообщение в вашем API, а затем сохранить данные в сеансе. Вам может потребоваться какая-то проверка CSRF. Тогда вы бы это сохранили, но вам нужно было бы как-то вернуть данные клиенту. Вы можете вернуть его в ответ на почтовый запрос, refre sh page, et c.

Если бы мне нужно было это сделать, я бы загрузил изображения с javascript после запроса их из API с запросом AJAX. Я бы просто заполнил страницу innerHTML= response.data или чем-то в этом роде.

Другая идея полностью

Если речь идет о размере изображения ... Вы можете обновить href изображения, чтобы запросить изображение определенного размера, отказавшись от токенов сеанса и CSRF и просто сделав Dynami c запрос изображения.

Например:

var height = window.innerHeight;
var width = window.innerWidth;charset=UTF-8");

var image_suffix = '_' width + 'px_' + width + 'px.png'; // some_image_1200px_800px.png