'2017/11/29'에 해당되는 글 1건

ajax(asynchronous Javascript and XML) 회원가입 처리를 하면서 에러가 발생하면 디버깅을 해야 한다.

ajax를 이용해서 클라이언트와 서버가 사용자에게 영향을 미치지 않고 백그라운드에서 정보를 주고 받을 수 있다.

echo '{"result":"0"}'; // echo json_encode(array('result' => '0')); 과 동일

echo json_encode(array('result' => '1')); // 회원 등록 성공

echo json_encode(array('result' => '-1')); // 회원 등록 실패

echo json_encode(array('result' => '-2')); // 입력받은 데이터에 문제가 있는 경우

처리된 결과를 return 받은 곳에서 에러가 발생하는지 파악할 때

dataType 이 json 으로 되어 있으면 alert(response); 를 해도 Object.object 라서 에러 메시지가 무엇인지 내용을 알 수 없다.

이럴 경우에는 dataType 을 text 로 변경한 다음에 alert(response); 를 해보면 경고메시지 등이 반환된 것을 알 수 있다.

경고메시지 발생부분을 모두 수정하고 나서, 다시 dataType 을 json 으로 변경하고, alert(response); 를 주석처리해주면 된다.

간단한 것인데도 이 부분에서 자꾸 순간적인 실수를 해서 그냥 적어둔다.

문제가 발생하는 부분은

1. 넘겨주는 url 경로변수가 잘못된 경우

2. dataType 을 json 으로 했는데 respone == 1 이라고 잘못 처리하는 경우

   response.result == 1로 처리해야 한다.

   만약 넘겨주는 값이 {"status":"true","result":"0"} 라고 한다면

   respone.status == true

   response.result == 0

   와 같이 if 조건문을 설정해야 한다.

3. 넘겨주는 data 값이 잘못되었는지 여부도 2번에서 text 로 받아서 메시지를 확인하면 된다.

    http://link2me.tistory.com/1130 참조

4. 파일 인코딩 모드가 UTF-8 인지 확인한다.

var loginpath =$("#ajaxPath").attr('data-path');

PHP 변수를 ajax에서 인식 못해서 아래와 같이 html 코드를 추가해서 경로변수를 자동인식하도록 처리했다.

<div id="ajaxPath" data-path="<?php echo $g['path_page'].'process/'; ?>" ></div>

$('#join-submit').click(function(e){
    e.preventDefault();
    // 입력값 체크는 생략

    var loginpath =$("#ajaxPath").attr('data-path');
    $.ajax({
        url: loginpath+'registerChk.php',
        type: 'POST',
        data: {
            userNM:$("#inputName").val(),
            userID:$('#inputEmail').val(),
            password:$('#inputPassword').val(),
            mobileNO:$("#inputMobile").val()
        },
        dataType: "json", // json, text
        success: function (response) {
            //alert(response);
            if(response.result == 1){
                alert('가입 완료');
                location.replace('index.php'); // 화면 갱신
            } else if(response.result == 0){
                alert('이미 가입된 아이디입니다');
            } else if(response.result == -2){
                alert('입력 데이터를 확인하세요');
            } else {
                alert('등록중에 에러가 발생했습니다');
            }
        },
        error: function(jqXHR, textStatus, errorThrown){
            alert("arjax error : " + textStatus + "\n" + errorThrown);
        }
    });       
   
});

ajax 대신에 post 를 사용할 경우에는 text 데이터만 처리가 되더라.

체크박스로 체크한 데이터만 추가하는 것이다.