오늘은 <로그인 기능 만들기> 에 대해 알아본대요!
먼저 <자바스크립트로 로그인 기능 구현하기> 강의부터 볼게요!
prompt(" "); 라는 명령어를 배웠어요.
코딩을 통해 써보도록 할게요!
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
prompt("비밀번호");
</script>
</body>
</html>
결과화면 바로 볼게요
이렇게 결과화면이 나왔어요!
그러면 이제 응용해서 배웠던것들을 사용해볼게요!
이렇게 코딩을 해서 비밀번호가 1111이어야 페이지에 들어갈 수 있게 허용하도록 해볼게요!
비밀번호를 맞게 입력하면 접근권한이 허용되었다는 문구가 나오게 됩니다.
비밀번호를 틀리게 하면 비밀번호가 틀렸다고 나오겠죠...?ㅎㅎ
<-PHP로 로그인 기능 구현하기>
우선 소스로 알아보도록 할게요!
저는 JavaScript랑 PHP를 같이 써서 활용해볼거에요!ㅎㅎ
6-1.php
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form action="6-2.php">
<script>
name = prompt ("안녕하세요. 본인 이름을 적어주세요.");
</script>
<p>비밀번호를 입력해주세요.</p>
<input type="text" name="password">
<input type="submit">
</form>
</body>
</html>
여기 소스를 보시면 JavaScript를 통해 이름을 적는 스크립트가 있습니다.
그러고 난 후에 비밀번호를 입력하는 폼을 만드는 거에요!ㅎㅎ
결과화면을 보면서 이해해보세요
6-2.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
document.write("<h1>안녕하세요."+name+"님!</h1><br>");
</script>
<?php
$password = $_GET["password"];
if($password=="1111"){
echo "<br> <h2>접근권한이 허용되었습니다.</h2>";
}
else {
echo "죄송합니다. 접근하실 수 없습니다.";
}
?>
</body>
</html>
이상 Day13일차 포스팅 완료하겠습니다!
댓글