'php'에 해당되는 글 41건

  1. 2016.07.22 php summernote 에디터 설치 (3)
  2. 2013.07.25 PHP 5 Array 함수
  3. 2013.07.24 PHP AJAX RSS Reader 구문
  4. 2013.07.23 PHP AJAX Live Search 구문
  5. 2013.07.22 PHP AJAX XML 연동
  6. 2013.07.19 PHP AJAX 데이터베이스 연동 (9)
  7. 2013.07.18 PHP AJAX 구문
  8. 2013.07.17 PHP SimpleXML 구문
  9. 2013.07.16 PHP XML DOM 구문
  10. 2013.07.15 PHP XML(DOM,SAX) 파싱 구문

 

오랜만에 프로그램에 대해서 포스팅 하네요.
시간이 여유가 있으니 이제 슬슬 포스팅을 다시 시작을 해볼까 합니다. ㅎㅎ;;

이번 포스팅 내용은 SUMMERNOTE  입니다.
반응형 웹에서 사용하는 에디터 입니다.
우리나라 개발자가 만들었다고 하니 왠지 더 정감이 갑니다.
그리고 굉장히 깔끔하게 잘 만들었다고 생각합니다.
요즘 반응형 웹이 대세인데 딱 맞는 에디터가 이렇게 존재하고 있다니 그것도 우리나라 개발자들이 모여서 만든 솔루션이니 정말 대단하다 생각합니다.
설치가 잘 안되어서 1~2일 고생했네요.
이 고생을 다른 누군가 또 반복하지 않게 하기위해 이렇게 내용을 씁니다.

설치 방법은 우선 SUMMERNOTE 홈페이지 http://summernote.org/ 에서 프로그램을 다운받으면 됩니다.

summernote-develop  이라는 압축 파일을 다운받은 후
스크립트 파일과 jquery 파일을 추가 해주면 되는데
  <script src="../js/jquery-1.11.3.min.js"></script>
  <!-- include summernote -->
  <link rel="stylesheet" href="../dist/summernote.css">
  <script type="text/javascript" src="../dist/summernote.js"></script>

위 처럼 링크만 걸어주면 끝!
그리고 그다음 해야 할일은 스크립트에 소스를 추가하면 됩니다.

  <script type="text/javascript">
   $(function() {
    $('.summernote').summernote({
     height: 200,
     lang : 'ko-KR',
    
 callbacks: {
      onImageUpload : function(files, editor, welEditable) {
       console.log('image upload:', files);
       sendFile(files[0], editor, welEditable);
      },
     }
    });
   function sendFile(file,editor,welEditable) {
   data = new FormData();
   data.append("file", file);
    $.ajax({
      
url: "saveimage.php", // image 저장 소스
      data: data,
      cache: false,
      contentType: false,
      processData: false,
      type: 'POST',
      success: function(data){
//       alert(data);
       var image = $('<img>').attr('src', '' + data); // 에디터에 img 태그로 저장을 하기 위함
       $('.summernote').summernote("insertNode", image[0]); // summernote 에디터에 img 태그를 보여줌
//       editor.insertImage(welEditable, data);
      },
      error: function(jqXHR, textStatus, errorThrown) {
        console.log(textStatus+" "+errorThrown);
      }
    });
   }
   $('form').on('submit', function (e) {
    e.preventDefault();
//     alert($('.summernote').summernote('code'));
//     alert($('.summernote').val());
   });
  });
</script>
저 위에 붉은색으로 표시한 부분 때문에 조금 애를 먹었네요. 원래 callback 을 안쓰고 작동을 한다고 해서 계속 수정을 했었는데 안되길래 구글링으로 조금 찾아보니 특정 버전에는 callback을 쓰라고 하더군요.

위 소스 보시면 url: "saveimage.php" 라는 분이 있습니다.
이미지를 첨부했을경우 특정 폴더에 이미지를 저장해야하죠.
그래서 이미지 첨부시 이미지 저장 폴더에 saveimage.php 파일이 실시간 저장을 하게 합니다.
이미지 저장 시 중복된 이름의 첨부를 방지하기 위해서 조금 소스를 수정한 파일입니다.

-- saveimage.php --
<?
if ($_FILES['file']['name']) {
 if (!$_FILES['file']['error']) {
  $name = md5(rand(100, 200));
  $ext = explode('.', $_FILES['file']['name']);
  $filename = $name . '.' . $ext[1];
  $destination = 'upload/' . $filename; //change this directory
  $location = $_FILES["file"]["tmp_name"];
  move_uploaded_file($location, $destination);
  echo '사용자의 이미지 저장위치 url' . $filename;//change this URL
 } else {
   echo $message = 'Ooops!  Your upload triggered the following error:  '.$_FILES['file']['error'];
 }
}

?>

위 처럼 작업을 하시면 됩니다.
혹시라도 저처럼 summernote 때문에 고생하는 분들이 없기를 바라면서
포스팅을 마칩니다.

'PHP > PHP 유용한 내용' 카테고리의 다른 글

php summernote 에디터 설치  (3) 2016.07.22
Posted by 진격의 파파

댓글을 달아 주세요

  1. 지나다가 2017.04.18 22:13  댓글주소  수정/삭제  댓글쓰기

    많은 도움이 되었습니다.

    감사합니다.

  2. 김윤희 2017.07.10 15:46  댓글주소  수정/삭제  댓글쓰기

    한참을 헤맸는데... 답이 여기 있었네요...

  3. 김윤희 2017.07.10 15:49  댓글주소  수정/삭제  댓글쓰기

    정보공유 감사합니다. ^^
    많은 도움이 되었습니다.

 

array() - 배열을 생성함 

array_change_key_case() — 배열 안의 모든 키를 변경
array_chunk() — 배열을 조각으로 나누기
array_combine() — 키를 위한 배열과 값을 위한 배열을 사용하여 배열을 생성
array_count_values() — 배열 값의 수를 셉니다
array_diff_assoc() — 추가적인 인덱스 확인과 함께 배열 차이를 계산
array_diff_key() — 배열을 비교하고 그 차이값을 반환함
array_diff_uassoc() — Computes the difference of arrays with additional index check which is performed by a user supplied callback function
array_diff_ukey() — Computes the difference of arrays using a callback function on the keys for comparison
array_diff() — 배열 차이를 계산
array_fill_keys() — Fill an array with values, specifying keys
array_fill() — 값으로 배열 채우기
array_filter() — 콜백 함수를 사용하여 배열 원소를 필터
array_flip() — 배열 안의 모든 키를 각 키의 연관 값과 교체
array_intersect_assoc() — 인덱스 검사과 함께 배열의 교집합을 계산
array_intersect_key() — Computes the intersection of arrays using keys for comparison
array_intersect_uassoc() — Computes the intersection of arrays with additional index check, compares indexes by a callback function
array_intersect_ukey() — Computes the intersection of arrays using a callback function on the keys for comparison
array_intersect() — 배열의 교집합을 계산
array_key_exists() — 주어진 키와 인덱스가 배열에 존재하는지 확인
array_keys() — 배열의 모든 키를 반환
array_map() — Applies the callback to the elements of the given arrays
array_merge_recursive() — 두개 이상의 배열을 재귀적으로 병합
array_merge() — 하나 이상의 배열을 병합
array_multisort() — 여러 배열이나 다차원 배열 정렬
array_pad() — 지정한 길이만큼 특정 값으로 배열 채우기
array_pop() — 배열의 마지막 원소 빼내기
array_product() — Calculate the product of values in an array
array_push() — 배열의 끝에 하나 이상의 원소를 넣는다
array_rand() — 배열에서 하나 이상의 임의 원소를 가져옴
array_reduce() — 콜백 함수를 사용하여 배열을 반복적으로 단일 값으로 축소
array_replace_recursive() — Replaces elements from passed arrays into the first array recursively
array_replace() — Replaces elements from passed arrays into the first array
array_reverse() — 원소를 역순으로 가지는 배열을 반환
array_search() — 주어진 값으로 배열을 검색하여 성공시 해당하는 키를 반환
array_shift() — 배열의 맨 앞에 있는 원소를 시프트
array_slice() — 배열의 일부를 추출
array_splice() — 배열의 일부를 삭제하고, 그 위치를 다른 내용으로 대체
array_sum() — 배열 값들의 합을 계산
array_udiff_assoc() — Computes the difference of arrays with additional index check, compares data by a callback function
array_udiff_uassoc() — Computes the difference of arrays with additional index check, compares data and indexes by a callback function
array_udiff() — Computes the difference of arrays by using a callback function for data comparison
array_uintersect_assoc() — Computes the intersection of arrays with additional index check, compares data by a callback function
array_uintersect_uassoc() — Computes the intersection of arrays with additional index check, compares data and indexes by a callback functions
array_uintersect() — Computes the intersection of arrays, compares data by a callback function
array_unique() — 배열에서 중복된 값을 제거
array_unshift() — 배열의 맨 앞에 하나 이상의 원소를 첨가
array_values() — 배열의 모든 값을 반환
array_walk_recursive() — Apply a user function recursively to every member of an array
array_walk() — 배열의 각 원소에 대해서 특정 함수를 적용
arsort() — 배열을 내림차순 정렬하고 인덱스의 상관관계를 유지
asort() — 배열을 정렬하고 인덱스 상관 관계를 유지
compact() — 변수와 그 값을 가지는 배열 생성
count() — 배열의 모든 원소나, 객체의 프로퍼티 수를 셉니다
current() — 배열의 현재 원소를 반환
each() — 배열에서 현재 키와 값 쌍을 반환하고 배열 커서를 전진
end() — 배열 내부 포인터가 마지막 원소를 가리키게 설정
extract() — 배열에서 현재 심볼 테이블로 변수를 입력
in_array() — 값이 배열 안에 존재하는지 확인
key() — 배열에서 키를 가져옵니다
krsort() — 키에 의한 배열 역순 정렬
ksort() — 키에 의한 배열 정렬
list() — 배열처럼 변수에 할당
natcasesort() — "자연순" 알고리즘으로 대소문자를 구분하지 않고 배열 정렬
natsort() — "자연순" 알고리즘으로 배열 정렬
next() — 배열의 내부 배열 포인터를 전진
pos() — 별칭: current
prev() — 내부 배열 포인터를 후진
range() — 원소의 범위를 가지는 배열 생성
reset() — 배열의 내부 포인터를 첫 원소로 설정
rsort() — 역순으로 배열 정렬
shuffle() — 배열을 섞습니다
sizeof() — 별칭: count
sort() — 배열 정렬
uasort() — 사용자 정의 비교 함수로 배열을 정렬하고 인덱스 연관성을 유지
uksort() — 사용자 정의 비교 함수를 사용하여 키에 의한 배열 정렬
usort() — 사용자 정의 비교 함수를 사용하여 값에 의한 배열 정렬  

 

영문으로 설명이 들어있는 부분이 있는데 솔직히 저도 실무하면서 사용했던 적이 거의 없던 부분이라 구글링해서 억지로 해석할수도 있겠지만 공부하는 차원에서 직접 해당 함수에 대한 설명을 찾는것도 공부에 도움되지 않을까 생각합니다. 

'PHP > PHP Reference' 카테고리의 다른 글

PHP 5 Array 함수  (0) 2013.07.25
jQuery Event Reference  (0) 2013.05.30
Posted by 진격의 파파

댓글을 달아 주세요

 

 

이번장에서는 PHP AJAX RSS Reader 구문에 대해서 알아볼텐데요. 보통 뉴스기사, 블로그 등의 내용을 가져와 다른곳에 노출시키고 싶을때 많이들 사용합니다.  정말 재미있고 유용한 구문이며, 아래 나오는 예제를 잘 살펴보길 바랍니다.

 

RSS(Rich Site Summary) 의 사전적 의미  :  포털사이트나 블로그와 같이 컨텐츠 업데이트가 자주 일어나는 웹사이트에서, 업데이트 된 정보를 자동적으로 쉽게 사용자들에게 제공하기 위한 서비스. 사이트가 제공하는 RSS 주소를 소정의 RSS Reader 프로그램에 등록하기만 하면, 업데이트된 정보를 찾기 위해 매번 로그인하거나 방문할 필요 없이 자동적으로 이들을 확인하고 이용할 수 있는 편의성이 있습니다. RSS를 운영자와 사용자의 입장에서 보았을 때, 서비스 운영자는 신규 또는 추천 정보를 고객에게 보다 손쉽게 제공할 수 있으며 사용자는 관심있는 정보를 쉽고 빠르게 조회할 수 있습니다. 

 

 

예제구문

------ rss.html ------

<html>
 <head>
 <script>
 function showRSS(str)
 {
 if (str.length==0)
   {
   document.getElementById("rssOutput").innerHTML="";
   return;
   }
 if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("rssOutput").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","rss.php?q="+str,true);
 xmlhttp.send();
 }
 </script>
 </head>
 <body>

 <form>
 <select onchange="showRSS(this.value)">
 <option value="">RSS-선택하세요:</option>
 <option value="park">Park's blog</option>
 <option value="hani">한겨례 News</option>
 <option value="gyung">경향 News</option>
 <option value="jung">중앙일보 News</option>
 <option value="Google">Google News</option>
 </select>
 </form>
 <br>
 <div id="rssOutput">RSS의 내용이 이곳에 나옵니다.</div>
 </body>
 </html>

//  select  구문에서 블로그 또는 언론사를 선택하면 showRss() 함수를 타며, value 값이 rss.php 로 전달되게 됩니다. 그래서 선택한 rss의 내용이 화면에 나타나게 됩니다.

 

------- rss.php -------

<?php
 //get the q parameter from URL
 $q=$_GET["q"];

 //$q 변수값을 비교하여 해당하는 rss 값을 보여줌
 if($q=="Google") {
  $xml=("
http://news.google.com/news?ned=us&topic=h&output=rss");
 } elseif($q=="hani") {
  $xml=("
http://www.hani.co.kr/rss/");
 } elseif($q=="gyung") {
  $xml=("
http://www.khan.co.kr/rss/rssdata/total_news.xml");
 } elseif($q=="jung") {
  $xml=("
http://rss.joinsmsn.com/joins_news_list.xml");
 } elseif($q=="park") {
  $xml=("
http://blog.rss.naver.com/makand123.xml");
 }

 $xmlDoc = new DOMDocument();
 $xmlDoc->load($xml);

 //"<channel>"로 부터 값을 가져옴
 $channel=$xmlDoc->getElementsByTagName('channel')->item(0);
 $channel_title = $channel->getElementsByTagName('title')
 ->item(0)->childNodes->item(0)->nodeValue;
 $channel_link = $channel->getElementsByTagName('link')
 ->item(0)->childNodes->item(0)->nodeValue;
 $channel_desc = $channel->getElementsByTagName('description')
 ->item(0)->childNodes->item(0)->nodeValue;

 //output elements from "<channel>"
 echo("<p><a href='" . $channel_link
   . "'>" . $channel_title . "</a>");
 echo("<br>");
 echo($channel_desc . "</p>");

 //"<item>" 요소를 가져와 출력함
 $x=$xmlDoc->getElementsByTagName('item');
 for ($i=0; $i<=2; $i++)
   {
   $item_title=$x->item($i)->getElementsByTagName('title')
   ->item(0)->childNodes->item(0)->nodeValue;
   $item_link=$x->item($i)->getElementsByTagName('link')
   ->item(0)->childNodes->item(0)->nodeValue;
   $item_desc=$x->item($i)->getElementsByTagName('description')
   ->item(0)->childNodes->item(0)->nodeValue;

   echo ("<p><a href='" . $item_link
   . "'>" . $item_title . "</a>");
   echo ("<br>");
   echo ($item_desc . "</p>");
   }
 ?>

// 위 두개의 구문을 이용하여 블로그 및 뉴스기사의 내용을 RSS로 가져올수 있게됩니다. 소스를 복사해서 테스트 해보거나 직접 코딩하면서 테스트 해보시기 바랍니다~

 

 

 // 위 그림은 제 블로그 rss를 가져온것이고 한겨례, 경향, 중앙 등을 선택하면 그에 해당하는 기사를 가져오게 됩니다.

'PHP > PHP and AJAX' 카테고리의 다른 글

PHP AJAX RSS Reader 구문  (0) 2013.07.24
PHP AJAX Live Search 구문  (0) 2013.07.23
PHP AJAX XML 연동  (0) 2013.07.22
PHP AJAX 데이터베이스 연동  (9) 2013.07.19
PHP AJAX 구문  (0) 2013.07.18
Posted by 진격의 파파

댓글을 달아 주세요

 

 

이번장에서는 PHP 에서 AJAX를 이용하여 Live Search 즉 실시간검색에 대해서 알아보겠습니다.   

 

여러분들이 구글이나 네이버에서  검색어를 치다보면 한글자 아니 자음 하나만 키보드를 두드려도 하단에 관련 검색어들이 뜨는것을 보았을텐데 그러한 구문과 비슷한 구문이라고 생각하면 되겠습니다.

 

 

그림처럼 "a" 라고 치면 a가 해당하는 제목을 불러와 하단에 리스팅합니다.

 

위와 같은 구문을 만들기 위해 우선 3개의 파일이 필요합니다. form 구문이 들어있는 html 또는 php 파일과 xml 파일 그리고 ajax 를 이용한 php 파일이 필요합니다.

 

xml 파일  -------- link.xml --------

<?xml version="1.0" encoding="ISO-8859-1"?>

<!-- Edited by XMLSpy® -->
<pages>
 <link>
  <title>Google</title>
  <url></url>">http://www.google.com</url>
 </link>
 <link>
  <title>Naver</title>
  <url></url>">http://www.naver.com</url>
  </link>
 <link>
  <title>Daum</title>
  <url></url>">http://www.daum.net</url>
 </link>
 <link>
  <title>Nate</title>
  <url></url>">http://www.nate.com</url>
 </link>
 <link>
  <title>Park's blog</title>
  <url></url>">http://blog.naver.com/makand123</url>
 </link>
 <link>
  <title>Zum</title>
  <url></url>">http://www.zum.com/</url>
 </link>
</pages>

// xml 파일은 원하는 내용으로 꾸며보기 바랍니다.

 

 

Form 구문이 있는 html 또는 php 파일 ------- live.html -------

<html>
 <head>
 <script>
 function showResult(str) {
 if (str.length==0) { // 검색글자의 내용이 없으면 검색 박스를 없앱니다.
   document.getElementById("livesearch").innerHTML="";
   document.getElementById("livesearch").style.border="0px";
   return;
 }
 if (window.XMLHttpRequest)  {
 

 // code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
 } else   { 
 

 // code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 xmlhttp.onreadystatechange=function() {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)  {
     document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
     document.getElementById("livesearch").style.border="1px solid #A5ACB2";
   }
 }
 xmlhttp.open("GET","livesearch.php?q="+str,true);  // ajax 파일연동
 xmlhttp.send();
 }
 </script>
 </head>
 <body>
 

 <form> 

<!-- 텍스트 박스에 마우스 onkeyup 이벤트가 발생시 showResult() 함수로 이동하라 -->


 <input type="text" size="30" onkeyup="showResult(this.value)">
 


 <div id="livesearch"></div>
 </form>
 

 </body>
 </html>

 

 

ajax구문이 들어있는 php 파일 ------- livesearch.php -------

<?php
 $xmlDoc=new DOMDocument();
 $xmlDoc->load("link.xml");

 $x=$xmlDoc->getElementsByTagName('link');

 // q의 매개변수 값을 가져옴
 $q=$_GET["q"];

 // $q 변수값이 있는지 여부를 체크
 if (strlen($q)>0) {
 $hint="";
 for($i=0; $i<($x->length); $i++)  {
   $y=$x->item($i)->getElementsByTagName('title');
   $z=$x->item($i)->getElementsByTagName('url');
   if ($y->item(0)->nodeType==1) {
     //find a link matching the search text
     if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q))  {
       if ($hint=="")   {
         $hint="<a href='" .
         $z->item(0)->childNodes->item(0)->nodeValue .
         "' target='_blank'>" .
         $y->item(0)->childNodes->item(0)->nodeValue . "</a>";
       } else  {
         $hint=$hint . "<br /><a href='" .
         $z->item(0)->childNodes->item(0)->nodeValue .
         "' target='_blank'>" .
         $y->item(0)->childNodes->item(0)->nodeValue . "</a>";
         }
       }
     }
   }
 }

 // 만약 xml 데이터에 검색값의 내용이 없을 경우 "no suggestion" 을 출력함
 if ($hint=="")  {
   $response="no suggestion";
 } else {
   $response=$hint;
 }

 // $response 값을 출력하라
 echo $response;
 ?>

 

이렇게 3개의 파일이 연동되면 위 그림처럼 실시간 검색의 느낌을 줄 수 있습니다. 구글, 네이버 크게 다를거 없습니다. 많이 응용해보고 멋진 소스를 개발해보기 바랍니다.

혹시 오타 또는 오류 발생시 댓글, 쪽지 주면 바로 수정해놓겠습니다.

그럼 오늘도 즐거운 하루 되세요 ^^

'PHP > PHP and AJAX' 카테고리의 다른 글

PHP AJAX RSS Reader 구문  (0) 2013.07.24
PHP AJAX Live Search 구문  (0) 2013.07.23
PHP AJAX XML 연동  (0) 2013.07.22
PHP AJAX 데이터베이스 연동  (9) 2013.07.19
PHP AJAX 구문  (0) 2013.07.18
Posted by 진격의 파파

댓글을 달아 주세요

 

이번장에서는 PHP AJAX XML 연동에 대해서 알아보겠습니다.  

 

PHP 구문에 AJAX를 이용해서 XML 데이터를 불러들이는 방식입니다. 이전 포스팅에서는  DB를 불러들이는 방식이었는데  DB 대신 XML 데이터를 가지고 온다고 생각하면 되겠습니다.

 

예제를 보면서 설명드리겠습니다. html 파일 1, ajax 파일 1, xml 파일 1 이렇게 총 3개의 파일이 필요합니다.

 

관련예제

HTML 파일

------ html.php ------

<html>
 <head>
 <script>
 function showNAME(str)
 {
 if (str=="")
   {
   document.getElementById("txtHint").innerHTML="";
   return;
   }
 if (window.XMLHttpRequest)
   {
 

   // code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {
 

   // code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","ajax_php.php?q="+str,true);
 xmlhttp.send();
 }
 </script>
 </head>
 <body>
 

 <form>
 Select a CD:
 <select name="cds" onchange="showNAME(this.value)">
 <option value="">Select NAME : </option>
 <option value="Lee Bo Young">Lee Bo Young</option>
 <option value="Um Ji Won">Um Ji Won</option>
 <option value="Lee Min Jeong">Lee Min Jeong</option>
 <option value="O Ji Eun">O Ji Eun</option>
 <option value="Su Ji">Su Ji</option>
 <option value="I U">I U</option>
 </select>
 </form>
<div id="txtHint"><b>Name info will be listed here...</b></div>

 </body>
 </html>

// 이름을 선택하면 이름에 대한 정보가 나옵니다.

 

AJAX 파일

------ ajax.php ------

<?php
 $q=$_GET["q"];

 $xmlDoc = new DOMDocument();
 $xmlDoc->load("xml.xml");

 $x=$xmlDoc->getElementsByTagName('ARTIST');

 for ($i=0; $i<=$x->length-1; $i++) {
 if ($x->item($i)->nodeType==1)   {
   if ($x->item($i)->childNodes->item(0)->nodeValue == $q) {
     $y=($x->item($i)->parentNode);
     }
   }
 }
 

 

 $cd=($y->childNodes);

 for ($i=0;$i<$cd->length;$i++) { 
 if ($cd->item($i)->nodeType==1)  {
   echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
   echo($cd->item($i)->childNodes->item(0)->nodeValue);
   echo("<br>");
   }
 }
 ?>

//xml.xml 파일을 불러들여서 선택된 $q 값과 xml의 값을 비교하여 같은 정보를 가져옵니다.

 

XML 파일

------ ajax_php.xml ------

<?xml version="1.0" encoding="ISO-8859-1"?>

<!-- Edited by XMLSpy® -->
<CATALOG>
 <CD>
  <JOB>Telent</JOB>
  <ARTIST>Lee Bo Young</ARTIST>
  <HOMETOWN>In Cheon</HOMETOWN>
  <BODY>168cm, 48kg</BODY>
  <BIRTH>1979. 1. 12</BIRTH>
 </CD>
 <CD>
  <JOB>Telent</JOB>
  <ARTIST>Um Ji Won</ARTIST>
  <HOMETOWN>DaeGu</HOMETOWN>
  <BODY>170cm, 48kg</BODY>
  <BIRTH>1977. 12. 25</BIRTH>
 </CD>
 <CD>
  <JOB>Telent</JOB>
  <ARTIST>Lee Min Jeong</ARTIST>
  <HOMETOWN>Seoul</HOMETOWN>
  <BODY>167cm, 49kg</BODY>
  <BIRTH>1982. 2. 16</BIRTH>
 </CD>
 <CD>
  <JOB>Telent</JOB>
  <ARTIST>O Ji Eun</ARTIST>
  <HOMETOWN>Seoul</HOMETOWN>
  <BODY>165cm</BODY>
  <BIRTH>1990</BIRTH>
 </CD>
 <CD>
  <JOB>Singer</JOB>
  <ARTIST>Su Ji</ARTIST>
  <HOMETOWN>GwangJu</HOMETOWN>
  <BODY>168cm, 47kg</BODY>
  <BIRTH>1994. 10. 10</BIRTH>
 </CD>
 <CD>
  <JOB>Singer</JOB>
  <ARTIST>I U</ARTIST>
  <HOMETOWN>Seoul</HOMETOWN>
  <BODY>161.8cm, 44kg</BODY>
  <BIRTH>1993. 5. 16</BIRTH>
 </CD>
</CATALOG>

// 여자연예인 XML 정보입니다. 이렇게 하면 더 쉽게 다가오지 않을까 해서 일부러 여자 연예인을 예로 들어봤습니다.

 

위 3개의 파일이 연동되어 실시간 XML 파일의 정보를 가져옵니다.

 

 

 

 

예제를 직접 코딩해보고 응용을 해보기 바랍니다. 개발자는 계속적인 학습이 없으면 언제든지 도태될 수 있습니다.

 

혹시 오타 또는 오류 발견시 댓글, 쪽지 주시면 바로 수정해놓겠습니다.

 

 

'PHP > PHP and AJAX' 카테고리의 다른 글

PHP AJAX RSS Reader 구문  (0) 2013.07.24
PHP AJAX Live Search 구문  (0) 2013.07.23
PHP AJAX XML 연동  (0) 2013.07.22
PHP AJAX 데이터베이스 연동  (9) 2013.07.19
PHP AJAX 구문  (0) 2013.07.18
Posted by 진격의 파파

댓글을 달아 주세요

 

이번장에서는 PHP 에서 AJAX 를 이용한 Mysql 데이터베이스 연동에 대해서 살펴보겠습니다.  

 

AJAX 와 데이터베이스 연동은 실무에서도 정말 중요한 내용이고 별도의 다른 페이지 로딩없이 한 페이지 내에서 데이터베이스 내용을 불러들여 처리할 수 있으니 매우 유용한 기능이라 생각합니다.

 

데이터베이스 연동이니 우선 테이블을 하나 생성하겠습니다.

테이블 이름 : persons

 user_name

 age

 home

 job

 park

 33

 cheongju

 programmer

 kim

 35

 seoul

 police

 song

 42

 incheon

 webmaster

 lee

 36

 daegu

 teacher

// 테이블의 내용은 위처럼 되어 있다고 가정합니다. 이전 포스팅에서 테이블 만드는 방법에 대해서 설명이 되어있으니 혹시 테이블 생성에 대해서 모르는 분들은 이전 포스팅을 참조하시면 되겠습니다.

 

ajax_form.php 파일과 ajax.php 파일을 생성합니다.

ajax_form.php 파일은 내용을 보여주는 페이지 이며,

ajax.php  파일은 데이터베이스와 연동하여 ajax_form.php 파일로 전송시키는 역할을 합니다.

 

------ ajax_form.php ----

<html>
 <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <script>
 function showUser(str)
 {
 if (str=="")
   {
   document.getElementById("txtHint").innerHTML="";
   return;
   }
 if (window.XMLHttpRequest)  {
 

// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
 }
 else { 
 

// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 xmlhttp.onreadystatechange=function()  {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)  {
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","ajax.php?q="+str,true);
 xmlhttp.send();
 }
 </script>
 </head>
 <body>
 

 <form>
 <select name="users" onchange="showUser(this.value)">
 <option value="">Select a person:</option>
 <option value="park">park</option>
 <option value="kim">kim</option>
 <option value="song">song</option>
 <option value="lee">lee</option>
 </select>
 </form>
 <br>
 <div id="txtHint"><b>사람들의 정보를 이곳에 보여줌.</b></div>

 </body>
 </html>

 

 

------ ajax.php ------

<?php
 $q=$_GET["q"];

 $con = mysqli_connect('localhost','user_id','user_pwd','test_db');
 if (!$con)  {
   die('Could not connect: ' . mysqli_error($con));
 }


 $sql = "SELECT * FROM persons WHERE user_name = '".$q."'";
 $result = mysqli_query($con,$sql);

 echo "<table border='1'>
 <tr>
 <th>username</th>
 <th>Age</th>
 <th>Home</th>
 <th>Job</th>
 </tr>";

 while($row = mysqli_fetch_array($result))
   {
   echo "<tr>";
   echo "<td>" . $row['user_name'] . "</td>";
   echo "<td>" . $row['age'] . "</td>";
   echo "<td>" . $row['home'] . "</td>";
   echo "<td>" . $row['job'] . "</td>";
   echo "</tr>";
   }
 echo "</table>";

 mysqli_close($con);
 ?>

// 두 개의 파일이 서로 연동되어 내용을 선택하면 어떠한 페이지 로딩없이 바로바로 데이터베이스 내용이 나타나는것을 확인할 수 있습니다. AJAX는 이처럼 사용자인터페이스에 매우 유용한 기능을 제공한다 보면 됩니다. 더 자세히 알아두면 실무에서 많은 도움이 될거라 믿어의심치 않습니다.

 

혹시 오류, 오타 있으면 쪽지, 댓글 부탁드립니다.

'PHP > PHP and AJAX' 카테고리의 다른 글

PHP AJAX RSS Reader 구문  (0) 2013.07.24
PHP AJAX Live Search 구문  (0) 2013.07.23
PHP AJAX XML 연동  (0) 2013.07.22
PHP AJAX 데이터베이스 연동  (9) 2013.07.19
PHP AJAX 구문  (0) 2013.07.18
Posted by 진격의 파파

댓글을 달아 주세요

  1. 질문이요 2014.01.01 18:32  댓글주소  수정/삭제  댓글쓰기

    ajax_form.php에서 특정 버튼을 눌렀을 때 비동기적으로 새로운 user를 추가하려면 어떻게 해야 하나요?

  2. 질문이요 2014.01.01 18:35  댓글주소  수정/삭제  댓글쓰기

    참고로 다른 설정은 공백으로 둔 채 user_name을 robot으로 무한 추가 하려고 합니다

  3. 2014.01.01 18:56  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  4. 처음처럼 2015.05.08 06:30  댓글주소  수정/삭제  댓글쓰기

    고맙습니다. 이틀정도 이문제 때문에 헤매다가 드디어 여기를 발견했어요.
    한번 시도해 보고 안되는 부분은 여쭤보겠습니다.^^ 고마워용!

  5. 로던 2016.08.11 17:20  댓글주소  수정/삭제  댓글쓰기

    정말 감사합니다

    그게 도움이 되었습니다.

  6. 고돌 2017.02.20 22:47  댓글주소  수정/삭제  댓글쓰기

    감사합니다~

  7. 큰비 2017.06.10 13:54  댓글주소  수정/삭제  댓글쓰기

    감사합니다. 많은 도움 되었습니다.

  8. 제코 2017.11.07 08:55  댓글주소  수정/삭제  댓글쓰기

    우왕 너무너무 감사합니다 !!!!

 

 

AJAX 의 기본적인 정의는 비동기식 즉, 웹페이지에 어떤 내용을 보여줄때 리로딩(새로고침) 되는것을 동기식이라고 하며 리로딩없이 페이지내에서 서버의 데이터를 가져오거나 보여줄때 비동기식이라고 하는데 AJAX 는 그러한 비동기적 방법을 구현 가능케 해줍니다. 

 

우선 예제를 보면서 설명하겠습니다. 아래 나오는 소스의 내용은 이름중에 성만 입력하면 그에 해당하는 이름 리스트를 가져옵니다.

첫번째 파일은 form 구문이며, 두번째 파일은 ajax 관련 파일입니다. 페이지의 리로딩이나 새로고침 없이 두개의 페이지가 서로 연동되는것을 확인할 수 있습니다.

------ ajax_form.php ------

<html>
 <head>
 <script>
 function showHint(str)
 {
 if (str.length==0)
   {
   document.getElementById("txtHint").innerHTML="";
   return;
   }
 if (window.XMLHttpRequest)
   { // code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   { // code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","ajax.php?q="+str,true);
 xmlhttp.send();
 }
 </script>
 </head>
 <body>

 <p><b>성씨를 입력하세요:</b></p>
 <form>
 성씨 입력: <input type="text" onkeyup="showHint(this.value)">
 </form>
 <p>이름: <span id="txtHint"></span></p>

 </body>
 </html>

 

 

------ ajax.php ------

<?php
 // 배열(array)에 값을 담습니다.
 $a[]="김태희";
 $a[]="김희선";
 $a[]="김혜수";
 $a[]="고현정";
 $a[]="구혜선";
 $a[]="공효진";
 $a[]="김남주";
 $a[]="민효린";
 $a[]="송지효";
 $a[]="손예진";
 $a[]="송혜교";
 $a[]="서우";
 $a[]="엄지원";
 $a[]="이나영";
 $a[]="오윤아";
 $a[]="임수정";
 $a[]="전지현";
 $a[]="조여정";
 $a[]="이효리";
 $a[]="최여진";
 $a[]="이연아";
 $a[]="남상미";
 $a[]="손연재";
 $a[]="한효주";
 $a[]="수지";
 $a[]="박한별";
 $a[]="박수미";
 $a[]="고준희";
 $a[]="박하선";
 $a[]="아이유";

 //get the q parameter from URL
 $q=$_GET["q"]; // ajax_form.php 에서 'q'라는 변수로 넘어온 값을 받는 부분

 // 입력된 값이 있는지 체크하는 구문(글자의 길이가 0보다 크냐라는 의미)
 if (strlen($q) > 0)
   {
   $hint="";
   for($i=0; $i<count($a); $i++)
     {
     if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
       {
       if ($hint=="")
         {
         $hint=$a[$i];
         }
       else
         {
         $hint=$hint." , ".$a[$i];
         }
       }
     }
   }

 // 성과 일치되는 값이 없으면 "no suggestion" 을 출력하고 값이 있으면 이름 전체를 출력합니다.
 if ($hint == "")
   {
   $response="no suggestion";
   }
 else
   {
   $response=$hint;
   }

 // 값을 출력함
 echo iconv("euc-kr","utf-8",$response);  // 한글이 깨져서 euc-kr로 값을 변환함
 ?>

// 두 개의 파일이 같은 폴더내 위치해 있다고 가정하고 테스트 하면 아래와 같이 성씨만 입력하면 해당되는 사람들의 이름이 나타납니다

// 구글이나 네이버 검색할때 많이 검색된 단어 위주로 미리 검색창에 보여지는데 그러한 기능과 유사한 기능이라 보면 되겠습니다.

 

AJAX는 이처럼 서로다른 몇개의 페이지와 실시간 연동이 가능하고, 리로딩없이 구현되기 때문에 방문자들에게 아주 좋은 기능들을 제공할 수 있습니다.

'PHP > PHP and AJAX' 카테고리의 다른 글

PHP AJAX RSS Reader 구문  (0) 2013.07.24
PHP AJAX Live Search 구문  (0) 2013.07.23
PHP AJAX XML 연동  (0) 2013.07.22
PHP AJAX 데이터베이스 연동  (9) 2013.07.19
PHP AJAX 구문  (0) 2013.07.18
Posted by 진격의 파파

댓글을 달아 주세요

 

 

이번장에서는 PHP SimpleXML 에 대해서 포스팅 하겠습니다. 

 

SimpleXML 는 PHP5의 새로운 기능입니다.

 

SimpleXML 라는 이름에서 알수 있듯이 XML 요소의 이름과 텍스트를 얻는 가장 간단한 방법입니다.

 

설치라던지 인스톨 작업은 별도로 없고 PHP 5.0 이상이라면 사용가능합니다.

 

우선 간단한 예제를 살펴보겠습니다.

 

------ test.xml ------

<?xml version="1.0" encoding="utf-8"?>
<note>
<to>Park</to>
<from>Kim</from>
<heading> header contents !! </heading>
<body> Body contents !! </body>
</note>

// 위와 같은 xml 파일이 있다고 가정하고(아래 xml.php 와 같은 위치(폴더)에 있어야 함)

 

------ xml.php ------

<?php
 $xml=simplexml_load_file("test.xml");
 print_r($xml);
?>

// 위 xml.php 파일을 실행시켜보면

SimpleXMLElement Object ( [to] => Park [from] => Kim [heading] => header contents !! [body] => Body contents !! )

처럼 출력됩니다. 한줄로 길게나와 보기가 조금 그렇습니다. 그래서 해당 내용만 나오게 변경해보겠습니다.

 

------ xml2.php ------

<?php
 $xml=simplexml_load_file("test.xml");
 echo $xml->to . "<br>";
 echo $xml->from . "<br>";
 echo $xml->heading . "<br>";
 echo $xml->body;
?>

// 출력되는 내용은 아래와 같습니다.

Park
Kim
header contents !!
Body contents !!

 

 

다음 예제는 출력요소의 이름과 그에 해당하는 내용을 같이 보여주는 예제 입니다.

------ xml3.php ------

<?php
 $xml=simplexml_load_file("test.xml");
 echo $xml->getName() . "<br>";

 foreach($xml->children() as $child){
  echo $child->getName() . ": " . $child . "<br>";
 }
?>

// 출력되는 내용은 아래와 같습니다.

note
to: Park
from: Kim
heading: header contents !!
body: Body contents !!

 

사실 예제는 무수히 많이 있는데 일단 간단하고 기본적인 예제를 살펴본 것이라서 아마도 더 많은 예제를 찾아보고 학습해야 자기것으로 만들수 있지 않을까 생각합니다.

 

오타 또는 오류가 발견되면 댓글 또는 쪽지 부탁드립니다. 일단 여기까지해서 XML 관련 포스팅은 마치고, 다음 포스팅에선 PHP 와 AJAX의 연동에 대해서 알아보겠습니다.

'PHP > PHP XML' 카테고리의 다른 글

PHP SimpleXML 구문  (0) 2013.07.17
PHP XML DOM 구문  (0) 2013.07.16
PHP XML(DOM,SAX) 파싱 구문  (0) 2013.07.15
Posted by 진격의 파파

댓글을 달아 주세요

 

이번장에서는 PHP XML DOM 파싱에 관하여 예제를 보며 포스팅하겠습니다.  

이전 포스팅에서 DOM 과 SAX 파싱에 대해서 간략 설명하였습니다.  이번장을 보기전에 우선 이전 포스팅을 본다면 더 도움이 될듯합니다.

 

DOM 은 Document Object Model 의 약자입니다.

DOM 방식은 트리 구조로 XML 문서를 변환하고 전체 문서를 읽어서 엑세스 하기때문에 메모리를 많이 사용하며 조금 무겁다고 느낄수 있습니다.

- 문서 구조 정보와 컨텐츠를 객체로 이용

- 트리에 기반한 객체를 이용함으로써 XML 문서의 구조적 변경 작업에 적합

- XML 문서를 메모리상에서 공유할수 있다는 장점이 있음

- 메모리상에 구체적인 객체 트리를 생성함

- XML 문서를 다루기 위한 복잡한 응용프로그램(브라우저, 편집기)에 적합

- 메모리 사용량이 큼

// 위 내용은 이전 포스팅에서 설명된 내용을 가져온것입니다.
DOM 의 XML 파싱은 PHP의 부분이기 때문에 어떤 특정한 파일을 설치할 필요가 없습니다.
관련예제
----- test.xml ----- (우선 test.xml 파일을 아래와 같이 생성합니다)
<?xml version="1.0" encoding="euc-kr"?>
<note>
<to>철수</to>
<from>영희</from>
<heading>헤더 부분</heading>
<body>이곳은 내용이 들어가는 부분!</body>
</note>
----- xml.php ----- (xml.php 파일을 아래와 같이 생성합니다)
<?php
 $xmlDoc = new DOMDocument(); // 새로운 객체를 생성함
 $xmlDoc->load("test.xml"); // test.xml 파일을 불러들임
 print $xmlDoc->saveXML(); // DOM Tree를 xml 문서로 변환함
 ?>
// 객체를 선언하고 xml 파일을 불러들인후 내용을 출력하는 구문입니다. 출력되는 내용은
철수 <from>영희</from> <heading>헤더 부분</heading> 이곳은 내용이 들어가는 부분!
입니다.
관련예제 2
----- test.xml -----
<?xml version="1.0" encoding="utf-8"?>
<note>
<to>Park</to>
<from>Kim</from>
<heading> header contents !! </heading>
<body> Body contents !! </body>
</note>
// XML은 utf-8을 사용하는 것이  기본 권고사항 입니다.
----- xml.php -----
<?php
 $xmlDoc = new DOMDocument();
 $xmlDoc->load("test.xml");
 $x = $xmlDoc->documentElement; // 문서의 루트 요소를 가져옴
 foreach ($x->childNodes AS $item) {
  print $item->nodeName . " = " . $item->nodeValue . "<br>";
 }
?>
// documentElement 는 그 트리의 탑-레벨입니다. 이 요소는 하나 또는 그 이상의 자식 노드(childNodes)를 가진다. 이 자식 노드는 그 트리의 가지로 보면 됩니다.

노드 인퍼페이스(Node Interface)는 XML 노드 트리의 각 요소를 읽고 쓰기 위해 사용되며, 각각의 노드를 접근하기 위해 documentElement의 childNodes 속성을 접근할 수 있습니다. 

 

// 출력문은 아래와 같습니다.
#text =
to = Park
#text =
from = Kim
#text =
heading = header contents !!
#text =
body = Body contents !!
#text =
 
// XML 에 해당하는 모든 요소를 출력합니다.
DOMDocument 클래스의 매소드
loadXML() - XML 문서를 불러온다.
saveXML() - 메모리에 올라가 있는 DOM Tree를 XML문서로 변환한다.
load() - 파일로 부터 XML문서를 불러온다.
save() - DOM Tree를 파일로 저장한다.
vaildate() - DTD를 기준으로 XML문서의 유효성을 검증한다.
schemaVaildate() - XML 스키마를 기준으로 XML 문서의 유효성을 검증한다.
schemaVaildateSource() - XML 스키마를 기준으로 XML 문서의 유효성을 검증한다.
createELement() - 새로운 앨리먼트 노드 생성
createTextNode() - 새로운 텍스트 노드 생성
createAttribute() - 새로운 속성 노드 생성
createElementNS() - 네임스페이스 영역을 갖는 앨리먼트 노드 생성
createAttributeNS() - 네임스케이스 영역을 갖는 속성 노드 생성
createComment() - 새로운 주석노드 생성
createCDATASection() - 새로운 CDATA섹션 노드를 생성한다.
getElementsByTagName() - 지정한 태그명을 갖는 앨리먼트의 노드 리스트 출력
getElementsByTagNameNS() - 특정한 네임스페이스 영역에서 지정한 태그명을 갖는 앨리먼트의 노드 리스트를 반환한다.
importNode - XML 문서에 붙일 특정노드를 가져온다.
여기까지 XML DOM 구문에 대한 설명이었으며 다음장에서는 XML SAX 구문에 대해서 알아보겠습니다. 사실 XML에 관련된 설명이 많이 부족할 수 있습니다. 제가 코딩하면서 자주 사용하지 않았기 때문이 아닐까 합니다. 설명중 오타 또는 오류가 발생되면 댓글, 쪽지 주시면 바로 수정해 놓겠습니다.

'PHP > PHP XML' 카테고리의 다른 글

PHP SimpleXML 구문  (0) 2013.07.17
PHP XML DOM 구문  (0) 2013.07.16
PHP XML(DOM,SAX) 파싱 구문  (0) 2013.07.15
Posted by 진격의 파파

댓글을 달아 주세요

 

 

이번장에서는 PHP XML 파싱에 대해서 알아볼텐데요. 사실 제가 프로그램 생활을 하면서 xml 파싱은 정말 자신없는 부분이기도 합니다.  그래서 설명하기 어렵겠지만 저도 공부할겸 인터넷에 있는자료 뒤적뒤적 해가며 적어보겠습니다. 

 

XML 은 문서를 읽어 문서 내용 및 구조에 대한 접근을 제공하는 소프트웨어입니다.

- 엘리먼트, 속성, 엔티티 정보를 생성

- 문서의 정확성을 검증

- XML 문서 처리를 수행하도록 지원함

 

XML 문서를 처리하기 위한 대표적인 방식은 SAX(Simple Api for Xml) 파싱과 DOM(Document Object Model) 파싱 두 가지가 있습니다.

 

SAX 방식은 이벤트가 발생할때마다 그때그때 처리되기 때문에 메모리 소모가 적지만 잦은 이벤트의 발생은 오히려 더 메모리를 많이 잡아먹을수 있습니다.

-  문서 전체 구조 정보를 가지지 않음

- XML 문서를 읽어 나가면서 이벤트 발생

- 특정 엘리먼트에 대한 이벤트 발생시 처리

- 문서의 부분을 처리할때 유리

- 데이터 구조 조작에 유리

- 응용프로그램을 최적화 가능

- 효율성이 좋음

 

 

DOM 방식은 트리 구조로 XML 문서를 변환하고 전체 문서를 읽어서 엑세스 하기때문에 메모리를 많이 사용하며 조금 무겁다고 느낄수 있습니다.

- 문서 구조 정보와 컨텐츠를 객체로 이용

- 트리에 기반한 객체를 이용함으로써 XML 문서의 구조적 변경 작업에 적합

- XML 문서를 메모리상에서 공유할수 있다는 장점이 있음

- 메모리상에 구체적인 객체 트리를 생성함

- XML 문서를 다루기 위한 복잡한 응용프로그램(브라우저, 편집기)에 적합

- 메모리 사용량이 큼

 

읽어보면 알겠지만 각각 장단점을 가지고 있어서 상황에 맞게 적절히 사용되어야 할듯합니다.

 

XML에 대해서 우선 간략정의를 했습니다.  

 

다음장에서는 DOM, SAX의 예제에 대해서 알아보겠습니다. 오타 또는 오류가 있으면 댓글, 쪽지주면 바로 수정해 놓겠습니다.

 

 

'PHP > PHP XML' 카테고리의 다른 글

PHP SimpleXML 구문  (0) 2013.07.17
PHP XML DOM 구문  (0) 2013.07.16
PHP XML(DOM,SAX) 파싱 구문  (0) 2013.07.15
Posted by 진격의 파파

댓글을 달아 주세요