⚡ 1. local storage 사용법( - front 주로사용)
key값은 중복 불가!!
<body> <input type="button" value="로컬스토리지 값 가져오기" onclick="zzz()"> <input type="button" value="로컬스토리지 삭제" onclick="abc()"> </body> <script type="text/javascript"> localStorage.setItem("product","냉장고"); //값 세팅 localStorage.setItem("product1","냉장고1"); localStorage.setItem("product2","냉장고2"); function zzz(){ var data = localStorage.getItem("product"); console.log(data); } function abc(){ localStorage.removeItem("product"); //값만삭제 - 버튼 누르면 실시간 바로 삭제됨 //localStorage.clear(); //완전 싹다 삭제 } </script>
⚡ 2. session storage 사용법(- backend 주로 사용)
<script type="text/javascript"> sessionStorage.setItem("mid","apink"); </script>
=>
1,2파일 닫아도 localstorage도 product,냉장고 들어가있음 - 창 닫았다 켜도 계~~~~속 남아있음
∴ 아이디 비밀번호 이런거 넣으면 절~~~~~대 안됨!!
session storage는 해당페이지에서만 작동 - 창 닫을시 사라짐 (해당페이지에서만 사용 가능하기때문에 백엔드가 주로 사용)
🔽 로그인 저장
https://dev-eunse.tistory.com/150 여기서 하던거를 로그인 저장기능 붙이기
⚡ localstorage 이용한 로그인 정보 저장
사실 이 기능을 실무에서 잘 만들진 않음
<body> <form id="frm"> <p>회원 로그인</p> 아이디 : <input type="text" name="uid" id="uid"><br> 패스워드 : <input type="text" name="upass" id="upass"><br> <label><input type="checkbox" id="save_id">아이디 저장</label><br><br> <button>로그인</button> </form> </body> <script type="text/javascript"> $(function(){ var $st = localStorage.getItem("userid"); if($st != null){ //값이 있을 경우 $("#uid").val($st); $("#save_id").prop("checked",true); } $("#frm").submit(function(){ if($("#uid").val() == "" || $("#upass").val() == ""){ alert("id 및 패스워드를 입력하세요"); return false; }else{ $("#frm").attr("method","post"); $("#frm").attr("action","./loginok.do"); return true; //submit에선 이렇게 작성해도됨 } }); //체크박스 체크 하는순간~ $("#save_id").click(function(){ if($("#uid").val() == ""){ alert("아이디 저장시 해당 아이디 값을 입력하셔야합니다.") $("#save_id").prop("checked",false); }else{ var $k = $("#save_id").is(":checked"); if($k == true){ localStorage.setItem("userid",$("#uid").val()); }else{ localStorage.removeItem("userid"); } } }) }) </script>
'CLASS > SERVLET' 카테고리의 다른 글
| #7-2 / 첨부파일 기능 - java + io (0) | 2024.06.19 |
|---|---|
| #7-1 / 회원 가입 후 로그인,로그아웃 (0) | 2024.06.19 |
| #6-2 / session,cookie (0) | 2024.06.18 |
| #6-1 / 간편 회원가입⭐ (0) | 2024.06.18 |
| #5 / 🌺 MVC? / excute,statement정리 (0) | 2024.06.17 |