블로그 이미지
포도알77
IT 방랑기

calendar

      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  

Notice

2019.04.03 22:06 프로그래밍/Javascript

1. HTML에서 Javascript만으로 IP 주소 얻기

HTML에서 IP주소를 확인하기 위한 방법으로 대부분 사람들이 Java script를 이용하려고 한다. 단도직입적으로 HTML내에서 Javascript만으로 IP 주소를 얻을 수 없다.

2.  IP address를 구하는 방법

서버는 사용자의 요청(Request)을 받을 때 TCP 또는 UDP 헤더를 보고 IP 주소를 알 수 있다.  즉, IP 주소를 얻기 위해서는 서버단에서 처리를하여 값을 되돌려 주어야 한다.

따라서 할 수 있는 방법으로 1. 서버를 구현한다. 2. API를 사용한다. 두개로 좁힐 수 있다.

(1) 서버를 구현하는 방법

 많은 사람들이 사용하는 Node.js나 php를 이용한다면, 많은 소스코드가 인터넷 상에 존재한다.  애초에 이런 방법을 찾기위해서 이 페이지를 찾은 것은 아닐 것이다.

(2) API 이용하기

 정말 간단하다. HTML에 아래의 스크립트를 추가하자. 그리고 Javascript에서 ip 변수를 이용하면 된다.

<script type="text/javascript" src="https://jsonip.com"></script>

그 이유는 서버가 클라이언트의 IP주소를 추출해서 변수에 하드코딩한 다음 스크립트로 반환한다. 이해가 안된다면 아래의 링크를 클릭해보자.

https://jsonip.com

posted by 궁금한 포도알77
2019.04.03 22:02 프로그래밍/Javascript

IP 주소를 이용하여, Geolocation 정보를 얻을 수 있다. 여기서 Geolocation은 위도경도 (Latitude, Longitude)를 뜻한다. 여기서 얻어지는 위도와 경도값은 굉장히 부정확하다. 그 이유는 ISP(인터넷 공급자)가 제공한 데이터를 이용하기 때문이다. 따라서 현재 위치는 서울이지만 조회 결과가 경기도로 나타날 수도 있다. 이

1. IP 주소 얻기

 현재 자신의 위치 정보를 얻는 방법은 [JS] HTML에서 JS를 이용하여 IP 주소 얻기를 참조하자.

2. Geolocation API 설명

 여기서 사용할 API는 ip-api.com가 제공한다. 이 사이트는 별도의 회원가입이나, 키발급 없이 바로 조회를 할 수 있다. 다만 분당 150회의 제한이 있으니 확인하기 바란다. 또한 영리의 목적으로 사용할 수 없다.

 우리가 위치 정보를 얻기 위해서 전달해야하는 정보는

http://ip-api.com/json/123.123.123.123?callback=yourfunction

 ip는 당연히 전달되어야 하고, callback은 선택사항인데, ip-api의 서버가 response할 때, client 스크립트 내의 함수를 호출해준다.

 즉, 조회후 데이터를 출력하는 함수가 printDataOnThePage()라면, printDataOnThePage를 입력하면 된다.

3. IP를 이용하여, Geolocation 정보 얻기

 IP를 이용하여, Geolocation을 얻기위해서는 동기(synchronous)방식으로 전달해도 되지만, 대부분 비동기(asynchronous)를 이용할 것이다.

전체적인 과정을 나타내면,

 (1) IP 주소를 얻는다.

 (2) AJAX를 통하여, ip-api 서버에 비동기 통신으로 Geolocation을 요청한다.

 (3) 결과를 제공받아 화면에 출력한다.

아래의 예제를 보자.

[코드]

<div style="padding-left: 60px;">
  ip : <input id="your-ip-addr" type="text" />
  Geo : <input id="your-geo" type="text" />
  <script type="text/javascript">
    function loadScript(url, callback){
      var script = document.createElement("script")
      script.type = "text/javascript";

      if (script.readyState){  //IE
        script.onreadystatechange = function(){
          if (script.readyState == "loaded" ||
                script.readyState == "complete"){
               script.onreadystatechange = null;  
               callback();
          }
        };
      }else {  //Others
         script.onload = function(){
            callback();
         };
      }
      script.src = url;
      document.getElementsByTagName("head")[0].appendChild(script);
    }
    loadScript("https://jsonip.com/?callback=ip", function(){
      var geoData, ipData = ip;
      document.getElementById("your-ip-addr").value=ipData;
      document.getElementById("your-geo").value="Wait..";
    
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
          geoData = JSON.parse(this.responseText);
          printDataOnThePage();
        }
       };
      xhttp.open("GET", 
                 "http://ip-api.com/json/"+ipData,
                 true);
      xhttp.send();
      function printDataOnThePage(){
        document.getElementById("your-geo").value=
          geoData.lat+' '+geoData.lon+' '+geoData.city;
      }    
    });

  </script>
</div>

AJAX를 잘 모른다면, W3School AJAX를 먼저 보자. 우선 ip주소 스크립트를 로딩하기 전에 실행될 수 있으므로, 스크립트를 로딩후에 함수를 동작하게 하는 "loadScript"부분을 추가하였다. 이부분이 잘 이해가 되지않는다면, 전체를 긁어다가 쓰면된다.  그건 각자가 알아서 해결하면될 문제이고, 간단히 ip를 받아서 Ajax를 통해 ip-api서버로 요청을 보내고 그 결과를 input 태그에 담는다.

모르겠다면 댓글로

posted by 궁금한 포도알77
2019.03.04 16:14 프로그래밍/Javascript

 API 크롤링이나, 기타 데이터 수집을 위해서 함수 또는 특정 프로시저를 실행할 때 횟수제한에 걸리지 않도록 윈도우를 잡아서 처리하는 코드 


 다만, 이 코드는 setInterval을 사용하므로 CPU 소모량이 클 수 있다.  

 
  1. 소스코드
    function AWS(limit, secs){
      this.list = [];
      this.limit = limit;
      this.window = secs*1000;
      this.push = function(a, b){
        this.list.push([-1, a, b]);
      }
      this.pop = function(){
        if(this.list.length==0) return "EMPTY";
        var now = new Date().getTime();
        var st = -1;
        for(var i = 0 ; i < this.list.length; i++){
          if(this.list[i][0]<0){
            st = i;
            break;
          }
        }
        if(st == -1) return "EMPTY";
        var windowStart = now - this.window;
        var cnt = 0;
        for(var i = st - 1; i >= 0; i--){
          if(this.list[i][0] < windowStart){
            this.list.splice(0, i+1);
            st -= i+1;
            break;
          }
          cnt++;
        }
        if(cnt > this.limit) return "LIMIT EXCEED, REMAINS : "+(this.list.length-st);
        this.list[st][0]=now;
        var result = this.list[st];
        return result;
      }
    }

      왜 AWS이냐면, 맨 처음 Window로 선언해서 var window = new Window()로 하니 개발자 모드에서 계속 기존 오브젝트와 겹쳐서 awindow쓰다가 그냥 AWS로 붙여버렸다.



  2. 사용 방법
    var limits = 6; //횟수
    var limitTime = 1; // 초당 제한
    
    var aws = new AWS(limits, limitTime);
    
    aws.push(함수이름, 매개변수);setTimeout(function(){
      var result = aws.pop();
      if(typeof(result)!='string'){
        result[0](result[1]);
      }
    }, limitTime*1000/limits);
    
    
    // ex)
    // function a(b,c,d){
    //   console.log(b*c+d);
    // }
    // aws.push(a,[b,c,d]);
    //
    // 혹은 기존 함수들이 존재한다면
    //
    // function _a(b,c,d){
    //   console.log(b*c+d);
    // }
    // function a(b,c,d){
    //   aws.push(_a,[b,c,d]);
    // }
     
     값을 스트링으로 한 이유는, 로그 찍어보려고 한것이고, 원한다면 undefined로 바꾸어서 if(result) 형태로 써도 무방하다.

     추가적으로 너무 setInterval의 값이 적으면 CPU 사용이 폭증한다. 별로 CPU 리밋도 적고, 크게 코드 값어치가 없다 싶으면 이용하자.
 



posted by 궁금한 포도알77
2019.03.04 16:03 프로그래밍/서버
요약 :
 1. Node.js에서 사용하는 Pug 템플릿 엔진 (Jade)를 이용하면 간단한 페이지도 로드되는데 굉장히 오래 걸린다.

 2. 코드를 구성하기 나름이지만, 쿼리 + Pug 컴파일 + 변수 대입 + 요청 응답4단계에서 컴파일 타임이 약 8할이상 시간이 걸린다. (응답시간 1초의 경우 약 800ms이상 소요)

 3. Pug 엔진에서 캐시가 가능하다. 



 결과 : 컴파일 시간이 0ms으로,  응답시간이 5배 이상 빨라진다.  



 var fn = pug.compileFile('파일.pug',{
  basedir:__dirname,
  cache:true
});
res.writeHead(200, {'Content-Type' : 'text/html'});
res.end(fn(varlist));


 캐시이므로, 서버 켜질때 모든 PUG가 컴파일 되는 것은 아니다.

 처음 해당 페이지로 접근하여 Pug엔진에서 캐시가 되면, 그 다음부터 컴파일하지 않고 바로 처리된다.

  단, 캐시이기 때문에 Pug를 바로 수정할 수 없다. 따라서 반드시 서버를 다시 켜야한다.     캐시 설정 이전 (설명 : 요청 전달까지  ~ 1ms, 요청 응답 대기 520ms, 다운로드까지 52ms)


 여기서 요청 응답 대기 시간중 대부분이 컴파일 시간이다. 실제 쿼리는 약 50~100ms(웹 서버와 DB서버는 원격지에 있다)



[캐싱 설정 이전]

  





[캐시 설정 이후]

 (설명 : 캐시 이전보다 요청 응답 대기 시간이 약 1/9으로 줄었다. 즉, 대부분의 시간이 Pug 컴파일 타임이었다.)





posted by 궁금한 포도알77
2019.03.02 09:19 크롤링

 데이터 수집을 위한 크롤링 연속 포스팅  [크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가? [크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들 [크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명 [크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제 [크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링


1. 크롤링전에 앞서

 본격적으로 자신의 목적에 맞는 크롤러를 만들어보자. 이번에 만들 크롤러는 환율 정보를 가져오는 크롤러이다. 

 1편에서 다뤘던대로, 4단계로 나누어 그 과정을 살펴보자. 
   -  (1) 대상 선정 -> (2) 데이터 로드 -> (3) 데이터 분석 -> (4) 데이터 수집
 다만, 크롤링은 불법이니 적당히 하자.  



2. 과정을 나누어 살펴보면..

  (1) 대상 선정 우선 우리는 야후 파이낸스의 환율정보를 크롤링할 예정이다. 야후 파이낸스는 https://finance.yahoo.com이며, 클릭해보면 아래와 같은 페이지가 나온다.



    

 대상 선정 과정에서는 환율 정보를 제공하는 페이지를 어떻게 접근할 수 있을지 고민해야한다. 우선 여러가지 화폐가 있겠지만, 간단히 몇가지를 검색해보자. 



 간단하게 캐나다 달러와 엔화를 검색해보자.   




캐나다 달러




엔화

  검색한 내용을 쭉 살펴보다보면, 어디쯤에 환률 정보가 있는지 알 수 있다. 또한 우리는 크롤링을 할 예정이므로, 각 환율 정보의 고유 URI인  URL은 https://finance.yahoo.com/quote/XXXKRW=X?p=XXXKRW=X임을 알 수 있다.


 이 두가지 정보를 찾았다면, 다음 단계인 데이터 로드로 넘어가자. 





  (2) 데이터 로드 및 데이터 분석 데이터 로드의 방법에는 여러가지가 있지만, 우선 포스트의 난이도를 낮추기 위해 개발자 모드를 이용해보자. 


 개발자 모드는 해당 URL에 접근하였을 때 얻을 수 있는 모든 데이터를 보여준다. (개발자 모드는 F12를 이용하여 접근할 수 있다)   


 우선 개발자 모드의 Elements 탭에서 환율 정보 (아래의 이미지의 1,119.02)를 찾아보자. 찾기 힘들다면, 개발자 모드 좌측 상단 마우스 커서 모양을 클릭하면 HTML과 웹 페이지가 동기화되어, 마우스를 가져간 곳에 하이라이트를 해준다.

     





마찬가지로, 캐나다 달러에 대해서도 환율 정보가 있는 HTML 부분을 찾아보자.


 



 위와 같이 환율 정보는 HTML에 포함되어 있고, 이 HTML을 우리가 만들 크롤러가 정상적으로 로드할 수 있다면, 다음 과정인 데이터 분석으로 넘어가도록 하자.  


 앞서 보인 달러와 캐나다 달러의 환율 정보를 담고 있는 HTML태그는 span이다. 또한 공통적으로 data-reactid="35"를 태그 어트리뷰트로 가지고 있다. 


 이제는 span이면서 어트리뷰트 data-reactid="35"를 가지는 태그가 유일한지 확인하는 절차가 필요하다. 우선 Yahoo 파이낸스에는 jQuery를 사용하고 있어, jQuery로 위와 같은 조건을 가진 Span 태그를 검색해보자.


 $('span[data-reactid="35"]') 문법에서 $는 jQuery를 의미하고, 괄호안의 내용은 셀렉터를 의미한다. 셀렉터 안에는 여러가지 문법이 올 수 있는데 span으로 시작하게되면, span이라는 태그를 검색하겠다는 의미이다. 


 대괄호의 경우 해당 태그중 data-reactid 어트리뷰트가 "35"인 span 가져오겠다는 의미를 가진다. 따라서 이를 검색했을때, 해당 어트리뷰트가 존재한다면 HTML 태그를, 아니라면 undefined를 리턴하게 된다.    






Yahoo 파이낸스는 위의 검색 조건을 따르게 된다면 정상적으로 환율 정보를 얻을 수 있다. 이제 간단한 Java 크롤러 예제를 만들어 실제로 크롤러 또한 동일하게 환율 정보를 찾을 수 있는지 확인해보자.  






 코드 예제 1   



위와 같이 정상적으로 달러의 환율 정보를 얻을 수 있으면, 이제 자신이 얻고자하는 통화 코드를 알아야하지 않을까?   





 코드 예제 1의 자바 코드

 import java.io.IOException;
// 예외 처리 임포트

import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.select.Elements;
// Jsoup 임포트

public class CurrencyCrwaler{
   // Jsoup은 예외 처리를 해주어야 합니다.
   // 여기서는 getCurrencyRate를 호출한 Caller에서 예외처리를 하도록 throws로 선언합니다.
   public static void getCurrencyRate(String cc) throws IOException {
      String URL = "https://finance.yahoo.com/quote/"+cc+"?p="+cc;
      // URL 정보를 매개변수 cc를 이용해 생성합니다.
      Document doc = Jsoup.connect(URL).get();
      // Jsoup을 이용하여, 해당 URL을 get 메소드로 로드하여 Document 변수에 담습니다.
      Elements elem = doc.select("span[data-reactid=\"35\"]");
      // 얻어진 Document에서 Span중 data-reactid 어트리뷰트가 35인 것을 찾습니다.
      String str = elem.text();
      // 찾아진 엘리먼트(태그)들의 값을 Text로 출력합니다.
      System.out.println(str);
   }
   
    public static void main(String[] args){
      String cc = "USD";
      // getCurrencyRate에서 발생하는 예외처리를 받아서 단순 출력 처리합니다.
      try {
         getCurrencyRate(cc+"KRW=X");
      } catch (IOException e) {
         e.printStackTrace();
      }
    }
}

 







   통화 코드는 ISO 4217에 따라서 아래와 같이 정의된다. 더 상세한 내용은 https://ko.wikipedia.org/wiki/ISO_4217 이곳을 참고하여 자신이 얻고자하는 통화 코드를 뽑아내자.











   나의 경우는 아래와 같이 여러개의 통화코드를 이용하여 환율 정보를 얻을 예정이다.

 USD,JPY,AUD,BRL,CAD,CHF,CLP,CNY,CZK,DKK,GBP,HKD,HUF,IDR,ILS,MXN,MYR,NOK,NZD,PHP,PKR,PLN,RUB,SEK,SGD,THB,TRY,TWD,ZAR,EUR,UAH,INR,ISK,NGN
(4) 데이터 수집 이제 마지막 단계로 위에서 뽑아둔 통화 코드를 바탕으로 환율 정보를 수집해보자. 예제 코드 1에서 우리는 간단하게 현재 값을 얻어내는 함수를 정의했고, 이 함수에 통화코드만 전달해주면 해당 통화의 환율을 콘솔에 출력하도록 하였다. 이제는 한개의 환율을 출력하는 것이 아니라, 배열로 만들어 여러개를 순차적으로 호출하도록 하자.  

 예제 코드 2

   예제 코드 2의 소스코드

import java.io.IOException;

import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.select.Elements;

public class CurrencyCrwaler{
	public static void getCurrencyRate(String cc) throws IOException {
		String URL = "https://finance.yahoo.com/quote/"+cc+"?p="+cc;
        Document doc = Jsoup.connect(URL).get();
        Elements elem = doc.select("span[data-reactid=\"35\"]");
        String str = elem.text();
        System.out.println(str);
	}
	
    public static void main(String[] args){
    	String ccs = "USD,JPY,AUD,BRL,CAD,CHF,CLP,CNY,CZK,DKK,GBP,HKD,HUF,IDR,ILS,MXN,MYR,NOK,NZD,PHP,PKR,PLN,RUB,SEK,SGD,THB,TRY,TWD,ZAR,EUR,UAH,INR,ISK,NGN";
    	// 얻고자하는 통화 코드를 문자열로 저장합니다.
    	String[] ccList = ccs.split(",");
    	// 저장한 문자열에서 ,(쉼표)단위로 이를 잘라 문자열 배열에 담습니다.
        try {
        	// 문자열 배열을 순회하면서 환율 정보 수집 함수인 getCurrencyRate를 호출합니다.
        	for(int i = 0 ; i < ccList.length; i++)
        		getCurrencyRate(ccList[i]+"KRW=X");
		} catch (IOException e) {
			e.printStackTrace();
		}
    }
}
   

3. 이제 자신에게 필요한 처리를..

 성공적으로 환율 정보를 수집했다면, 이를 자신이 활용할 수 있는 방법으로 저장해야 한다. 가장 간단한 방법은 수집된 시간별로 파일화하여 저장하거나,  DBMS에 저장하는 등의 방법을 강구하여야 한다.  


 또한 크롤링 자체는 크롤링 대상의 서비스가 온전하다는 가정하에 이루어지는 것이기 때문에 항상 서버가 다운되는 등의 예외적인 상황에 대비하여야 한다. 따라서 환율 정보의 경우 크롤링 성공 시간을 같이 저장하여, 이 정보가 언제 갱신되었는지 확인해주는 것이 좋다.    




4. 생각보다 너무 간략해서..

원래라면 생각보다 난이도가 높은 크롤링을 진행할 예정이었는데, 생각보다 환율 정보 수집이 너무 간단해서 다른 예제를 가지고 한번 더 진행해야 할 것 같다. 이러면 안되는데.. 다음편 계속.
 데이터 수집을 위한 크롤링 연속 포스팅 

[크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가?

[크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들

[크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명

[크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제

[크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링




posted by 궁금한 포도알77
2019.03.02 09:09 크롤링
 데이터 수집을 위한 크롤링 연속 포스팅 

[크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가?

[크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들

[크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명

[크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제

[크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링

1. Java 설치

 크롤링을 위한 언어로 Java와 JSoup 라이브러리를 이용한다. 

 만약 자신이 편리한 언어가 있다면 해당 언어를 사용해도 무방하다. Jsoup의 경우 Java 버전 라이브러리이며, 해당 언어에 맞는 크롤링 라이브러리가 존재할 것이다. 

 Java를 설치하는 전체 과정은 3가지로 나눌 수 있다. 1) Java용 SDK 설치, 2) Java IDE 설치, 3) 환경 변수 설정. 자바를 설치해본 사람들은 알겠지만, 매뉴얼처럼 제공되는 설치 방법이 모두 사람마다 달라 (특히 환경변수 설정부분) 여러 블로그를 참고하게 되면, 더 고생할 수 있다는 점을 기억해두자. (최근에는 IDE 설치시 환경 변수까지 세팅해준다고는 하던데..)  


(1) JAVA SDK 설치 JDK는 JAVA Development Kit의 약어로 자바 라이브러리 설치 도구 정도로 기억해도 좋다. 링크는 아래와 같으며, 최신 버전 JDK를 설치하자.



 JDK 다운로드 페이지 링크



 자신의 운영체제에 알맞는 JDK를 다운로드받으면 된다. 32비트 윈도우는 Windows x86, 64비트의 경우 Windows x64이며, 테이블 상단의 약관 동의 버튼을 눌러 설치하면 된다.





   (2) IDE 설치 Java IDE로 이클립스를 사용할 예정이다. 이클립스는 아래에서 다운로드 받을 수 있다.

이클립스 다운로드



 아마 이클립스 포톤 버전일 것이며, 반드시 JDK를 설치하고 실행하여야 정상 동작한다는 점을 유의하자.


 설치 이후 아래의 순서로 진행하면 된다. 예전에는 인스톨러가 없었는데 요즘에 나와서 더 간편해졌다.

 







 3) 환경 변수 편집


 환경 변수의 경우, 내용이 길어질 수 있으므로 아래의 링크를 통해서 설치하도록 하자. (나의 경우, 환경 변수 설정이 안보이는데 잘되서.. 전에 깔아서 그런가.. 안되는분은 댓글 남겨주세요 :)



[Java] Java 개발을 위한, JDK와 Eclipse 설치 2/3



 아무튼 이렇게 모든 준비가 끝났다면, 이제 간단한 자바 프로그래밍을 해보자.





2. 이클립스 활용과 간단한 Java 프로그램

지금까지 자바와 이클립스를 설치했으므로, 정상동작 확인을 위해서 간단한 자바프로그램(그래봐야 헬로월드)를 만들어보자.

   (1) 이클립스를 실행하자. 
   (2) 실행시에 어느 폴더에 프로젝트를 저장할지 묻는 팝업이 열린다. 편리한 곳을 설정하자.




(3) 이클립스가 켜지면, 월컴 탭을 꺼버리자.



 



(4) 새로운 프로젝트를 만들자.  




좌측 패키지 익스플로러에 우클릭 -> New -> Java Project를 선택하자.






원하는 프로젝트 이름을 입력하자.



만들어진 프로젝트의 src 폴더를 우클릭 -> New -> Class를 선택하자.




원하는 클래스 이름을 입력하자.






중간에 보이는 클래스이름.java 탭에 코드을 입력하자.

만약 클래스 이름이 다르다면, public static void~부터 3줄만 긁어다 붙이면 된다.



public class HelloWorld {
	public static void main(String[] args) {
		System.out.println("Hello World");
	}
}


만약 실행이 바로 안된다면, 상단 실행 모양의 Run Configuration을 선택하자.






이후 Java Application의 New Configuration을 선택해서, Main Class에 방금 만든 Class 이름을 입력한 다음, Run 버튼을 클릭하자.






Java 프로그램이 정상 실행되었다면, 하단의 Console 탭이 선택되면서, Hello World가 출력된다.



3. Jsoup 설치

2번까지는 기본적인 설치 방법이고, 대부분의 전공자들은 이미 자바가 설치되어 있으니 뛰어 넘었지 않을까 싶다. 이번에는 Jsoup 라이브러리를 다운로드하여 설치하는 과정을 설명한다.  

 Jsoup의 다운로드 링크는 아래와 같다.


 

Jsoup 다운로드 링크



 3개의 Jar 파일을 다운로드 하여야 하는데, 반약 귀찮다면 아래의 3개의 링크를 다운로드 해도 된다.

jsoup-1.11.3.jar

jsoup-1.11.3-sources.jar

jsoup-1.11.3-javadoc.jar



 다운로드한 파일은 적당한 위치에 모아서 저장해두자.



 그리고 기존의 프로젝트로 돌아와서, 패키지 익스플로러상의 프로젝트 이름을 우클릭하여 Property -> Java Build Path 탭 -> Libraries를 선택한 다음, Add External JARs를 선택하여 방금 다운로드한 Jar 파일 3개를 추가하자.



그리고 아래의 코드를 입력하여, 확인해보자.

import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.select.Elements;

public class HelloWorld{
    public static void main(String[] args) throws Exception{
        String URL = "https://jcdgods.tistory.com/320";
        Document doc = Jsoup.connect(URL).get();
        Elements elem = doc.select("div.article");
        String str = elem.text();
        System.out.println(str);
    }
}


정상적으로 실행된다면, Jsoup이 정상 설치된 것이다.


다음에는 환율 정보를 예로 들어 HTML을 파싱하는 크롤링 프로그램을 만들어보려고 한다. 다소 내용이 길수도, 어려울 수 있으니 여러번 이클립스를 실행하여 기본적인 것에 익숙해지자.



 데이터 수집을 위한 크롤링 연속 포스팅 

[크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가?

[크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들

[크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명

[크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제

[크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링



posted by 궁금한 포도알77
2019.03.02 09:01 크롤링

 데이터 수집을 위한 크롤링 연속 포스팅  [크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가? [크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들 [크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명 [크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제 [크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링

1. 크롤링이란?


 이번 글에서는 JSON과 Javascript단에서 어떻게 사용하는지를 자세히 설명하려고 한다. 또한 앞서 모든 예제는 자바스크립트로 구성될 예정이므로, 잘 이해가 안된다면 웹 브라우저에서 F12(개발자모드)를 열어 예제 코드를 입력해보자.

  우선 JSON은 Javascript와 ECMA에 토대를 두고 있지만, 아무래도 웹의 데이터 통신에 사용되는 경량 형식이므로 대부분의 언어에서 JSON을 처리하는 라이브러리를 지원한다. 따라서 대충만 알고 자신이 필요한 언어 라이브러리 또는 구글에 JSON + 언어명을 치면 정말 다량의 정보가 쏟아져 나올 것이다.  

 JSON은 Javascript Object Notation의 약어로, 자바스크립트상에서 오브젝트를 표현하는 형식이다. 우선 형식을 제대로 이해하기 앞서 자바스크립트의 변수에 관련해서 더 상세히 알아보자. 

 자바스크립트는 대부분의 학부 과정 혹은 그전에 배웠던 C, C++, Java등과 달리 Dynamic Typing을 지원한다는 것을 잊으면 안된다.  


아래와 같은 코드를 보자.

  (1) 자바스크립트의 동적 형식

이 코드는 나이를 체크해서 18세 이하이면 '오류 메시지'를, 아니면 나이 값을 담는 코드이다.

var ageDataForOutput = '';

function login(age){
   if(!isNaN(age) && age > 18){
   	ageDataForOutput = age;
   }else{
        ageDataForOutput = '올바르지 않거나, 나이가 너무 어립니다.';
   }
}

 여기서 알 수 있는 것은 변수 ageDataForOutput를 타입 var(variable) ''(공백문자) 정의하였다. (대부분의 초보자들은 변수 타입을 자신이 배운언어인 int, char등을 써서 syntax오류를 발생시킨다.)


 아무튼 var 타입과 5, 7번째 문장에서 알 수 있듯 자바스크립트의 변수타입은 미리 정해지지 않는다(없는게 아니다). 즉, 값이 대입되는 순간 그 타입과 값이 정해지게 된다.


   (2) 자바스크립트의 변수 타입

 이제 자바스크립트의 동적 타이핑에 대한 설명을 했으니, 어떤 타입들이 존재하는지에 대해서 알아볼 필요가 있다. 자바스크립트에는 크게 6가지 타입이 있다.(ECMA6이전, 이후에는 1가지 타입이 추가되었음)


  1. 기본 자료형 (Primitive data type)
    1. boolean 불린값(참, 거짓)
    2. null (null값)
    3. undefined (값이 할당되지 않은 변수가 가지는 값)
    4. number 숫자(정수, 소수 모두 포함)
    5. string  문자열(문자열, 1개의 문자도 문자열로 처리)
    6. symbol(ECMA6에서 추가됨)

  2.  복합 자료형 (Composite data type)
    1. object 복합 자료형(모두 Object 취급)


 1) boolean은 다들 잘 알고 있듯 true, false이다.

 2) null의 경우 object 타입 변수는 할당되었지만 값이 빈 경우를 뜻한다.

 3) undefined은 선언만 되었을 뿐, 그 값이 할당되지 않은 것을 의미한다.

  조금 모호할 수 있는데 null은 상수이고, 초기화에 사용한다고 생각하자. undefined의 경우 동적 타이핑으로 인해 생기는 타입으로, var a;와 같이 선언만 한 경우 undefined로 처리된다.


 예를 들어, var a = null, b; 라고한다면, a의 타입은 "object"이며 값은 null이다. 반면 b의 타입은 "undefined"이며, 값 또한 undefined이다.

var a = null, b;

console.log(typeof a, a, typeof b, b);


 4) number는 영단어 그대로 숫자를 저장하는 타입이다. 다만, 실수 정수 상관없이 모두 담을 수 있다.

var a = 5.4;
console.log(typeof a, a);
a = 3;
console.log(typeof a, a);


5) string은 문자열으로, 특이하게 다른언어가 1개의 문자로 이루어진 것을 '문자'타입으로 구분하는것과 달리, 길이와 관계 없이 모두 문자열로 처리한다.

또한 홑따옴표와 곁따옴표를 구분하지 않고 괄호처럼 가장 가까이 페어만 맞아 준다면 혼용해서 쓸 수 있다.

console.log(typeof 'a', typeof 'abc', typeof "a", typeof "abc");
console.log(typeof "'a'", typeof '"abc"');


6) object, 자바스크립트에서 기초 자료형을 제외한 모든 복합 자료형을 Object로 구분한다.


 이번 포스팅에서 다루는 JSON, Date, 배열 등등 모두 Object 타입(엄밀히 말해 Key-Value페어의 Collection)이다.


 따라서 이러한 오브젝트들의 타입을 찍어보면 모두 "object"로 나오며, 우리가 기존에 알고 있던 것처럼 배열과 오브젝트를 구분하기 위해서는 Array.isArray(a)와 같이 Array 오브젝트의 멤버함수를 이용해야 한다.


 또한 모든 object는 key-value이다. 또한 키 정렬(언어별로 Hashmap, dictionary등으로 구현된 것과 같다고 보면 된다)이 되므로, 향후에 데이터 탐색등을 이용할때 편리하다.



   (3) 결국 JSON이란?

 사실상 Javascript에서는 object 타입이지만, 웹을 통해 데이터 전송에 쓰이게 되면 Javascript Object Notation으로 불린다. 또한 데이터 전송시에는 JSON을 문자열로 전달해야하므로 이를 문자열로 변경해주는 기능 모든 JSON 라이브러리에 포함된다.(이는 Javascript도 마찬가지)
var obj = { name : '123', age : 3 };
console.log(obj);

var strObj = JSON.stringify(obj);
console.log(strObj);

var parsedObj = JSON.parse(strObj);
console.log(parsedObj);
    (4) JSON 알아보기 

 이까지 알아보았다면, 이제 JSON은 자바스크립트의 단순한 object 타입이라는 것을 알게 되었을 것이다. 크게 웹 데이터 전송용 타입이라고 두려워할 필요도, 어려울 것도 없다.  

 조금 더 예제를 들어서 설명해보자.

 1) JSON 형식 (object라고 혼용해서 표현할 예정)


  object는 Key와 Value로 구성된 데이터 집합이다. Key는 Value를 가르키는 값으로 데이터 베이스상 Primary Key와 같이 object내에서 Value를 구분하는 유일한 값이되어야 한다.


 object에서 Key, Value 페어는 콜론(:)으로 구분하며, K-V 페어들은 콤마(,)로 구분한다. 또한 Key값은 항상 문자열 타입(string)으로 표기하지 않아도 알아서 인식하므로 편한 방법을 사용하면 된다.

var obj1 = { key : '우리집 열쇠', pwd : '486' };
var obj2 = { 'key' : '너희집 열쇠', 'pwd' : 48.6 };

  value에는 어느 값이든 넣을 수 있다. 따라서 계층적으로 Object안에 Object를 넣을 수 있다.



 2) 조금더 복잡한 JSON 예제


 이전 포스트에 썼던 것과 같이 http://coinlist.xyz/api/v1/top50 에서 반환되는 값을 가지고 알아보자.


 위의 API에서는 { "success" : true, "data" : [] } 의 형태의 JSON 1개를 응답한다. 여기서 success는 성공 여부를 담고 있는 boolean 타입,  data는 object(배열)을 담고 있다.


 그렇다면 data를 키로하는 object(배열)은 { "name", "code", "type", "supply", "h24Volue", "change", "price" }의 JSON을 배열 형태로 담고 있다.


따라서 위 API에서 반환되는 데이터 형식은 아래와 같다.

// 전체 응답 JSON 하나
{
  // 전체 응답 JSON의 KEY는 success, data
  // success는 boolean 타입
  "success" : true,
  // data는 object(array) 타입
  "data" : [
    // data의 value인 object는 아래의 object를 연속으로 가지는 배열이다.
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }, 
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }, 
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }, 
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }, 
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }, 
    { "name", "code", "type", "supply", "h24Volue", "change", "price" }
  ]
}


 사실 JSON이 굉장히 포맷에 유연하기 때문에 복잡해질 수도 있지만, 데이터를 전송해야하는 API 특성상 일정한 틀에 맞추어 데이터를 전달해준다.


 이러한 틀은 대부분의 API를 서비스하는 업체에서 개발자 정보등의 항목으로 설명하고 있으므로 크게 걱정하지 않아도 된다.




  (5) JSON의 기타 활용

1) 키값 찾기

 object의 키값을 찾기 위해서는 Object.keys 함수를 호출하여주면 된다. 이때 반환되는 타입은 object(배열)이다.

var obj = { 'key' : '우리집 열쇠', pwd : '486' };
var keys = Object.keys(obj);
console.log(typeof keys, keys);

  2) Key를 가지고 Value를 참조하는 방법

 이미 기존에 정의된 key라면 멤버 변수처럼 obj.key로 참조하면 되고, 아니라면 obj['key']형태로 참조해도 된다. 물론 없는 값을 참조하는 경우 undefined가 리턴된다.

var obj = { 'key' : '우리집 열쇠', pwd : '486' };
console.log(obj.key, obj['key']);
 
  3) 데이터 추가 및 삭제

 추가는 참조하듯이 자연스럽게 lvalue를 써주고 rvalue에 값을 넣으면 된다. 삭제의 경우 delete에 lvalue를 주면 삭제된다. 하지만 if(obj.key)와 데이터 존재를 확인하므로 ''(빈 문자열) 또는 undefined으로 값을 갱신해도 무방하다.

var obj = { 'key' : '우리집 열쇠', pwd : '486' }

// 추가
obj['nKey'] = '1234';

//삭제
delete obj['key'];

//갱신
obj['key'] = ''; //갱신같은 삭제
obj['key'] = undefined;
  
  이까지가 JSON에 대한 기본 지식이며, 추가적인 내용은 실제 사용하다가 불편한 점이 있다면 구글링해보는 것이 좋다. 다음 포스팅부터는 Jsoup으로 크롤링 예제를 보이면서 진행하도록 하자.  


posted by 궁금한 포도알77
2019.03.02 09:00 크롤링
 데이터 수집을 위한 크롤링 연속 포스팅 

[크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가?

[크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들

[크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명

[크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제

[크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링

1. 크롤링이란?

전편에 이어서, 이번에는 크롤링에 필요한 필수 요소들을 짚어보도록 하자.  


 

2. 크롤링 대상

 어떠한 목적을 가지고 정보 수집을 하는 경우, 그 목적에 부합하는 대상이 필요하다. 당연하게도 웹 크롤링의 대상은 웹 자원이다. 웹 자원의 경우 웹 문서와 API 결과, 좀 더 나아가서는 웹 서비스를 제공하는 서버의 IP, 정보, 프레임워크등등 다양하다.   


 이 연속 포스팅에서는 쉽고 간단하게 내용을 정리하기 위해서 웹 문서와 API를 크롤링 대상으로 선정할 예정이다.  


 

3. 크롤링에 필요한 사전 지식

 웹 문서와 API를 크롤링 대상으로 선정하였으므로, 웹 문서를 구성하는 언어인 하이퍼텍스트 마크업 랭귀지(HTML)과 API의 결과로 제공되는 포맷 (XML, JSON 등등)을 분석하고 데이터를 추출하는 방법을 알아야 한다.  

 (1) HTML HTML은 긴 역사를 자랑하는 언어이자, 웹 페이지를 형식화하여 사용자가 시각적으로 볼 수 있도록 하는 언어이다. 비유적으로 본다면, 문서의 제목은 30 포인트, 중앙 정렬등 문서가 보이는 형태를 규정하는 언어로 볼 수 있으며, 당연히 이 언어를 이해하는 프로그램(브라우저 등)이 이를 해석하고 동일한 형태로 사용자에게 제공한다.  

 대부분의 이 블로그를 보는 사람의 경우 프로그래밍을 학습한 사람이겠지만, 아닐 수도 있으니 F12를 눌러 개발자 도구를 열어보자.





 위 이미지는 이 블로그의 특정 페이지에서 개발자 도구를 열어 본 것이다. 좌측 상단에서 중간까지 위하고 있는 공간에 알록달록 영어와 숫자 그리고 특수문자들로 이루어진 괴랄한 형태의 문자들이 HTML로 구성되어 있는 소스코드이다. 


 HTML에 대해서 조금 더 알아보는 포스트를 준비하겠지만, 우선 간략하게 짚어보자.

 HTML은 특정 기능을 하는 태그로 구성되어 있다. 이러한 태그는 <태그1>과 같이 부등호와 태그 이름으로 구성되어 있다. 태그이름은 다양한데, 대표적으로 <html></html>, <head></head>, <body></body>를 예로 들 수 있다.

 html은 <html>과 </html>사이에 들어오는 값들이 html이라는 것을 의미한다. 더 다양한 태그들은 아래의 링크에서 알아볼 수 있다.



 https://www.w3schools.com/tags/tag_html.asp


우리가 알고 싶어하는 정보들은 이러한 태그들에 둘러 쌓여있거나, 포함되어 있다.





 위 그림은 네이버에서 사과를 검색했을 때 나오는 HTML로, 좌측에 보이는 "온거로 먹는 청송꿀땡이사과 5kg 1..." 이미지와 링크에 대한 정보들이 우측의 HTML상에서도 똑같이 표현되고 있다.

 즉, 내가 "사과"를 검색했을때 제일 먼저 노출되는 상품의 가격과 홈페이지의 링크, 리뷰 정보를 알고 싶다면, 이 웹 페이지의 "tit single" 클래스를 가지는 div 태그안의 a 태그의 href 정보와, "dsc price"클래스를 가지는 div 태그 내부의 가격 정보 그리고 "dsc compare" 클래스를 가지는 div 태그안의 em 태그의 리뷰 정보를 가져오면 된다.


 만약 설명이 이상해서 이해하지 못했다면 사과한다. 그러려고 사과를 이 포스팅에서 계속해서 사용하는 것이다.



  (2) API API는 Application Programming Interface로 특정 URL에 들어갔을때 데이터가 반환되는 것과 전혀 단어 의미가 맞지 보일 수 있다. 이를 구구절절 이야기 할 수 없으니 구글링을 생활화하자. 아무튼 REST API를 통해서 반환되는 데이터를 크롤링 대상으로 선정하였다면, 위의 HTML처럼 반환되는 형식을 읽을 줄 알아야 한다. 

  반환되는 형식은 현재 기준으로 크게 JSON과 XML 그리고 독자 형식으로 나눌 수 있다. 독자 형식의 경우 그 형식을 분명 설명하는 페이지가 별도로 구성되어 있을것이니 이는 넘어가도록 하고 JSON 형식과 XML 형식을 예로 들어 보자. 

  JSON 형식JavaScript Object Notation으로 XML이 가지는 용량 문제를 해결하기 위해서 사용되는 형식이다. JSON.ORG에서 굉장히 복잡하게 설명하고 있으나 아래와 같이 간단하게 구분할 수 있다.

1. Object, 오브젝트는 데이터를 뭉쳐놓은 것으로 이해할 수 있다. 이러한 데이터를 가져오기 위해서 Key와 Value 쌍으로 표현한다.

    { '블로그명' : 'IT 방랑기', '주소' : ['https://fatc.club', 'http://fatc.club'] }


2. Array, 잘 알려져 있듯 배열이며 Javascript 특성상 동일한 타입이 아니더라도 하나의 배열로 정의할 수 있다.

     [ '1', 2, 3.666 ]


3. string, 문자열을 나타낸다. 원칙상 쌍 따옴표를 쓰지만 홑따옴표로도 표현할 수 있다.

    '문자열'  또는 "문자열"

    'A씨가 "IT방랑기에서 봤다"라고 말했다'와 같이 따옴표를 혼용할 수 있다.


4. number, 숫자들을 나타낸다. 정수와 소수점을 모두 포함한다.

    1, 2.5, -1, 1000000000



 XML 형식eXtensible Markup Language로 기존의 HTML이 가지는 태그의 유한성의 문제를 해결하기 위해서 등장했다고 이해하면 비약이지만 이렇게 이해하자. 
 
 상호간 데이터 교환을 위해서 자신만의 태그를 정의하고 이를 태그들에 기반해서 표현하는 형식이다. XML을 정의하는 문서는 별도로 DTD나 XML 스키마등 다양하다. (XML은 매우 좋은 형식임에 틀림없지만..애석하게도 XML 형식은 너무 길다. 그래서 나는 잘 안쓰므로 JSON만 다룰 것이다.)  

 그렇다면, API으로 반환되는 JSON 데이터의 결과값을 실제로 구경해보자. 링크를 눌러 반환되는 결과 값을 보자. 

  

  http://coinlist.xyz/api/v1/top50  


 반환되는 형식은 Object로 { "success" : true, "data" : [] } 의 형태를 가지고 있다. success는 성공 여부를 true, false로 나태나며, data에는 Object가 배열로 저장되어 있다. data에 포함되어있는 Object는 "name", "code", "type", "supply", "h24Volue", "change", "price"를 키값으로 각각의 value를 보여주고 있다. 




4. 간단한 크롤링 예제

 물론 다음 포스팅부터는 JSoup을 이용하여 Java에서 크롤링을 중점적으로 다룰 예정이지만, 오늘은 간단한 맛보기로 이 포스트에서 등장한 사과 가격 정보 수집을 F12를 눌렀을 때 나오는 개발자 도구를 바탕으로 크롤링을 해보자. (이 예제는 크롤링이라기 보다, 크롤링을 어떠한 방법으로 하는지를 보여주는 예제이다.)   


 (1) HTML 사과 정보 크롤링

1.1 Naver 검색창에서 "사과" 검색

1.2 F12를 눌러 개발자 도구 열기

1.3 아래의 코드를 개발자 도구 Console에 붙여넣기.

 var appleInfo = { 
	link : '', price : '', reviews : ''
};
appleInfo.link = document.getElementsByClassName('tit single')[0].getElementsByTagName('a')[0].href;
appleInfo.price = document.getElementsByClassName('dsc price')[0].innerHTML;
appleInfo.reviews = document.getElementsByClassName('dsc compare')[0].getElementsByTagName('em')[0].innerHTML;

appleInfo.price = parseInt(appleInfo.price.replace(',',''));
appleInfo.reviews = parseInt(appleInfo.reviews.replace(',',''));
appleInfo;

    추신 : 위의 코드처럼 짜면 욕먹는다, 단순 예시임을 명심하자.



1.4 출력되는 정보 보기


 



posted by 궁금한 포도알77
2019.03.02 08:58 크롤링
최근 블로그의 유입 로그를 봤더니 생각보다 많은 사람들이 크롤링으로 내 블로그를 들어온다는 사실을 알았다. [Java] Jsoup을 이용한 간단한 웹 크롤러 만들기, 사실 이 글은 워드프레스로 오기 전에 쓴 글로 대학원에서 심심풀이로 썼던 기억이 난다. 블로그에 새글도 없기에 한번 크롤링을 간단하게 다루어서 글을 써보려고한다.  
 데이터 수집을 위한 크롤링 연속 포스팅 

[크롤링] 데이터 수집을 위한 크롤링 1편 : 크롤링이란 무엇인가?

[크롤링] 데이터 수집을 위한 크롤링 2편 : 크롤링에 필요한 필수 요소들

[크롤링] 데이터 수집을 위한 크롤링 3편 : JSON, 더 자세한 설명

[크롤링] 데이터 수집을 위한 크롤링 4편 : Java의 설치와 간단한 Jsoup 예제

[크롤링] 데이터 수집을 위한 크롤링 5편 : Yahoo 파이낸스를 이용한 환율 크롤링

1. 크롤링이란?

크롤링(Crawling)이란 사전적으로 기어다니는 것을 뜻하는데, 전산쪽에서는 Web상을 돌아다니면서 정보를 수집하는 행위를 뜻한다. 아마 web에서 그 의미가 파생된 듯 하다. 아무튼 크롤링, 스크래핑(Scraping) 또는 데이터 긁기등 다양한 단어로 불리우며 정확히 뭐가 맞는지는 나도 모른다. 다만 크롤링이 입에 붙어서 크롤링으로 부를 뿐이다.(학교에선 이런 것좀 가르쳐주지 쓸데없는 프로그래밍 언어 교육말고)   





Icon made from Icon Fonts is licensed by CC BY 3.0
 

 2. 크롤링 대상

앞서 언급된 크롤링에 정의에 따라, 크롤링의 대상은 웹 상의 자원들이다. 이 자원은 정적인 문서가 될 수도 있고, API와 같은 서비스가 될 수도 있다. 다만 어느쪽이던 다수의 데이터를 수집하고, 여기서 필요한 정보만 추출해서 처리하는 것을 우리는 크롤링이라고 부를뿐이다.   예를 들어 구글과 같은 검색엔진에서는 웹 사이트의 정적인 데이터를 긁어다가 필요한 정보를 추출해서 검색 인덱스를 생성하고, 가격 정보 비교 사이트는 상품과 가격정보등을 긁어다가 서로 다른 쇼핑몰의 가격을 알려주기도 한다. 크롤러는 사실 그렇게 엄청난 것이 아니며, 필요에 따라 누구든지 제작할 수 있다.   물론 정보 수집 대상이 웹이 아닌 경우가 있지만, 이 경우에는 다른 이름으로 불리우는 경우가 많고 크롤러 정의상 범주 밖에 있으니 넘어가도록 하자.  

3. 크롤링 툴, 라이브러리

사실 어떤 툴이든 라이브러리를 사용하든 정보를 수집한다는 것은 변함이 없다. 다만 자신의 필요에 맞게 사용하면 된다. 가장 일반적으로 호스트 프로그램을 통해서 데이터를 수집할 수 있는 라이브러리에는 Beautiful soup, 자바 버전인 JSoup, 브라우저를 이용한 Selenium 등이 있다.  

 딱히 보여줄 이미지가 없다.

 

4. 크롤링 메커니즘

크롤링 매커니즘은 대략적으로 아래의 단계를 통해서 진행된다. (1) 대상 선정 -> (2) 데이터 로드 -> (3) 데이터 분석 -> (4) 데이터 수집

 (1) 크롤링 대상 선정 (API 또는 웹 문서)

   웹 상의 데이터는 고유한 ID를 가진다. URI라고 부르며, 이는 우리가 잘 하는 웹 사이트 주소인 URL과 URN이 있다.

 간단하게 과일에 대한 네이버 검색 결과를 크롤링하려면 "https://search.naver.com/search.naver?query=사과", "https://search.naver.com/search.naver?query=배"의 URL을 선정하는 과정이다.




네이버 사과 검색시 화면

 (2) 데이터 로드 

  데이터 로드는 웹 사이트를 켜는것과 같다. 만약 API라면 XML, JSON 문서가 될 것이고, 웹 페이지라면 HTML 문서를 다운로드 받는 것이다.

 (3) 데이터 분석

  로드된 데이터에서 필요한 부분을 뽑아내는 것을 뜻한다. 당연하게도 웹 사이트상에는 내가 필요로하지 않는 부분이 많다.

 어떠한 부분을 수집할지, 어떤 부분을 수집하지 않을지 선정하는 과정이다.





어떠한 광고 요청도 받지않았다. 단지 검색됐을 뿐..

 (4) 수집

 데이터 분석 과정을 통해서 수집할 내용을 선정했다면, 이를 추출하여 파일 또는 데이터를 메모리상에 저장하는 과정이다.

    다음 포스트부터는 Jsoup을 이용하여, 데이터를 수집하는 절차들을 다뤄볼 예정이다.  


posted by 궁금한 포도알77
prev 1 next