F.R.I.D.A.Y.

ajax class 본문

DEV WEB/HTML CSS JS

ajax class

F.R.I.D.A.Y. 2019. 8. 1. 07:15
반응형

ES6에서 사용 가능한 모듈타입의 AJAX를 구현해봤는데 메인 언어가 아닌데다 프로토타입이라 모든 메소드 구현 및 정형화 되지 않음.


export class ajax{
    /*
     * ajax with vanilla JS
     *
     *
     */
    constructor(param){
        if(param == null){
            console.error(`ajax: not param`);
            return;
        }
        let reqItemList = [
            "url",
            "data",
            "method",
            "success"
        ];
        
        let errorThrow = false;

        for(let i =0; i < reqItemList.length;++i){
            if(!(reqItemList[i] in param)){
                console.error(`ajax error : ${reqItemList[i]} is requred`);
                errorThrow = true;
            }
        }
        

        if(errorThrow){
            new Error();
            return;
        }
        var xhr = new XMLHttpRequest;
        xhr.open(param.method, param.url);
        xhr.setRequestHeader("Content-type", "application/json; charset=utf-8;");
        xhr.onreadystatechange = function(){
            if(xhr.readyState === 4){
                if(xhr.status == 200){
                    console.log(xhr.response);
                    param.success(xhr.response);
                    
                }else{
                    if("fail" in param){
                        param.fail(xhr.response);
                    }
                }
                if("always" in param){
                    param.always(xhr.response);
                }
            }
        }
        this.data = param.data;
        this.xhr = xhr;
    }

    send(){
        this.xhr.send(JSON.stringify(this.data));
    }

}
728x90
반응형
Comments