큰일이다.
메인과 상세보기 페이지까지 완성된 마당에
프로젝트 주제가 변경되었다.
주제가 바뀌었다는건....
데이터를 다시 수집해야 하고
템플릿도 다시 구해야하며
메인화면과 아이콘 등
처음부터 다시 시작함을 의미한다.
원래 주제는 자격증에 관한 교재와 강의 정보를 한 사이트에서 찾아볼 수 있도록 하는 것이었다.
하지만 해당 데이터는 정보만 제공하고 끝나는 정적인 분위기라서 주제를 변경하는 것이 어떻게냐고 하셨다.
한 달이 넘는 기간 중 2주 밖에 남지 않은 시점인데 (1/3 정도만 남은 상황) 여기서 주제를 변경한는 것은 쉬운 결정은 아니었다. 하지만 조원 모두 신중히 결정한 끝에 주제를 변경하는 것으로 결정했다.
단 하루만에 주제를 정하고, 템플릿까지 정했다. 확실히 두번째라 그런지 단합이 잘 되는 것을 느꼈다!
새로운 주제는 '캠핑'이다.
전국에 있는 캠핑장에 대한 정보와 캠핑용품, 그리고 캠핑 요리에 대한 레시피를 제공한다.
내가 맡은 부분은 레시피 페이지와 로그인, 회원가입&수정 이다.
시간은 촉박하지만, 다시 새롭게 하는 마음으로 화이팅 해보자!
당장 해야하는 건 데이터 크롤링이다. 데이터 크롤링 사이트는 레시피 관련 사이트이다.
지금부터 원하는 페이지에서 데이터 크롤링하는 연습을 해보자.
jsoup 사이트를 이용한 데이터 크롤링
데이터 수집에 앞서 아래 jsoup 페이지를 통해 선택자 연습이 가능하다!
Try jsoup online: Java HTML parser and CSS/XPath debugger
Try jsoup online: Java HTML parser and CSS/XPath debugger
try.jsoup.org
해당 페이지에 들어가면 메인에 Fetch URL 버튼이 있다. 버튼을 눌러 URL 주소를 입력하고 Fetch버튼을 눌러주자.
크롤링 하고자 하는 화면에서 개발자 모드(F12 또는 ctrl+shift+i) 를 켜면
데이터의 태그와 클래스 명 등을 확인 할 수 있다.
그럼 그 태그 명과 클래스를 가지고 json 페이지에서 데이터가 출력되는지 확인하면 된다.
Select > Query 텍스트 상자에 원하는 데이터를 선택자를 가지고 추출할 수 있다.
밑의 이미지를 참고하자.
| 태그 <> | 클래스 선택자 . | 아이디 선택자 # |
보통은 위의 3개의 선택자를 통해서 대부분 크롤링이 가능하다.
선택자에 대한 설명은 밑의 글을 참고 바란다.
[CSS] 선택자의 종류와 사용법
HTML과 CSS를 구분할 때 CSS = 화면 디자인 이렇게 단순하게 생각해도 좋다. 화면 디자인을 하기 앞서 선택자를 반드시 알아야 한다. 그렇다면 선택자는 무엇일까? 선택자 CSS는 외부 CSS, 내부 CSS, 인
codingwone.tistory.com
이렇게 json 페이지를 통해 크롤링이 가능할지 점검해보고 편집기를 이용해서 DB에 데이터를 저장하면 된다.
내가 사용하는 편집기는 이클립스다.
이클립스를 이용한 데이터 크롤링
이클립스 편집기를 이용해서 데이터 크롤링 하는 방법을 소개하겠다.
먼저 크롤링 하고자 하는 페이지의 소스를 복사한 뒤 하나의 변수 안에 저장한다.
String html="<!DOCTYPE html>"
+ "<!--[if (IE 6)|(IE 7)|(IE 8)|(IE 9)]>"
+ "<html lang=\"ko\" xmlns=\"http://www.w3.org/1999/xhtml\" class=\"old_ie\">"
+ "<![endif]-->"
+ "<![if !IE]>"
< 이 하 생 략 >그다음 try~ catch 절 안에서 데이터를 추출한다.
Document doc = Jsoup.parse(html);
Element subject = doc.selectFirst("div.view2_summary_in");
System.out.println(subject.text());div 태그 중 클래스 이름이 view2_summary_in 인 데이터의 text 부분만 잘라서 가져오겠다는 의미이다.
결과 >
이렇게 도스 창에 출력된다 !
이번엔 제목을 한번 가져와 보자!
Element title=doc.selectFirst("div#contents_area h3");
System.out.println(title.text());div 태그 아이디가 contents_area 중에서 h3 태그에 있는 text를 가져오겠다는 의미이다.
이런식으로 하나하나 변수를 저장 후에
변수 값을 오라클 DB에 저장하면 된다 !
'실습' 카테고리의 다른 글
| [1차 프로젝트] #6 헤더 메뉴 조건 설정하기 (로그인 하면 바뀌는 네비게이션바 만들기) JSTL (0) | 2022.08.13 |
|---|---|
| [1차 프로젝트] #5 테이블 생성 (직접 테이블 생성하기) (0) | 2022.08.08 |
| [1차 프로젝트] #3 로그인 폼 (코드 펜 디자인 가져오기) (0) | 2022.08.07 |
| [1차 프로젝트] #2 목록에서 클릭하면 상세보기로 넘어가기 (0) | 2022.08.06 |
| o[1차 프로젝트] #1 목록 출력(페이징 기법 자세히 설명드릴게요!) (0) | 2022.08.05 |