개발 일지 중복확인 axios.get?

const [userInfo, setUserInfo] = useState({
    id: "",
    password: "",
    rePassword: "",
    email: "",
    name: "",
    birth: "",
    number: "",
  });

  const [idErrMsg, setIdErrMsg] = useState(""); // id 에러 메세지
  const [idCheckMsg, setIdCheckMsg] = useState(""); // id 사용가능 메세지

// 아이디 유효성 검사 후 중복 검사 
const idValidation = (e) => {
    const regExp = /^[a-z0-9]{4,10}$/;
    if (!regExp.test(e.target.value)) {
      setIdErrMsg("아이디는 4~10자 영어 소문자, 숫자를 사용하세요.");
    } else {
      setIdErrMsg("");
      axios
        .get(`${process.env.REACT_APP_API_URL}/user/id?id=${id}`)
        .then((res) => {
          const resMessge = res.data.message;
          if (resMessge === "사용 가능한 아이디입니다.") {
            setIdErrMsg("");
            setIdCheckMsg("사용 가능한 아이디입니다.");
          } else if (resMessge === "이미 사용중인 아이디입니다.") {
            setIdErrMsg("이미 사용중인 아이디입니다.");
            setIdCheckMsg("");
          }
        });
    }
  };

회원가입 페이지를 구현하던 와중에 문든 의문이 들었습니다.

입력한 아이디에 대한 중복확인을 할때, post가 보내야할지, get으로 보내야할 지 의문이 들더군요.

저는 당연하게 회원가입에 입력된 아이디 정보를 axios.post로 요청을 보낸 뒤, 서버가 post요청으로 들어온 아이디를 DB에서 조회하면 된다고 생각했습니다.

GET 요청은 조회! POST 요청은 생성!

post 요청으로 보내야한다고 생각했던 가장 큰 이유는 get요청은 데이터를 전달할 수 없다고 알았기 때문이었죠.

GET방식 :localhost:8888/?id=banana&pwd=hong

출처: https://xzio.tistory.com/1753 [코딩창고]

GET은 입력된 아이디를 parameter 값으로 url에 담아 서버로 요청을 보낼 수 있습니다. 따라서 GET방식은 숨겨야할 정보를 url로 노출시키는 보안상의 문제를 가집니다.

그런데도, 아이디 중복확인에 GET 방식을 사용한 이유는 무엇일까요?
바로, 중복확인은 조회를 우선으로 두기 때문입니다.
POST 방식은 서버로 리소스를 생성하거나 업데이트하기 위해 데이터를 보낼 때 사용되는 방식입니다.
따라서 DB에 아이디가 중복되었음을 확인만 하면 되기 때문에,
GET 방식을 사용하여 중복여부만 요청하면 되기 때문이죠.
게다가, 아이디는 노출되어도 보안의 위험이 덜하기 때문에, get으로 하는 것이 유리하다는 결론을 내릴 수 있었습니다.