[포트폴리오 페이지]_8단계_로그인 기능구현_(feat.oracleDB)

[환경]

 

개발툴 : IntelliJ

DB : oracle

프레임워크 : spring , mybatis

 

----

개발 목표 : 로그인 기능 만들기

해당 화면에서 데이터베이스에 저장되어있는 아이디와 비밀번호를 가지고 있을 시

해당 화면으로 전환되도록 함.

또한 로그아웃 버튼 클릭시 로그아웃되는 처리까지 진행

 

JSP 부분]

logout.onclick = function(){
    $globalStorage.setValue("loginUser","");
    location.reload();
}

$('.submit-btn').click( async function (){
        let id =idtext.value;
        let pw =pwtext.value;

        let result = await fetch('/join/authlogin.do',{
            method:'POST',
            headers: {
                'content-type' : 'application/json'
            },
            body: JSON.stringify({
                memberId : id,
                memberPw: pw
            })
        }).then(res => res.json());

        if(result){
            $globalStorage.setValue("loginUser",id);
            location.reload();
        }else{
            alert('아이디와 비밀번호를 다시 확인해주세요');
        }
});

 

fetch를 사용하여 url 을 호출하고, data는 id, pw 부분의 값을 받아 json 형식으로 전달한다.

로그인 성공시 localstorage에 id 를 저장하고 reload() 를 한다.

 

localstorage 사용법은 다음 포스트 참고

https://yn971106.tistory.com/54

[LocalStorage]_를 사용하여 값을 받거나 저장하기(feat. Spring)

Controller 부분]

@RequestMapping("/join/authlogin.do")
@ResponseBody
public Boolean loginAuth(@RequestBody Map<String,String> map) throws Exception {

    String Id =map.get("memberId");
    String Pw =map.get("memberPw");

    Map result = memberservice.memberFind(map);
    //Object test1 = result.get("MEMBERPW");
    //System.out.println("result = " + test1);
    System.out.println("result = " + result);
    if(result != null){
        return true;
    }else{
        return false;
    }

}

전달받은 값 -> json 객체 -> 를 서비스에 바로 전달한다.

그리고 그 값을 기준으로 true or false를 리턴한다.

 

Service 부분]

public interface MemberService {
    public void memberJoin(MemberVO member) throws Exception;
    public Map<String, String> memberFind(Map<String,String> map) throws Exception;
    public int idCheck(String memberId) throws Exception;
}

ServiceImpl 부분]

@Override
public Map<String,String>memberFind(Map<String,String> map) throws Exception {

    return membermapper.memberFind(map);

}

받는 값도 Map 형식 돌려주는 값도 Map 형식이다.

 

Mapper 부분]

@Mapper
public interface MemberMapper {

    public void memberJoin(MemberVO member);
    Map<String, String>memberFind(Map<String, String> map);
    public int idCheck(String memberId);
}

해당 memberFind 가 Mapper.xml의 id가 된다.

 

MemberMapper.xml]

<select id="memberFind" resultType="map">
    select * from book_member where memberId = #{memberId} AND memberPw =#{memberPw}
</select>

둘다 일치하는 값이 있으면 그러한 결과를 map 형식으로 반환

 

둘다 일치하는 값이 없으면 null, 있으면 map 형식으로 반환

이를 controller에서 핸들링하여 boolean값을 리턴하였다.

 

감사합니다.