* JavaScript Ajax
https://www.w3schools.com/js/js_ajax_intro.asp
* Ajax Request
https://www.w3schools.com/js/js_ajax_http_send.asp
https://www.w3schools.com/js/tryit.asp?filename=tryjs_ajax_get
- XMLHttpRequest: 서버와 데이터 교환할 때 사용됨.
- 서버에 요청을 보낼 때, XMLHttpRequest 객체(Object)의 open()와 send() 메소드를 사용함.
xhttp.open("GET", "ajax_info.txt", true); // open(method, url, async);
xhttp.send(); // send() : GET 방식, send(string) : POST 방식
GET: POST방식보다 빠름
POST: 캐시파일이 옵션이 아닐 때
대용량 데이터를 서버에 보낼 때
user input을 보낼 때
http://nittaku.tistory.com/154?category=728079 (웹브라우저가 서버로 요청 GET, POST 방식 차이)
* XMLHttpRequest
- 백그라운드에서 웹 서버(server)와 데이터를 교환하는데 사용할 수 있음.
즉, 전체 페이지를 다시 로드하지 않고도 웹 페이지의 일부를 업데이트할 수 있음.
- XMLHttpRequest 객체를 만들기 위한 구문 :
var 변수 = new XMLHttpRequest();
(https://blog.naver.com/agensoft/221157835779)
* 백그라운드
- 메인 프로그램 이외에 부수적인 프로그램들.
http://kin.naver.com/qna/detail.nhn?d1id=13&dirId=1302&docId=36722637&qb=67Cx6re465287Jq065OcIOucuw==&enc=utf8§ion=kin&rank=4&search_sort=0&spq=0&pid=TrTiwlpVuEKsstnx360ssssstB4-280408&sid=oxAVFH8J7OGQ6qdVTNd3/A%3D%3D
* XMLHttpRequest 활용
- input(입력)폼을 사용한 로그인 폼 생성 등등에 활용. (ajax가 그런 용도)
http://egloos.zum.com/codecrue/v/2217566
* onreadystatechange
- XMLHttpRequest의 상태가 변경될 때마다 이벤트 호출
- 서버에 요청이 전송되면 -> 그 응답을 기반으로 몇 가지 작업 수행 가능.
- readyState가 변경 될 때마다 -> 그에 따른 대응을 함.
- 생성/저장한 함수마다 자동으로 호출 할 수 있는 readyState 속성이 변경됨.
https://blog.naver.com/lionlyloveil/220391834935
https://pjh445.blog.me/220108101241
* .readyState == 4
- 데이터를 전부 받은 상태
* .status == 200
- 요청 성공
https://blog.naver.com/shdlsdo/220590134013 (readyState 값에 따른 상태)
'Javascript > 배경 & 실무 지식' 카테고리의 다른 글
[Javascript] infinite scroll (리스트 불러오기) (1) | 2023.11.30 |
---|---|
[Javascript] Treeview 트리뷰 (4) | 2023.11.27 |
[Javascript] 한국 우편번호,주소 API(다음,카카오) 테스트 (1) | 2023.11.22 |
[Javascript] Var, Let, Const (1) | 2023.11.15 |
[Javascript] 식별자(Identifier) (0) | 2023.11.15 |