Задать вопрос
Muranx
@Muranx
кто понял this тот в цирке не смеётся

Как отрисовать страницу при асинхронном POST запросе?

Здравствуйте!

На стартовой странице index.html есть форма авторизации

<div class="formWrapper">
	<div class="formDisclamer">Войти</div>
<form method="POST" action="index.php">
	<input type="text" class="loginInput">
	<input type="text" class="passwordInput">
	<p class="showErrors"></p>
	<input class="checkUser" type="button" value="Войти">
</form>
</div>

запрос на авторизацию пользователя осуществляется с помощью асинхронного POST запроса на сервер
this.loginFormBtn.addEventListener('click',e=>{
			fetch( 
				this.pathToController ,
				{
					method : 'POST' ,
					body   : JSON.stringify(	
									{
										'login' : this.loginInput.value ,
										'password' : this.passwordInput.value
									}
							 )
				}
			)
			.then(data=>console.log(data.json()));
		});

В данном случае, в промисе я могу спокойно обрабатывать всякие ответы с сервера, вроде не верно введённых данных пользователя, но если пользователь ввёл корректные данные , и никаких исключительных ситуаций на сервере не возникло, то как мне отрисовать стартовую страничку в бразуере? Т.е. у меня получается отправить в случае корректных данных пользователя ответ клиенту в виде html странички , НО он просто отображается во вкладке "сеть" браузера, но разумеется отрисовки в данном случае не происходит. Конечно есть топорный способ вроде

.then(data=>{
    document.body.innerHTML = data //ну вроде как отрисовать html пришедший с сервера
});

подскажите , как лучше сделать, т.к. опыта у меня нет, а в интернетах в основном простые примеры, которые не подходят под выбранную мною архитектуру обработки запросов на сервере, или мою неопытную их реализацию?
  • Вопрос задан
  • 188 просмотров
Подписаться 1 Простой 2 комментария
Пригласить эксперта
Ответы на вопрос 3
Stalker_RED
@Stalker_RED
Если страница с формой и главная - это одна и та-же страница, то достаточно location.reload()
Если разные страницы - редирект.

Если у вас SPA - то можете и в самом деле body заменить, но однажды вам захочется бросить самодельный SPA и перейти на какой-то из SPA-фреймворков.
Ответ написан
Комментировать
@alexalexes
Если у вас строго режим одностраничного сайта, то да, сами перелицовываете body в любой непонятной ситуации (на самом деле для такой модели подбирают подходящий клиентский фреймворк. сами вы вряд ли охватите все обработчики событий, чтобы не заботится об реактивности блоков всей страницы). При этом нужно не забывать вести url history, чтобы адрес страницы фиктивно изменялся, следуя логике посещения виртуально нарисованных разделов сайта.
Или же у вас не строго одностраничный сайт, то...
Если у вас только некоторые контейнеры на странице обновляют сведения по ajax, то на какие-то действия нужно вызывать перезагрузку страницы, изменяя windows.location.href / windows.location.reload.
Ответ написан
Комментировать
zkrvndm
@zkrvndm
Архитектор решений
document.write = data;
document.close();
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы