ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [ JSP ] 클라이언트의 요청방식
    PROGRAMMING/Web 2022. 5. 26. 23:42

    하루입니다.

     

     


     

    클라이언트의 요청방식

    클라이언트가 서버로 요청 메세지를 보내는 방식


    GET 방식의 요청

    - 주소창에 주소를 입력해서 요청하는 경우

     

     

    GET 방식의 요청이 발생하는 경우

    •  링크를 클릭해서 요청하는 경우
    <a href="web/about.jsp">회사소개</a>일 때 회사소개를 클릭한 경우

     

    • form태그의 method 속성을 지정하지 않고, 폼 입력값을 서버로 제출하는 경우
    <form action="search.jsp">
    <input type="text" name="keyword" placeholder="검색어를 입력하세요" />
    <button type="submit">검색</button>
    </form>
    위와 같이 작성된 웹 페이지에서 검색버튼을 클릭했을 때

     

    • form태그의 method 속성을 GET으로 지정하고, 폼 입력값을 서버로 제출하는 경우
    <form method="GET" action="search.jsp">
    <input type="text" name="keyword" placeholder="검색어를 입력하세요" />
    <button type="submit">검색</button>
    </form>
    위와 같이 작성된 웹 페이지에서 검색버튼을 클릭했을 때

     


    GET방식의 요청을 사용할 때

    서버로부터 데이터를 조회할 때

    데이터의 흐름 : 클라이언트 <--- 서버
            주소창에 주소를 입력해서 웹 페이지를 요청한다.
            링크를 클릭해서 링크에 지정된 주소의 웹 페이지를 요청한다.
            검색창에 검색어를 입력하고, 해당 검색 결과 페이지를 요청한다.

     


    GET방식의 특징
    서버로 전달되는 값이 요청URL에 뒤에 붙어서 전달된다.

    <form action="search.jsp">
    <input type="text" name="keyword" placeholder="검색어를 입력하세요" />
    <button type="submit">검색</button>
    </form>
    
    검색버튼을 클릭하면 아래와 같은 URL을 서버로 보낸다.
    http://localhost/web/search.jsp?keyword=자바
    • 서버로 전달되는 데이터의 크기에 제한이 있다.
    • 첨부파일을 보낼 수 없다.

    GET 방식 요청일 때 요청 메세지
    요청 메세지의 바디부는 비어 있다.

     

     

    POST 방식의 요청

    • form태그의 method 속성을 POST로 지정하고, 폼 입력값을 서버로 제출하는 경우
    <form method="POST" action="register.jsp">
    <input type="text" name="name" placeholder="이름을 입력하세요" />
    <input type="text" name="id" placeholder="아이디를 입력하세요" />
    <input type="password" name="pwd" placeholder="비밀번호를 입력하세요" />
    <input type="text" name="tel" placeholder="전화번호를 입력하세요" />
    <button type="submit">회원가입</button>
    </form>
    
    위와 같이 작성된 웹 페이지에서 회원가입버튼을 클릭했을 때

     

    POST방식의 요청을 사용할 때

    클라이언트에서 서버로 데이터를 보낼 때
    데이터의 흐름 : 클라이언트 ---> 서버
            회원가입폼에서 회원정보를 입력하고 서버로 제출한다.
            주문정보입력폼에서 주문정보를 입력하고 서버로 제출한다.
            게시글 작성폼에서 게시글정보를 입력하고 서버로 제출한다.
            로그인폼에서 아이디와 비밀정보를 입력하고 서버로 제출한다.

            인스타그램에서 사진과 내용을 입력하고 게시한다.

     

     

    POST방식의 특징

    입력폼에 입력한 모든 정보가 요청메세지의 바디부에 담겨서 서버로 제출된다.
    서버로 전달되는 데이터의 크기에 제한이 없다.
    첨부파일 업로드가 가능하다.

     


    POST 방식 요청일 때 요청 메세지
    요청 메세지의 바디부에 폼입력값이 포함되어 있다.


    사진 설명.  GET은 바디부는 비었고, 헤더에 쿼리스트링(? 뒤에 있는 것)이 있다. POST는 바디부에 내용이 적혀있다. 바디부에 데이터를 담는 게 가능하니 더 많은 값을 담을 수 있는 것. 

     

     

     

     

    GET 방식으로 요청 파라미터 보내기. (중요해요)

    • 링크를 누른다. (링크니까 get 방식)
    • 브라우저가 요청메세지를 생성하고, 그 정보들을 톰캣이 분석하고 HttpServletRequest 객체에 담는다. 안의 값을 요청 파라미터라고 하며, name과 value로 담긴다. 요청객체와 응답객체 둘 다 만든다.
    • param2_jsp의 _jspService() 메소드를 호출한다.
    • request와 response에 요청 응답 객체가 담긴다. 전달받은 HttpServletRequest 객체에서 요청파라미터의 정보를 조회한다.
    • request.getParameter("")를 사용해서 원하는 값을 뽑아낸다. 
    • 필요한 값을 담아 응답한다.

     

    ~ 오늘 한 거 인사정보시스템 만들기 ~

    재밋당 아직 얼렁뚱땅얼레벌레빙글빙글천방지축뚝딱뚝딱 엥 왜 대역 500이 뜨지 ;; 의 상태지만. java + http = jsp 이런 느낌을 받았다. 하긴 생각해보면 jsp는 동적인 웹html 제공하는 애고 우리가 html 사이사이에 필요할 값을 java나 sql 활용해 채워넣는 거니까 느낌이 아니라 사실일 수도?

     

    • 사번: 1, 이름: 김가가, 이메일: aaa@gmail.com 이라는 table이 있다고 할 때, 값들을 sql과 연동해서 실제 데이터를 넣으려고 한다. 더 나아가 직원정보로 들어가 직원 정보를 클릭하면 해당 직원의 상세정보창이 뜨게 한다. CSS는 선생님이 주심. (아주 예뻐요)
    • sql이랑 연동한다고 obdbc11.jar을 lib에 넣었다. 
    • vo, util, dto, dao 패키지를 만들었다. 
    • vo에는 필드를 생성하고 기본생성자와 getter setter를 정의했다.
    • util은 오라클드라이버와 연결하는 getConnection 메소드가 정의되어 있다.
    • dao에는 싱글톤객체, 모든 부서/직원/직업을 반환하는 메소드, id에 따라 해당 부서/직원/직업을 반환하는 메소드를 정의했다. 혼자 구현해 보라고 시간을 좀 주셨는데 어찌저찌 해낸 내가 자랑스러웠다 ㅋㅋㅋㅋㅋㅋㅋㅋ. 게다가 어느 정도 설명까지 할 수 있다. 머릿속으로 나 자신한테 설명하면서 함. 왜 이렇게 들어가는지 ... 아직도 그런 걸 설명해야 한다는 미숙한 면이라고도 해석 가능하지만 저번에 혼자 구현하라고 했을 땐 암것도 못했으니까 많이 발전했다고 생각한다 ^ㅁ^.
    • dto는 직원 정보, 직원의 매니저 정보, 직원의 job 정보 등을 필드에 구현해 선생님이 주셧당.
    <td><%=emp.getId() %></td>

     

    이런 형태로 테이블에 정보 나오게 함.

     

     

     

     

    • 직원 이름을 클릭하면 직원 아이디에 해당하는 상세정보를 제공해야 한다.
    <td><a href="detail.jsp?id=<%=emp.getId() %>"><%=emp.getFirstName() %> <%=emp.getLastName() %></a></td>
    • 직원 이름에 url과 k-v를 적었다. get방식의 쿼리스트링이다.

     

    • detail jsp페이지로 왔다. 요청 파라미터는 id=100이다. request.getParameter("id");를 사용해 값을 value에 답는다. 이 값을 parseInt를 사용해 int형으로 바꾸고 employeeId에 담는다. employeeDao의 싱글턴객체를 정의해 id로 직원 상세정보찾는 메소드를 사용한다.
    <th class="table-dark">아이디</th>
    <td><%=dto.getId() %></td>
    <th class="table-dark">이름</th>
    <td><%=dto.getFirstName() %> <%=dto.getLastName() %></td>

    table 안의 코드는 이런 식으로 짜여졌다.

     

     

    재밌는 하루였다

     

     


     

     

    잘못된 정보에 대한 지적은 언제나 환영입니다. 

     

    복습 끝!

     

     

     

Designed by Tistory.