GET

주소에 데이터를 추가하여 전달하는 방식
보통 쿼리 문자열(query string)에 포함되어 전송되므로, 길이에 제한이 있으며
주소에 데이터가 보이므로 보안상 취약점이 존재한다.
(로그인 할 때 GET방식으로 한다면 사용자 ID,PASSWORD가 주소창에 뜰 것.)
중요한 데이터 혹은 길이가 긴 데이터는 POST방식을 사용하여 요청하는 것이 좋지만
GET방식이 POST방식보다 상대적으로 빠른 전송방식이다.
노출되어도 상관없는 것들은 GET으로.
https://velog.io/write?id=b794a147-5889-4c02-a51a-9ef2e0685579
물음표(?)로 이루어져 있는 형식을 쿼리스트링이라 함.

POST

데이터를 별도로 첨부하여 전달하는 방식
브라우저 히스토리에도 남지 않고 데이터는 쿼리 문자열과는 별도로 전송된다.
따라서 데이터의 길이에 제한도 없으며, GET방식보다 보안성이 높다.
하지만 GET방식보다 상대적으로 느리다.

결론
: 전송할 데이터의 양이 작고 노출되어도 무방하다면 GET방식을 사용하고
전송할 데이터의 양이 크거나 노출이 되면 안될 데이터라면 POST방식을 사용한다.

A라는 페이지에서 B페이지로 이동을 원한다면
response.sendRedirect("경로")

Ajax

(Asynchronus Javascript and XML)

빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법이다.
Ajax는 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지 일부분만을 갱신할 수 있다.
백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있다. 이 때 아래와 같은 데이터를 주고 받을 수 있다.

• JSON
• XML
• HTML
• 텍스트파일

Ajax의 장점
1. 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있다.
2. 웹 페이지가 로드된 후에 서버로 데이터 요청을 보내거나 받을 수 있다.
3. 다양한 UI(동적 페이지) 구현이 가능해진다.

Ajax의 단점
1. 페이지 이동이 없기 때문에 히스토리 관리가 안된다.
2. 반복적인 데이터를 요청하면 느려지거나 작동하지 않게 된다.
3. 페이지의 이동이 없다는 것은 보안 상의 문제도 발생할 수 있다는 것이다.

Ajax의 구성 요소

• 웹 페이지의 표현을 위한 HTML과 CSS
• 데이터에 접근하거나 화면 구성을 동적으로 조작하기 위해 사용되는 DOM모델
• 데이터 교환을 위한 JSON이나 XML
• 웹 서버와의 비동기 통신을 위한 XMLHttpRequest 객체
• 위에서 언급한 모든 기술을 결합하여 사용자가 작업 흐름을 제어하는 데 사용되는 자바스크립트

XMLHttpRequest 객체

• var 객체명 = new XMLHttpRequest();
• Ajax의 가장 핵심적인 구성 요소는 바로 XMLHttpRequest 객체이다.
• Ajax에서 XMLHttpRequest 객체는 웹 브라우저가 서버와 데이터를 교환할 때 사용된다. 웹 브라우저가 백그라운드에서 계속해서 서버와 통신할 수 있는 것은 바로 이 객체를 사용하기 때문이다.

서버에 요청하기

• Ajax에서는 XMLHttpRequest 객체를 사용하여 서버와 데이터를 교환한다.
• 따라서 서버에 요청을 보내기 위해서는 객체를 생성해야 하고, 객체의 open()메소드와
  send()메소드를 사용하여 요청을 보낼 수 있다.

open()

• 서버로 보낼 Ajax요청 형식을 설정한다.
• open(전달방식, URL, 동기 여부);
  전달방식 : GET, POST 등 요청 방식 작성
  URL : 요청을 처리할 서버의 파일 주소 전달
  동기 여부 : 요청을 동기 식으로 전달할 지, 비동기 식으로 전달할 지를 선택.

send()

• 작성된 Ajax 요청을 서버로 전달.
• 전달 방식에 따라서 인수를 가질 수도 또는 가지지 않을 수도 있다.
  GET 방식 : send()
  POST : send(전송할 데이터의 전달 방식에 맞추어 작성)
• POST 방식에서는 우리가 전달해야할 데이터의 타입을 작성을 해주어야 하는데, 예를 들어 쿼리스트링으로 GET방식으로 보낼 때가 있고, 또는 헤더에 담아서 보내는 경우가 있는데, 헤더에 보내는 Content-Type. 우리가 어떠한 타입으로 이 콘텐트를 보낼거다 라는 걸 작성해 줄 메소드가 필요하다.
  |
  setRequestHeader()
  POST 방식에서 전달할 데이터의 방식(타입)을 설정한다.
  setRequestHeader("Content-Type", "전달할 데이터의 방식");
  // Map 구조이다 (K,V)
  K : 원래 설정되어있던 것을 V : 값으로 변경을 시키는 것.

Ajax 요청 시 XMLHttpRequest 객체는 각 상태별로 readyState가 변한다.
처음에는 readyState가 0(객체명.UNSENT, 보내지 않음)이었다가, open 메소드를 호출하는 순간 1(객체명.OPENED)로 바뀌고 send 메소드를 호출하게 되면 순차적으로 2(객체명.HEADERS_RECEIVED), 3(객체명.LOADING), 4(객체명.DONE)가 된다면 상태코드(객체명.status)가 성공을 의미하는 200,201일 때 응답을 확인해야 한다.