본문 바로가기

WebStudy

비동기 통신 JSON

function createRequest(){
 if(window.XMLHttpRequest){
  //win 7이상 , 크롬 등등
  request = new XMLHttpRequest();
 } else if(window.ActiveXObject){
  //win 7미만
  request = new ActiveXObject("Microsoft.XMLHTTP");
 }
 return request;
 
}
function ajax(){
 //가장먼저 request객체를 얻어와야함.
 request = createRequest();
 
 if(request == null) alert("Unable to create request");
 else {
  //servlet주소를 쏴준다. Project Name
  var url = "test.json";
  // 함수 호출 이름만 써주면 함수를 찾아간다..
  request.onreadystatechange = abc;
  //실제로 통신을 위해 GET방식으로 열어주는 것.
  //비동기화 안에서도 동기화true와 비동기화 false로 나눠진다.
  request.open("GET", url, true);
  //get방식에서는 주소에 넣어주고 post방식은 아래와 같이 한다.
  request.send(null);
  
  //request.open("POST", url, true);
  //request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  //request.send("value=" + "10" + "&value2=" + "20");
 }
}
function abc(){
 if(request.readyState == 4){
  if(request.status == 200){
   var json = request.responseText;
   var json_parse = JSON.parse(json);
   // hashmap을 알아서 구분을 해준다.
   // 키 값이 객체 내의 변수가 되는등??????????
   //JSON javascript 객체는 브라우저가 가지고 있다.
   //과거에는 JSON.js 파일을 추가를 해줬어야 했다.
   document.getElementById("content").innerHTML =
    "당신의 아이디는? " + json_parse.id +
      "당신의 패스워드는? " + json_parse.pwd;
  }
 }
}

'WebStudy' 카테고리의 다른 글

session 에 관한 ...  (0) 2015.06.22
jqeury servelt ajax  (0) 2015.06.22
비동기 통신, AJAX - javascript  (0) 2015.06.22
창 열기, 부모창으로 값 전달, 자식창 닫기  (0) 2015.06.22
테이블 클릭시 값 가져오기  (0) 2015.06.22