XML : 파일 읽어오기

XML : 파일 읽어오기

 

XML  파일을 읽어오기 위한 단계

 

1. http 통신을 하기위한 객체 생성 (서버와 교류함 - 비동기 통신)

var xhttp = new XMLHttpRequest();

 

- XMLHttpRequest() : 비동기 처리를 하기위한 객체 생성

 

 

xhttp.onreadystatechange = function () {

 

    if( this.readyState == 4 && this.status == 200 ) {

 

            // 파일에서 읽어들인 부분을 서버로 보내고,  다시 데이터를 서버로부터 받는 부분

 

            // this.responseText : 서버로부터 txt파일을 받아옴

    }

}

 

 

 

onreadystatechange : XMLHttp 소속 함수

 

- xhttp.open ("GET", "url", true);

 

// GET 방식 : 서버에서 데이터를 보낼 때 ? 뒤에 데이터를 노출시켜 보냄 ( 검색어 등 표시 ), 최대 보낼 수 있는 용량이 작음(255byte)

// POST 방식 : 서버에서 데이터를 보낼 때 데이터를 body에 숨겨서 보냄

 

// true : open방식을 설정하는지 지정(t/f) - 비동기여부 지정

 

 

 

xhttp.send();

- 데이터를 실제로 보내는 단계

 

 

readystate: 0-4 까지 숫자로 처리단계 표시

0 : open() 메소드를 수행하기전에 출력, 

1 : loading 중.

2 : loading 완료

3 : server 처리 중

4 : server 처리 완료 (끝)

 

 

status : 현재 처리 상태를 숫자로 표시

200 : success

403 : 접근금지 에러

404 : fail (페이지 없음)

500 : 코드문법 에러

 

 

 

<script>

var xhttp = new XMLHttpRequest(); 
// http 통신을 하기위한 객체 생성 (서버와 교류함 - 비동기 통신)

// XML 호출하는 함수 만들기
function loadXMLDoc() {
    
    xhttp.onreadystatechange = function () {
        // console.log( this.resposeText );     
        // console.log( this.readyState );     
        console.log( this.status );     
        // this = xhttp 
        if( this.readyState == 4 && this.status == 200 ) {
            document.getElementById("demo").innerHTML = this.responseText;
            // 파일에서 읽어들인 부분을 서버로 보내고, 다시 받아서 p태그에 뿌리기
            // this.responseText : 서버로부터 txt파일을 받아옴
        }

    }
    // onreadystatechange : XMLHttp 소속 함수

    xhttp.open("GET", "test.txt", true);
        console.log( "xhttp.open" );     
    // GET 방식 : 제일 많이 사용하는 방식
    // POST 방식 :
    
    // true : open방식을 설정하는지 지정(t/f) - 비동기여부 지정
    
    xhttp.send();
    console.log( "xhttp.send" );     
    
    // onreadystatechange - console결과 :
    // 1
    // xhttp.open
    // xhttp.send
    // 2
    // 3
    // 4
    // = onreadystatechange은 계속 동작하고 있다
    
    //
/*
    readystate: 0-4 까지 숫자로 처리단계 표시
        0 : open() 메소드를 수행하기전에 출력
        1 : loading 중...
        2 : loading 완료
        3 : server 처리 중...
        4 : server 처리 완료 (끝)

    status : 현재 처리 상태를 숫자로 표시  
        200 : success
        403 : 접근금지 에러
        404 : fail (페이지 없음)
        500 : 코드문법 에러

*/
}


</script>