38일차. Servlet 6

이제 정말 3 4 입력하고 입력 누르면! 7이 나온다. 

 

// 

 

이젠 페이지를 뒤로 누름 말고 클릭 버튼을 만들어주고 싶다! 

-> 함계 뿐만 아니라 UI 전체를 돌려주기를 바라는 것

 

 

이건 내거 잘못된거

write로 고치고

맨 앞 \도 다 빼야함

 

-> html에서 실행해야함! (java에서 실행하면 500 오류가 남. x가 없어서 null이기에)

 

// 문서를 동적으로 만드는 코드 : 이 코드로 만들어진 결과물 = 동적인 문서, 서버 문서

 

지금은 초간단 페이지라 직접 이렇게 넣어줄 수 있다만...

이게 커지면...  @_@

 

이제 점점 프론트에서 백으로 넘어가는 추세다. 

- 클라이언트 환경에 영향을 굉장히 많이 받으면 백엔드쪽을 더 개발한건데

- 요즘은 스크립트가 예전과는 달리 환경이 점점 좋아지고 있어서 스크립트 활용하기에 좋아서 프론트로 가는 중

- (돌다리 두드리며 가는 중) 

- 스타트업은 무조건 프론트 + 필요하면 백엔드 확장

- (프론트보다 백엔드가 공부량이 적어서, 지금 수업도 프론트 위주로 가이드 잡아주고 있는거라고 하신다)

 

// 

위에 출력 코드가 노가다같음...

-> 좀 더 창의적인 코드를 작성하고 싶다!! 

다행히 대안점이 있다.

 

그 전에 한글 깨지는거를 먼저 해결해보자.

 

계산기

덧셈 

 

이렇게 두 한글이 깨짐 (result는 아까 위에서 0대신 <span>에 넣어준고)

 

위에) ???  (보내는걸 2바이트씩 가야하는데 1바이트로 받은것)

아래) 뾱ㅃㄲ뼝 (정상적으로 갔으나 브라우저가 제대로 읽지 못한 것)

내가 utf-8로 보냈지만, 브라우저가 euc-kr로 읽어버리면 '솔'이 '뾱'이 될 수 있는 것

(1바이트, 2바이트에 너무 몰두하지 말라고 하심)

-> 정상적으로 나옴! 

 

운이 좋았다.

utf로 보냈지만 euc-kr로 읽을 때도 있기 때문 (요즘은 거의 다 utf를 기준으로 쓰기도 하지만...)

 

만약 브라우저를 달리했을 경우(인터넷 익스플로어, 크롬...) 

(일부러 우클릭>인코딩>한국어(euc-kr) 눌렀을 경우) 

내가 utf-8로 계속 줘봤자, 브라우저가 그거로 읽어야!! 

*도구*

1) 메타데이터로 알려주기

2) 응답할 때 header에다가 알려주기

 

(일부러 우클릭>인코딩>한국어(euc-kr) 눌렀을 경우) 이렇게 직접 설정했던거랑 같은 로직

 

지금 이 사진은 UTF-8로 줬는데, EUC-KR로 읽으라고 코드를 적어준 것

 

ㅡㅡㅡㅡㅡ

2) 응답할 때 header에다가 알려주기

Accept : 내 브라우저가 해석할 수 있는 문서의 종류 

Accep-Encoding : 이렇게 보내도 돼

Accep - Language : 나 외국어 이렇게 할 줄 알아

.

.

.

Host: 요청자 IP가 뜸

Referer : 재호출 된건지 알 수 있는 공간 

여기에 있어야

.

.

HTTP 문서에 보면 이런 약속들이 다 있다. 

(톰캣 만드는 사람 입장에서 http를 들여다보면 내공이 쌓일겁니다~) 

(구글에 HTTP Ref라고만 쳐도 엄청 많이 나옴 ex) 200 에러는 뭔지, 200 ok 에러는 뭔지...)

(먼저 ref를 보고! 블로그를 봐도 블로그를 봐야 엉뚱한 지식이 안쌓입니다.)

 

 

2가지 방법! 

1번 방법 쓰면 이렇게 정상적으로 들어온다 :)

---

// 이제부터가 시작! 

고치고 싶은게 눈에 보여야

 

 

57이 뭘 더해줬는지 모름

-> 무엇 무엇을 더했는지 알려주는 기능을 만들어보자.

 

선생님거

이거 왜 print로 함수 안 주지? 

- write도 출력함수이지만...

 

java에서 실행하게 해줘보자

- 사용자의 값이 전달되지 않아서(500 오류)

 

2가지 방법

1) html을 통해서만 전달 

- 전달 않고 기본값을 활용하자

null이 아닐경우에만 실행하게 해주자 (null이면 기본값 0을 쓰고)

 

기본값이 있으니 실행 가능 :) 

 

근데 문제는 null만으로는 만족할 수 없음

-> 값을 넣지 않고 하면 오류가 발생함

 

"" 빈문자가 온거로 인식함

즉, null이 아닌거로 인식한다는 것

 

빈문자열도 아니도록 조건 추가.... 이렇게 하면 오류

-> 빈문자열 비교는 저게 아님 

!=는 객체를 비교한 것

-> 이렇게 하고 실행하면 이제 html에서가 아니라 java 파일에서 실행해도 되는 것! 

---

이제 굳이 html로 사용할 필요가 없어졌다 ~ 

 

자 이제 새로운 문제를 해결해보자

처음 요청했을 때는 애가 안나왔으면 좋겠음

조건문! 

결과는 500 에러 ㅠ

'처음'에는 안나오게 해달라는거니까 

'처음'만 빼달라는거니 x,y가 null일 경우 -> 

한 개만 써도 된다고 한당

ㅡㅡㅡㅡㅡ

 

계산 부분, 출력 부분

처음 요청 왔을 때는 계산 부분이 전혀 쓸모 x 

처음에는 입력폼을 달라는게 전부니까 

 

처음 요청하는 것과

두번째 요청하는게 나눠져 있다. 

 

get 요청, post 요청

 

get 요청 = 나 문서줘. (99.9% 요청은 이거) (뭘 달라고 하는건 다 get 요청임)

post 요청 = 처리해줘 (제출) 

 

ex) 동사무소 가서 인감증명서 발급받는다고 할 때 

맨 처음에는) 입력폼이 나옴 (GET 요청) 

그 다음) 제출 (POST 요청)

 

일반적으로는 get요청 하나로 다 끝나는데

입력폼을 제공하는 경우에는 get요청이 더 있을 수 있는 것

 

ex) 인감증명서 떼러왔다 (get 요청)

입력폼 (get 요청)

제출 (post 요청)

 

get 방식

form이면 post인데 (결국 post인데! 전달 방식이 마치 get같다는것. 마치 get 요청하듯이)

 

get, post 둘 다 할 수 있다는게

get - 직접 입력해서 전달 

post - 순수 post 의미

 

차이) get은 문서 달라고 할 때 값을 같이 요청

post) 요청 헤더에 따로 전달

 

둘 중 하나 해도 되는 듯? 아닌가? post는 body에 전달이라는 워딩이 있었으니... 꼭 post 해줘야 하나.

실습해보기

-> 왼쪽에 post 주지않아도 실행됨 

(이게 중요한게 아닌 것 같음. 어차피 html에서 f11눌러서 실행하는게 아니니 오른쪽에 넣어서 실행된다는게 너무나 당연하기에 ㅋㅋㅋㅋ) 

 

 

-> 이러면 post 방식 안됨 (아래 그림처럼 url 주소가 add가 아니라 직접 2&... 막 이런식으로 되어있는) 

-> 당연하지 ㅠㅠ (html에서 실행하는게 아니라 Calc.java에서 실행하는거니까!) 

전달되는 값이 없는데 계산이 됐네??

요청 헤더에 담아서 전달해줬기에 (post) 

 

사용자가 입력폼 받았다가 제출하는거 

 

ㅡㅡㅡㅡㅡ

이러면 마치 get처럼

 

저기를 post로 굳이 바꿔야 할 경우는 

1) url 많을 때

2) url에 한글, 빈 공백 등 멀티 바이트 쓰는 나라는 form을 url에 붙여서 제공하는건 적합하지 않다. 

 

-> post 방식으로 하는게 바람직하다. (큰 데이터 보낼 때는 보통 post) 

 

제출은 입력한게 있어야 제출 (post)

- 입력한 거 없이 달라는건 다 get 요청

 

이건 get 요청

근데 form이 있지 (입력폼이 있으면 내가 뭔가를 넣어서 제출할테니 달라는거니까 Post 요청)

 

가끔 post 요청 중에서 애매한게 있는거

이건 post하면 끝인데, get요청을 수반하는게 있다는 것 ex) 대표적인게 '검색' 

- 검색하면 '목록을 달라는거니까' get과 다를바가 없음

- 형식은 post지만 (입력폼에 내가 뭔가를 넣으니까) 결국 결과를 달라는 get 요청이니 

-> 검색같은 경우에는 굳이 post 말고 get으로도 요청하는게 좋다. (url 내용)

 

---

Q. 나의 질문 - url 기억해서는 get 요청을 쓰는 이유

(선생님 설명)

- 검색의 경우 get 요청을 사용한다. for '상태값 유지' 

 

ex) 구글에서 "백엔드 동향"을 검색하는 행위는 post 요청 (검색을 했으니)

 

근데 이 결과를 친구한테 정말 공유하고 싶은거지! 

(post 요청 처리로 된 코딩에서는) 지금 내가 "백엔드 동향" 검색해서 보고 있는 url은 post 요청으로 되어서 url에 값이 저장되지 않은 상태. (계산기 예제로 따지면 http://localhost:8080/add)

-> 나는 결과로 나온 것들을 공유하고 싶었는데 친구가 내가 보내준 url로 들어가면 다시 검색해야함

 

(반면 get 요청 처리로 된 코딩에서는) url에 데이터가 담기니까 -> 친구가 바로 결과를 볼 수 있다. 

(계산기 예제로 따지면 http://localhost:8080/add?x=2&y=3 그리고 이 url 들어가면 2+3=5를 볼 수 있다)

 

 

 

 

(소그룹 설명)

post 방식

 

- 헤더에 값을 저장한다. (html 내의 헤더가 아니라, 네트워크상의!) 

 

get 방식

- url에 값을 저장한다. 

-> 지금은 간단한 데이터만 넘기지만, 만약 데이터가 많아지면 url 길이가 엄청나질 것 (메모리상 문제로도)

 

---

cf) out.write() 쓰는 이유

내가 헷갈렸던 write(); 다음에 한 글자씩만 들어가는건 OutStream의 기능 

 

지금 여기 Servlet은 PrintWriter 의 기능

-> 문자열 전문! 특화! 도구

 

cf) out.print를 써도 오류는 나지 않으나 기본적으로 out.print는 위에 보는 것처럼 문자열 전문이라기 보다는 문자열로 변환해서 출력하게 하는게 기본이라 write()를 쓰는걸 장려한다.