Как сравнить входные данные и данные JSON - PullRequest
Новая
       32

Как сравнить входные данные и данные JSON

0 голосов
/ 10 сентября 2018

Я работаю над школьным проектом, и мне нужно проверить некоторых пользователей без создания реальной базы данных.Моя проблема в том, что когда я сравниваю информацию, введенную во входных данных, с информацией, хранящейся в JSON, появляется ошибка для каждого параметра, который не совпадает.Я хочу уменьшить количество ошибок до одной (в случае, если имя пользователя или пароль не совпадают с информацией, хранящейся в JSON).Вот мой JavaScript: 

const form = document.querySelector('form');

form.addEventListener('submit', function(e){
	e.preventDefault();
    
    const emailInput = document.querySelector('#email').value;
	const pwdInput = document.querySelector('#pwd').value;

	const object = {
		email: emailInput,
		pwd: pwdInput
	};

fetch('users.json')
  .then(res => res.json())
	.then(data => {
		data.forEach(function(user) {

			const userInfo = JSON.stringify(user);
			const databaseInfo = JSON.stringify(object);


			if(userInfo === databaseInfo) {
					console.log('success');
			} else {
				console.log('err');
			}

		});
	})

	.catch(error => console.log('error'));

});

А вот поддельная база данных, созданная с помощью JSON: 

     [
      {"email": "James", "pwd": "1111"},
      {"email": "Peter", "pwd": "2222"},
      {"email": "Josh", "pwd": "3333"}
     ]

Ответы [ 3 ]

0 голосов
/ 10 сентября 2018

Я пытался объяснить в комментариях, но, вероятно, вам проще показать.Я думаю, что лучше сравнивать наименьший возможный объем данных (а не большую строку JSON), например, электронную почту с электронной почтой и пароль с паролем.

Поэтому я изменил ваш if, чтобы сделать более простое сравнение.

Чтобы объединить все ваши ошибки в одну, вы можете включить флаг и установить его на true, если совпадение найдено.Затем вне цикла forEach вы можете проверить этот флаг и записать только 1 ошибку (если совпадений нет) 

var users = [{
  email: "user1",
  pwd: "pass1"
}, {
  email: "user2",
  pwd: "pass2"
}];

var object = {
  email: "user3",
  pwd: "pass3"
};

var isMatch = false;
users.forEach(function(user) {
  if (user.email === object.email && user.pwd === object.pwd) {
    console.log("success");
    isMatch = true;
  }
});

if (!isMatch) {
  // only logs once even though there are multiple users
  console.log("No Match!");
}
0 голосов
/ 11 сентября 2018

Основная идея вашей функции заключается в том, чтобы, учитывая кортеж (имя пользователя, пароль), проверить, существует ли он в вашей базе данных, которая в данном случае является массивом объектов. Можно сказать, что вы хотите отфильтровать из массива записи, чьи имя пользователя и пароль соответствуют тому, что было вставлено пользователем. Поскольку не должно быть повторяющихся кортежей имени пользователя / пароля, ваш фильтр должен возвращать соответствующий кортеж или ноль.

Подход к этому может быть следующим: 

function verifyLogin(loginObject) {
  return new Promise((resolve, reject) => {
    fetch('users.json')
      .then(res => res.json())
      .then(data => data.filter(entry => entry.email ===
loginObject.email && loginObject.pwd === object.pwd).length > 0 ? resolve(true) : resolve(false))

      .catch(error => reject(error));

  });
})

}

verifyLogin(loginObject)
  .then(result => result === true ? console.log('Login successful!') : console.log('Login failed'))
  .catch(error => console.log(error))

Таким образом, код показывает, что вы пытаетесь выполнить, и делает это без побочных эффектов.

0 голосов
/ 10 сентября 2018

Использование ванильного JavaScript: 

// This is only to simulate your fetch from JSON
function fakeFetch () 
{
  return Promise.resolve([
    {"email": "James", "pwd": "1111"},
    {"email": "Peter", "pwd": "2222"},
    {"email": "Josh", "pwd": "3333"}
  ]);
}

const form = document.querySelector('form');

form.addEventListener( 'submit', function(e){
  e.preventDefault();
    
  const emailInput = document.querySelector('#email').value;
  const pwdInput = document.querySelector('#pwd').value;

  const object = {
    email: emailInput,
    pwd: pwdInput
  };

  fakeFetch()     
  .then( users => {
   
    // Check each user in users and try to find a match
    for ( let user of users )
    {
      // Destructuring email and password from the current user
      let { email, pwd } = user;
      
      // Comparing email and pwd from active user with the ones in object
      if ( email === object.email && pwd === object.pwd )
      {
        // Found, do something
        console.log( 'found!' );
        return;
      }
    }
    
    // Not found, do something else
    console.log( 'Not found...' );
    
  })
  .catch(error => console.log( error ) );

});
<form>
  <input type="text" id="email"/>
  <input type="test" id="pwd"/>
  <input type="submit"/> 
</form>
...