Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.08.2017, 16:37
Аспирант
Отправить личное сообщение для АнонимныйПарень Посмотреть профиль Найти все сообщения от АнонимныйПарень
 
Регистрация: 17.03.2017
Сообщений: 67

Помощь с ответом сервера клиенту
Если в коде увидите "swal", не пугайтесь, это фреймворк Sweet Alerts. От обычного alert'a отличается только дизайном!


Есть клиентский код (если точнее - функция).
function verify_auth () {
	var email = $('#inputEmail').val();
	var password = $('#inputPassword').val();

	$.ajax ({
		url : '/autorizate',
		type : 'POST',
		cache : false,
		data : {'email' : email, 'password' : password},
		dataType  : 'html',
		beforeSend : function () {
			$('#verificatebtn').attr('disabled', 'disabled');
		},
		success : function (data) {
			if (data == true) {
				email.val(" ");
				password.val(" ");

				swal({
					title : 'Успех!',
					text : 'Выполняется вход в ваш профиль...',
					type : 'success',
					confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
				});
			}
			else {
				if (data == false) {
					swal({
						title : 'Ошибка!',
						text : 'Что-то пошло не так! Попробуйте ввести данные корректно еще раз!',
						type : 'error',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});
				}
			else {
				if (email == '') {
					swal({
						title : 'Ошибка!',
						text : 'Введите email правильно!',
						type : 'error',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});
					$('#inputEmail').css("border-color", "red");
				}
				if (password == '') {
					swal({
						title : 'Ошибка!',
						text : 'Введите пароль правильно!',
						type : 'error',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});
					$('#inputPassword').css("border-color", "red");
				}
				if (!(email.match('@'))) {
					swal({
						title : 'Ошибка!',
						text : 'Адрес должен содержать символ "@", а после него домен!',
						type : 'error',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});
					$('#inputEmail').css("border-color", "red");
				}
			}
				$('#verificatebtn').removeAttr('disabled');
			}	
		}
	});
};


На сервере есть обработчик:
app.post("/autorizate", urlencodedParser, function (req, res) {
	var	data = {
		email_val : req.body.email,
		password_val : req.body.password
	};

    console.log(data.email_val);
    res.send(data);
});


Все работает, но я не понимаю, почему не появляется alert-оповещение (swal), о том что "Выполняется вход в ваш профиль...". Если можете скорректируйте код слегка.
Ответить с цитированием
  #2 (permalink)  
Старый 02.08.2017, 17:03
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,733

Я всегда думал, что если делаешь дополнительную валидацию форм, то она обязана предшествовать запросу и в случае инвалидности формы не допускать создания запроса.
У вас всё наоборот)

В начало блока «success» затолкайте строку
console.log(data,data==true);

И посмотрите, что в консоль будет выведено.
Ответить с цитированием
  #3 (permalink)  
Старый 02.08.2017, 20:34
Аспирант
Отправить личное сообщение для АнонимныйПарень Посмотреть профиль Найти все сообщения от АнонимныйПарень
 
Регистрация: 17.03.2017
Сообщений: 67

Сообщение от Nexus Посмотреть сообщение
Я всегда думал, что если делаешь дополнительную валидацию форм, то она обязана предшествовать запросу и в случае инвалидности формы не допускать создания запроса.
У вас всё наоборот)

В начало блока «success» затолкайте строку
console.log(data,data==true);

И посмотрите, что в консоль будет выведено.
НЕ СОВСЕМ ВАС ПОНЯЛ! Пожалуйста, объясните!
Я вас понял так:

function verify_auth () {
	var email = $('#inputEmail').val();
	var password = $('#inputPassword').val();

	if (email == '') {
		swal({
			title : 'Ошибка!',
			text : 'Введите email правильно!',
			type : 'error',
			confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
		});
		$('#inputEmail').css("border-color", "red");
	}
	else if (password == '') {
		swal({
			title : 'Ошибка!',
			text : 'Введите пароль правильно!',
			type : 'error',
			confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
		});
		$('#inputPassword').css("border-color", "red");
	}
	else if (!(email.match('@'))) {
		swal({
			title : 'Ошибка!',
			text : 'Адрес должен содержать символ "@", а после него домен!',
			type : 'error',
			confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
		});
		$('#inputEmail').css("border-color", "red");
	}
	else {
		$.ajax ({
			url : '/autorizate',
			type : 'POST',
			cache : false,
			data : {'email' : email, 'password' : password},
			dataType  : 'html',
			beforeSend : function () {
				$('#verificatebtn').attr('disabled', 'disabled');
			},
			success : function (data) {
				console.log(data,data==true);

				if (data == true) {
					$('#inputEmail').val(" ");
					$('#inputPassword').val(" ");

					swal({
						title : 'Успех!',
						text : 'Выполняется вход в ваш профиль...',
						type : 'success',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});

					$('#verificatebtn').removeAttr('disabled');
				}
				else if	(data == false) {
					swal({
						title : 'Ошибка!',
						text : 'Что-то пошло не так...',
						type : 'success',
						confirmButtonText : '<button class="btn btn-link" style="text-decoration: none; color: white; font-size: 2rem;"> OK </button>'	
					});
				}
			}
		});
	}
};


Но так сервер не отвечает ничего и кнопка не возвращается в "активное" состояние. В консоли ничего, а в консоли браузера у data == true значение false

Вот код сервера:

app.post("/autorizate", urlencodedParser, function (req, res) {
	var	data = {
		email_val : req.body.email,
		password_val : req.body.password
	};

    res.send(data);
});
Ответить с цитированием
  #4 (permalink)  
Старый 03.08.2017, 09:27
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,733

Сообщение от АнонимныйПарень Посмотреть сообщение
Но так сервер не отвечает ничего и кнопка не возвращается в "активное" состояние. В консоли ничего, а в консоли браузера у data == true значение false
Вы правильно поняли, что я имел ввиду.
Если сервер не возвращает результат, то тут проблема не в js на стороне клиента, а на стороне сервера.
Удаление атрибута disabled у вас в коде происходит только в случае успешного прохождения авторизации.

С серверным js я не знаком.

PS. у вас метод ajax ожидает от сервера html-контент, а получает явно не его (вероятно json), можно попробовать удалить эту строку:
dataType  : 'html',
Ответить с цитированием
  #5 (permalink)  
Старый 03.08.2017, 10:50
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

АнонимныйПарень,
Данные, передаваемые на сервер
{'email' : email, 'password' : password},

Обработка на сервере
var	data = {
		email_val : req.body.email,
		password_val : req.body.password
	};

Что за body в обработке на сервере? Откуда?
Ответить с цитированием
  #6 (permalink)  
Старый 04.08.2017, 14:22
Аспирант
Отправить личное сообщение для АнонимныйПарень Посмотреть профиль Найти все сообщения от АнонимныйПарень
 
Регистрация: 17.03.2017
Сообщений: 67

Сообщение от Dilettante_Pro Посмотреть сообщение
АнонимныйПарень,
Данные, передаваемые на сервер
{'email' : email, 'password' : password},

Обработка на сервере
var	data = {
		email_val : req.body.email,
		password_val : req.body.password
	};

Что за body в обработке на сервере? Откуда?
Это bodyParser. Специальная штука для обработки данных которые приходят
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
"success" и "failure" приём данных с сервера ??? potkin ExtJS 8 30.05.2012 09:27
Проблема с ответом сервера MrPostman AJAX и COMET 5 29.01.2012 17:26
DOM манипуляции с ответом сервера. ekkl jQuery 16 07.09.2010 23:04
Ответ сервера в плугине ajaxForm отдается неправильно. IgorOk jQuery 11 13.12.2009 04:35
передача массива с сервера subaru Общие вопросы Javascript 3 02.07.2008 19:57