2016-05-25 5 views
-4

У меня проблемы с моей системой входа. Он работает для первых учетных записей в базе данных, но он не работает на последних, начиная с человек 4. Я знаю, что в моем коде есть какая-то ошибка, потому что у меня есть еще один фрагмент кода, который равен точно, идентичный в структуре кода, и просто имеет разную информацию.Моя система входа не работает

Вот код:

<!DOCTYPE html> 
<html> 
    <head> 
     <style> 
      form { 
       font-family: "Avenir", "Segoe UI Light", "Helvetica", serif, sans-serif; 
      } 
      body { 
       text-align: center; 
      } 
      #button { 
      color: rgb(0, 0, 0); 
      border: none; 
      background: rgba(255, 255, 255, 0.5); 
      padding: 4px; 
      } 
      #button:hover { 
       background: rgb(255, 255, 255); 
       cursor: pointer; 
      } 
      #errorText { 
       color: rgb(255, 0, 0); 
      } 
      } 
     </style> 
    </head> 
    <body> 
     <form name="login"> 
      Username <br> <input type="text" name="userid"/> 
      <br> 
      Password <br> <input type="password" name="pswrd"/> 
      <br> 
      <input id="button" type="button" onclick="check(this.form)" value=" Login "/> 
      </form> 
      <p id="errorText"></p> 
     <script language="javascript"> 
     //User list 
     var users = [ 
      { 
       userid: "person1", 
       password: "password1", 
       link: "http://www.apple.com/" 
      }, 
      { 
       userid: "person2", 
       password: "password2", 
       link: "http://www.apple.com/" 
      }, 
      { 
       userid: "person3", 
       password: "password3", 
       link: "http://www.apple.com/" 
      }, 
      { 
       userid: "person4", 
       password: "password4", 
       link: "http://www.apple.com" 
      }, 
      { 
       userid: "person5", 
       password: "password5", 
       link: "http://www.apple.com" 
      }, 
      { 
       userid: "person6", 
       password: "password6", 
       link: "http://www.apple.com" 
      } 
     ] 
     //Function to check "userid" & "password" 
      function check(form) { 
       //Cycles through all of the users 
       for (var i = 0; i < users.length; i++) { 
        if(form.userid. value.toLowerCase() == users[i].userid && form.pswrd.value == users[i].password) { 
         window.open(users[i].link) 
         document.getElementById("errorText").innerHTML = "" 
        } else { 
         document.getElementById("errorText").innerHTML = "Incorrect username/password! Please try again." 
        } 
       } 
      } 
     </script> 
    </body> 
</html> 

Я отредактированное информацию, но в реальном пути есть реальные имена пользователей, пароли и ссылки.

Редактировать: Я серьезно не могу поверить, что все, что вы, ребята, просто критикуете. Я не пришел сюда, чтобы люди издевались надо мной, я пришел сюда за помощью.

Редактировать 2: Я не могу поверить, что на самом деле у вас хватило смелости удалить мое редактирование. Просто вау.

+2

Я не знаю, контекст этот проект, но проверка подлинности на стороне клиента завершена небезопасно. Если это не простая HTML-страница, с которой вам интересно, вы не должны этого делать. – mdickin

+1

Вы можете определить, что именно не работает? –

+0

Добавьте 'return false' в функцию или ваша форма будет отправлена ​​на сервер. –

ответ

0

Я создал этот код JS Fiddle из вашего кода, и он отлично работает на нем.

Большая проблема заключается в том, что вы передаете имя пользователя и пароль на стороне клиента в JavaScript, поэтому любой, кто смотрит на код, может легко увидеть имя пользователя и пароль, которые являются ОГРОМНОЙ проблемой безопасности. Даже если имя пользователя, пароль и данные ссылки передаются Ajax, это все еще ДЕЙСТВИТЕЛЬНО легко читается.

Вся пользовательская аутентификация должна выполняться на стороне сервера с чем-то вроде PHP в зависимости от вашей настройки хостинга. Этот код не может быть просмотрен пользователем.

Потому что он не позволит мне представить без него:

HTML

<form name="login"> 
    Username <br> <input type="text" name="userid"/> 
    <br> 
    Password <br> <input type="password" name="pswrd"/> 
    <br> 
    <input id="button" type="button" onclick="check(this.form)" value=" Login "/> 
</form> 
<p id="errorText"></p> 

CSS

form { 
    font-family: "Avenir", "Segoe UI Light", "Helvetica", serif, sans-serif; 
} 
body { 
    text-align: center; 
} 
#button { 
color: rgb(0, 0, 0); 
border: none; 
background: rgba(255, 255, 255, 0.5); 
padding: 4px; 
} 
#button:hover { 
    background: rgb(255, 255, 255); 
    cursor: pointer; 
} 
#errorText { 
    color: rgb(255, 0, 0); 
} 
} 

JS

//User list 
var users = [ 
    { 
     userid: "person1", 
     password: "password1", 
     link: "http://www.apple.com/" 
    }, 
    { 
     userid: "person2", 
     password: "password2", 
     link: "http://www.apple.com/" 
    }, 
    { 
     userid: "person3", 
     password: "password3", 
     link: "http://www.apple.com/" 
    }, 
    { 
     userid: "person4", 
     password: "password4", 
     link: "http://www.apple.com" 
    }, 
    { 
     userid: "person5", 
     password: "password5", 
     link: "http://www.apple.com" 
    }, 
    { 
     userid: "person6", 
     password: "password6", 
     link: "http://www.apple.com" 
    } 
] 
//Function to check "userid" & "password" 
    function check(form) { 
     //Cycles through all of the users 
     for (var i = 0; i < users.length; i++) { 
      if(form.userid. value.toLowerCase() == users[i].userid && form.pswrd.value == users[i].password) { 
       window.open(users[i].link) 
       document.getElementById("errorText").innerHTML = "" 
      } else { 
       document.getElementById("errorText").innerHTML = "Incorrect username/password! Please try again." 
      } 
     } 
    } 
+0

Я фактически изменяю учетные данные в unicode, используя это: https://www.branah.com/unicode-converter Есть ли способ исправить это? –

+0

Это все еще очень небезопасно. По какой-то причине образец JS Fiddle, который я предоставил, по-видимому, работал раньше для меня. Вот прямая копия и вставка вашего кода, и, похоже, она работает нормально, поэтому должно быть что-то еще. https://jsfiddle.net/7fk9euy9/1/ – Anialation