Подтвердите адрес электронной почты и пароль из массива существующих сообщений электронной почты и паролей в jQuery

Question

У меня есть два массива emails и passwords (хотя вы можете увидеть больше), которые я хочу использовать для аутентификации пользователей во время входа. Это практическая проблема, а не что-то для реализации в отрасли. См. Ниже:

Другие массивы checkEmails и checkPasswords здесь не используются, но они действуют как хранилище даже для не удалось войдите в систему. В коде у меня есть условие, которое аутентифицируется с использованием только заранее определенного адреса электронной почты и пароля. См. Ниже:

$("#myForm").submit(function(e) {
  e.preventDefault();
  if ($("#inputEmail").val() != '' && $("#inputPassword").val() != '') {
    if ($("#inputEmail").val() == 'quis@google.com' && $("#inputPassword").val() == 'quis') {
      window.location.href = './database.html';
    } else {
      alert('invalid username password');
    }
  } else {
    alert('username or password cann\'t be blank');
  }
});

Но теперь я хочу, чтобы аутентификация осуществляла поиск в массивах emails и passwords. Вот весь пользовательских скриптов. js файл для ссылка .

$("#myForm").submit(function(e) {
  e.preventDefault();
  if ($("#inputEmail").val() != '' && $("#inputPassword").val() != '') {
    if ($("#inputEmail").val() == 'quis@google.com' && $("#inputPassword").val() == 'quis') {
      window.location.href = './database.html';
    } else {
      alert('invalid username password');
    }
  } else {
    alert('username or password cann\'t be blank');
  }
});

const form = document.querySelector('form');
const input = document.getElementById('inputUsername');
const inputTwo = document.getElementById('inputEmail');
const inputThree = document.getElementById('inputPassword');
const ul = document.querySelector('ul')
const button = document.querySelector('button')

let usernamesArray = localStorage.getItem('usernames') ?
JSON.parse(localStorage.getItem('usernames')) : []

let emailsArray = localStorage.getItem('emails') ?
JSON.parse(localStorage.getItem('emails')) : []

let passwordsArray = localStorage.getItem('passwords') ?
JSON.parse(localStorage.getItem('passwords')) : []

let checkEmailsArray = localStorage.getItem('checkEmails') ?
JSON.parse(localStorage.getItem('checkEmails')) : []

let checkPasswordsArray = localStorage.getItem('checkPasswords') ?
JSON.parse(localStorage.getItem('checkPasswords')) : []

const liMaker = text => {
const li = document.createElement('li')
li.textContent = text;
ul.appendChild(li);
}

const liMakerTwo = text => {
const liTwo = document.createElement('li')
li.textContent = text;
ul.appendChild(li);
}

const liMakerThree = text => {
const liThree = document.createElement('li')
li.textContent = text;
ul.appendChild(li);
}
//let usernamesArray = []

localStorage.setItem('usernames', JSON.stringify(usernamesArray));
const data = JSON.parse(localStorage.getItem('usernames'))

//let emailsArray = []

localStorage.setItem('emails', JSON.stringify(emailsArray));
const dataTwo = JSON.parse(localStorage.getItem('emails'))

//let passwordsArray = []

localStorage.setItem('passwords', JSON.stringify(passwordsArray));
const dataThree = JSON.parse(localStorage.getItem('passwords'))

//let checkEmailsArray = []

localStorage.setItem('checkEmails', JSON.stringify(checkEmailsArray));
const dataFour = JSON.parse(localStorage.getItem('checkEmails'))

//let checkPasswordsArray = []

localStorage.setItem('checkPasswords', JSON.stringify(checkPasswordsArray));
const dataFive = JSON.parse(localStorage.getItem('checkPasswords'))

form.addEventListener('submit', function(e){
e.preventDefault()

checkEmailsArray.push(inputTwo.value)
localStorage.setItem('checkEmails', JSON.stringify(checkEmailsArray));

checkPasswordsArray.push(inputThree.value)
localStorage.setItem('checkPasswords', JSON.stringify(checkPasswordsArray));

usernamesArray.push(input.value);
localStorage.setItem('usernames', JSON.stringify(usernamesArray));

emailsArray.push(inputTwo.value)
localStorage.setItem('emails', JSON.stringify(emailsArray));

passwordsArray.push(inputThree.value)
localStorage.setItem('passwords', JSON.stringify(passwordsArray));  

});

I попытался заменить 'quis@google.com' на emails array и 'quis' на passwordsArray, но аутентификация с использованием этого массива не удалась. У меня мало опыта с JS функциями, массивами и c, поэтому я застрял. Помогите мне, ребята :-) Вот логин. html файл на всякий случай.

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width", initial-scale="1">
    <title>Signin #DB</title>
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link rel="stylesheet" href="https://unpkg.com/primitive-ui/dist/css/main.css">
    <link href="css/signin.css" rel="stylesheet" type="text/css">
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="js/jquery-3.4.1.min.js"></script>
  </head>
  <body class="text-center">
    <form class="signin" id="myForm">
        <h1 class="h3 mb-3 font-weight-normal">Please Sign In</h1>
        <label for="inputEmail" class="sr-only">Email Address</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="Email Address" required autofocus>
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="Password" required><br>
        <button class="btn btn-lg btn-primary btn-block" type="submit">Sign In</button>
    </form>
    <script src="js/userscripts.js"></script>
  </body>
</html>

Answer 1

Вы можете проверить, включено ли ваше значение (имя пользователя и / или пароль) в массив, используя Массив #, включающий .

Пример:

var emails = ["email@email.com", my@email.com"]
var passwords = ["1234", 5678"]

emails.includes("email@email.com") // returns true
emails.includes("foo@bar") // returns false

passwords.includes("1234") // returns true
password.includes("an actual password") // returns false

Таким образом, вы можете проверить это, выполнив что-то вроде этого: просто имейте в виду, что массивы писем и паролей на самом деле приходят из вашего localStorage. Вы должны изменить это на этом примере.

var isValidEmail = emails.includes($("#inputEmail").val())
var isValidPassword = passwords.includes($("#inputPassword").val())

if (isValidEmail && isValidPassword) {
  // Do something
} else {
  // Handle error
}