AJAX로 ID중복체크 ( fetch )

dev_swan·2022년 3월 9일
0

Nodejs

목록 보기
7/20
post-thumbnail

fetch

  • 정의
    fetch는 XMLHttpRequest보다 최근에 나오고 보다 사용하기 간단해진 Web API입니다.
    fetch함수는 Response객체를 둘러싼 Promise객체를 리턴합니다.
    그래서 Promise의 메소드인 then을 사용해서 resolve값을 얻을수 있습니다.

  • fetch 사용법

fetch( 요청보낼 URL, 요청 메소드및 요청헤더와 요청시 같이 보낼 body 내용들이 들어갑니다. )

  • fetch 사용예시

  1. 회원가입 페이지에서 ID중복체크 버튼을 클릭시 URL주소로 요청을 보내는데 option에 있는 데이터들로 요청을 보냅니다.

  1. POST idcheck로 요청을 보내면 userid값을 가져와서 필터로 아이디가 중복된 값이 있는지 체크하고 중복된값은 2 중복되지않은 값은 1을 response해줍니다.

  1. response값을 json형태에서 객체형태로 변환해줍니다.

  2. 객체로 받은 result의 내용은 { result : 1or2 } 이런식으로 되있으니 if문을 사용해서 result.reuslt값이 2이면 에러를 던져주고 아니면 사용이 가능한 ID로 표시하고 2이면 사용이 불가능한 ID로 표시합니다.

결과

유저 정보에 admin이라는 ID가 있어 사용이 불가능이라고 출력됩니다.

유저 정보에 test라는 ID가 없으니 사용가능하다고 출력됩니다.

0개의 댓글