본문 바로가기

나의 플랫폼/HTML5

[ Hybrid App ] Jquery에서 PHP+Mysql 서버로 부터 Json 값 받기

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

[프롤로그]

우선, 이 자료는 이틀간 삽질을 한 끝내 만들어낸 소스입니다.

json_encode라는 것으로JSON 데이터를 받을 수 있다고 하지만,

여러번 테스트를 해보았지만,, 결과적으로 되지 않았습니다....


결국, 2가지 방법을 찾게 되었는데요.


1. JSON문자열을 직접 만들자!!!

그래서 php서버 에서 mysql로 받은 데이터를 

직접 반복문을 통해서 JSON 문자열을 생성 시켰습니다.


생성 시킨 JSON문자열은 ajax를 통해서 콜백 받은 함수에서 

JSON.parse함수로 인스턴스화 시켜서 그 데이터를 사용하는 구조입니다.


2. PHP JSON 라이브러리 를 사용하자. (다운로드 : http://pear.php.net/package/Services_JSON/download/)

출처 : http://mytory.co.kr/archives/40


1. JSON 문자열을 직접 만들자!!

[ JSON의 특징 ]

먼저, 이 특징은 저의 경험에 따른 것임을 알려드립니다.

1. 출력 갯수가 여러개 일 경우에만 '[',']' 대괄호로 묶어줘야합니다.

   결과값이 하나 일 경우에 대괄호를 사용하게 되면 parsing이 되지 않습니다.

2. 대괄호 안에 데이터 갯수도 여러 개 일 경우 마지막에 콤마','를 붙여주면 안됩니다.

2. '{',''}'중괄호 안에 컬럼에 따른 갯수도 여러 개 일 경우 마지막에 콤마','를 붙여주면 안됩니다.


[ PHP ] : getpost.php

<?php

    try

    {

    header("Content-Type: text/html; charset=UTF-8");

        $connection = mysql_connect("localhost","root","passwd") or die ("Could not connect: " . mysql_error());

        mysql_query("SET NAMES utf8",$connection);

        mysql_select_db("db명", $connection);

       // 여기까지 하면 mysql 셋팅이 완료 됩니다.


$sql = "select * from 테이블명";

        $sth = mysql_query($sql) or die ("Query error: " . mysql_error());

        // 쿼리 문을 실행 하고 결과 값을 $sth에 저장 합니다.


// 여기부터가 진짜 중요!!!

        $resultStart = '{"items":'; // 데이터의 기본값을 items로 설정.

        $resultData = '';            // mysql로 넘겨 받는 문자열 변수

        $resultEnd = '}';         // 마무리 문자열 변수


       // 결과 값이 여러 개 일 경우 대괄호 추가!

        if(mysql_num_rows ( $sth ) > 1)

        {

        $resultStart .= '[ ';

        $resultEnd = ' ]}';

        }

while($rows = mysql_fetch_assoc($sth)) {

$resultData .= '{ ';

foreach($rows as $key => $value)

            { $resultData .= '"'.$key.'":"'.$value.'",'; }

                 // 컬럼 값 마지막 부분에 콤마 제거

            $resultData = substr($resultData,0, -1);

    $resultData .= '},';

       }

        // 데이터 값 마지막 부분에 콤마 제거

$resultData = substr($resultData,0, -1);

        mysql_close($connection);

        

        echo $resultStart.$resultData.$resultEnd;  // 결과값 전달

        //echo '{"item":'. '[ { "title":"TEST","urla":"url" },{ "title":"test99999","urla":"url1" } ]' .'}';   // 샘플이니 이 값으로도 테스트 해보세요.

    }

    catch(Exception $e)

    {

        echo $e->getMessage();

        // Note: Log the error or something

    }

?>


[ JQuery ]

$.ajax({

    type: "GET",

    url: "http://localhost/getpost.php",

    async: false,

    beforeSend: function(x) {

},

success: function(data){

if(data){

// 데이터를 JSON으로 파싱

var json = JSON.parse(data);

                        // 여러개 일 경우

if(json.length > 1){

 alert(json.items[0].title);

// 하나 일 경우

}else{

 alert(json.items.title);

}

}

}

});


위와 같이 하면 값이 넘어오는 것을 볼 수 있다..

그럼... 서버 에서 직접 JSON Object를 받을 수는 없는것인가!!!!


그래서 두번째 방법!!

2. PHP JSON 라이브러리 를 사용하자.

위에서 다운 받은 JSON.php 파일을 php 파일과 같이 넣어두자.


[ PHP ] : getpost.php

<?php

require 'JSON.php'; // JSON.php 추가


    try

    {

        $connection = mysql_connect("localhost",계정명,비밀번호) or die ("Could not connect: " . mysql_error());

        mysql_query("SET NAMES utf8",$connection);

        mysql_select_db(db명, $connection);

$sql = "select * from 테이블 명";


        $sth = mysql_query($sql) or die ("Query error: " . mysql_error());

        

        // JSON 객체 생성

$json = new Services_JSON();

        

        $rows = array();

while($r = mysql_fetch_assoc($sth)) {

    $rows[] = $r;

}

$output = $json->encode($rows);

echo $output;

        

        mysql_close($connection);

    }

    catch(Exception $e)

    {

        echo $e->getMessage();

        // Note: Log the error or something

    }

?>



[ JQuery ]

$.ajax({

 type:'POST',

 url: 'http:// localhost /getpost.php',

 dataType: 'json',

 timeout: 10000,

//  beforeSend: function(x) {

//       if(x && x.overrideMimeType) {

//           x.overrideMimeType("application/json;charset=UTF-8");

//       }

//  },

 success: function(data){

alert(data[0].title);  // 여기서는 무조건 data[0] 이렇게 인덱스를 지정해 줘야한다.

 },

 error: function(request, textStatus, errorThrown) {

   alert('error:'+textStatus);

 },

});


위 방법은 정말 간단하다. php json 라이브러리를 이용했을 뿐인데.....

난 이틀간 삽질하게...ㅠㅠ


아무튼.. 저와 같이 삽질 하는 사람이 적어지길 바라면서..

글을 마칩니다.


오늘도 즐코딩!!!!!