본문 바로가기

Programming/javascript

[javascript] 쿠키를 이용한 로그인 아이디 저장

쿠키를 이용한 로그인 아이디 저장



login.jsp

<body>

<!-- 아이디 저장 여부 -->

아이디 <input type="text" id="user_id"><br>

비밀번호 <input type="password" id="user_password">

<input type="checkbox" id="cb_saveId"> 아이디 저장 <br>

<input type="button" id="btn_login">로그인

</body>



js

<script type="text/javascript">

$(function(){

// 쿠키값을 가져온다.

var cookie_user_id = getLogin();


/**

* 쿠키값이 존재하면 id에 쿠키에서 가져온 id를 할당한 뒤

* 체크박스를 체크상태로 변경

*/

if(cookie_user_id != "") {

$("#user_id").val(cookie_user_id);

$("#cb_saveId").attr("checked", true);

}


// 아이디 저장 체크시

$("#cb_saveId").on("click", function(){

var _this = this;

var isRemember;

if($(_this).is(":checked")) {

isRemember = confirm("이 PC에 로그인 정보를 저장하시겠습니까? 

PC방등의 공공장소에서는 개인정보가 유출될 수 있으니 주의해주십시오.");

if(!isRemember)    

$(_this).attr("checked", false);

}

});


// 로그인 버튼 클릭시

$("#btn_login").on("click", function(){

if($("#cb_saveId").is(":checked")){ // 저장 체크시

saveLogin($("#virtual_id").val());

}else{ // 체크 해제시는 공백

saveLogin("");

}

});

});


/**

* saveLogin

* 로그인 정보 저장

* @param id

*/

function saveLogin(id) {

if(id != "") {

// userid 쿠키에 id 값을 7일간 저장

setSave("userid", id, 7);

}else{

// userid 쿠키 삭제

setSave("userid", id, -1);

}

}


/**

* setSave

* Cookie에 user_id를 저장

* @param name

* @param value

* @param expiredays

*/

function setSave(name, value, expiredays) {

var today = new Date();

today.setDate( today.getDate() + expiredays );

document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + today.toGMTString() + ";"

}


/**

* getLogin

* 쿠키값을 가져온다.

* @returns {String}

*/

function getLogin() {

// userid 쿠키에서 id 값을 가져온다.

var cook = document.cookie + ";";

var idx = cook.indexOf("userid", 0);

var val = "";


if(idx != -1) {

cook = cook.substring(idx, cook.length);

begin = cook.indexOf("=", 0) + 1;

end = cook.indexOf(";", begin);

val = unescape(cook.substring(begin, end));

}

return val;

}

</script>