스프링 쇼핑몰 만들기 #27. 주소 API 사용하기

스프링 쇼핑몰 만들기
- 깃허브 링크

상품 주문시, 지금까지는 모든 주소를 직접 입력해야했습니다. 이렇게 직접 입력하게되면 오입력하는 실수를 할 수 있기 때문에 사용자와 관리자 모두 불편하죠.

그래서 다음 주소 API(우편번호 서비스)를 사용해보겠습니다.

다음 주소 API는 로고를 가리지 않는 조건으로 무료로 사용할 수 있으며, 매우 간편하게 사용할 수 있습니다.

다음 우편번호 서비스에 접속합니다.

공통적으로 이런 느낌입니다.

그중에서 저는 'iframe을 이용한 레이어 띄우기'를 사용했습니다. 기능은 동일하기 때문에 원하는 방식으로 선택하시면 되는데, 레이아를 띄우는 방법은 모바일에서 사용이 불편한 단점이 있습니다.

orderList.jsp에서 주소를 입력하는 인풋박스 부분을 주석처리합니다. 이제 사용하지 않으므로 삭제해도 무관합니다.

다음 우편번호 서비스에서 가져온 코드를 붙여넣습니다. 다른 인풋박스와 같은 구조가 될 수 있도록 <div class="inputArea"> ~ </div> 내부에 넣어줍니다.

우편번호, 일반 주소, 상세 주소에 name속성값을 부여합니다.

name속성값이 있어야 폼(form)으로 전송할 때 원하는 형태의 데이터 타입으로 전송됩니다.

각 요소가 구분될 수 있도록 <p> 태그로 감싸줍니다.

마지막으로 스타일을 적용합니다.

.orderInfo .inputArea #sample2_address { width:230px; }

.orderInfo .inputArea #sample2_detailAddress { width:280px; }

.orderInfo .inputArea #sample2_extraAddress { display:none; }

이제 카트 목록에서 주문하려고 하면, 우편번호 찾기 기능을 이용할 수 있습니다.

잘 입력되는지 확인하기 위해 임의의 값을 입력하고 주문 버튼을 클릭합니다.

에러가 발생했네요.

ORA-12899 에러입니다. 이 에러는 컬럼의 크기보다 더 큰값이 입력되었을 경우 발생하는 에러입니다.

테이블을 확인해보니, 크기를 조금 빠듯하게 설정한것 같습니다.

테이블 수정 쿼리를 이용해 컬럼의 크기를 100으로 수정합니다.

alter table tbl_order

    modify(userAddr1 varchar2(100));



alter table tbl_order

    modify(userAddr2 varchar2(100));

   

alter table tbl_order

    modify(userAddr3 varchar2(100));

이제 다시 테스트해봅니다.

이상없이 주문이 되었으며, 데이터도 이상없이 입력된걸 알 수 있습니다.