간단한 질문인데 이해가 안가서 확인 요청 드립니다. views.py에서, … retur

 
홍현화

간단한 질문인데 이해가 안가서 확인 요청 드립니다.
views.py에서,

return_data = {
‘total_cpu’:basic_result[0],
‘total_ram’:basic_result[1],
‘total_hdd’:basic_result[2]
}
return HttpResponse(simplejson.dumps(return_data,separators=(‘,’, ‘:’),sort_keys=True))

이 데이타를 html에서 받아주는데,
function (data) { …
document.getElementById(“sCpu”).innerHTML = data[“total_cpu”];
document.getElementById(“sRam”).innerHTML = data[“total_ram”];
document.getElementById(“sHdd”).innerHTML = data[“total_hdd”];
…}

확인해보면 왜 다 undefined로 처리되는 걸까요?
return_data에서 데이타는 ‘total_cpu’:[basic_result[0]]도 해보고 ‘total_cpu’:basic_result[0] 도 해봤는데 동일 합니다.
실제 data을 확인해보면 {“total_cpu”:”CPU info: Intel(R)Core(TM)CPU540@ (The number of same CPUs: 4 ea)”,”total_hdd”:”HDD info: 736.28GB”,”total_ram”:”MEM info: 3GB”} 데이타가 들어와 있습니다.

  • 홍현화

    Firebug을 통한 응답코드를 확인해 보면 아래와 같습니다.
    POST http://monitor.qa.com/ajax/save

    200 OK
    1.81s
    jquery.min.js (6째 줄)
    헤더Post응답HTMLJSON
    Sort by key

    total_cpu
    “CPU info: Intel(R)Core(…ber of same CPUs: 4 ea)”

    total_hdd
    “HDD info: 736.28GB”

    total_ram
    “MEM info: 3GB”

    total_cpu,total_hdd 그리고 total_ram 값은 red marking되어 있습니다.

    Chinseok Lee

    저 자바스크립트 함수에 적절히 인자가 안 넘겨지는 듯 합니다. // 자바스크립트 함수내에서 data 를 찍어보세요. console.log(data); 아마 data 가 undefined 이거나, jqXHR 타입 변수이거나요.

    홍현화

    data을 alerting 했을때 {“total_cpu”:”CPU info: Intel(R)Core(TM)CPU540@ (The number of same CPUs: 4 ea)”,”total_hdd”:”HDD info: 736.28GB”,”total_ram”:”MEM info: 3GB”} 라고 정확히 print 됩니다. 다만 key 값에 따른 처리가 왜 안되는지 모르겠네요;

    Chinseok Lee

    data 가 object 가 아니라 string 인듯 합니다. jquery ajax 를 쓰셨다면, dataType: “json” 으로 설정해보세요.

    Chinseok Lee

    혹은 직접 파싱할 수도 있구요.

    var obj = JSON.parse(data);
    console.log(obj.total_cpu);

    홍현화

    ajax을 사용하였습니다.
    $ajax = $(document).ready(function(){
    $.ajax({
    type : ‘POST’,
    url : “http://127.0.0.1:9797/ajax/save”,
    data : {“address”:address,
    “port”:port,
    “id”:id,
    “pass”:pass
    },
    dataType: “json”,
    async: false,
    success : function (data) {
    if (data) {

    eS = document.getElementById(“mServerlists”);
    eS.style.display = “none”
    eL = document.getElementById(“mLists”);
    eL.style.display = “block”
    var result = data.responseText.evalJSON(true);
    document.getElementById(“sCpu”).innerHTML = result[“total_cpu”]; document.getElementById(“sRam”).innerHTML = result[“total_ram”]; document.getElementById(“sHdd”).innerHTML = data[“total_hdd”];
    } else { …

    홍현화

    위처럼 내용이 되어 있으며 이진석님이 주신 내용으로 파싱시, SyntaxError: JSON.parse: unexpected character 처럼 에러가 발생합니다.

    Chinseok Lee

    success 콜백에서 data 변수를 잘 확인해보세요. 적절히 처리된 것이라면 string 이 아니라, object 타입이 되어야 합니다.

    아래 스크린샷은 flask, jquery 로 간략히 만들어본 코드입니다. 간단한 코드이기 때문에 django 코드와 별반 차이 없습니다.

    Chinseok Lee

    디버깅 시에 alert 창을 쓰시기보다, 브라우저 자바스크립트 콘솔창을 써보시면, 디버깅이 훨씬 수월하실 겁니다.

    홍현화

    알려주신 조언대로 확인한 결과, 하나씩 확인해보니, 현재는 정상적으로 동작합니다. 감사합니다. ^^)

Advertisements