https://github.com/strong1133/MyPL
Flask
- Flask를 사용해서 <app.py> 에 <index.html, style.css, script.js 연결>
- 데이터 크롤링을 하기위해 파이썬 soup를 이용해 타겟 사이트 크롤링시도
Selenium
- soup를 통한 크롤링 실패 -> 타겟 사이트에서 JS로 동작하는 동적 요소들을 data.text를 사용하는 정적 크롤링으로는 데이터를 가져올수 없음.
- selenium은 webdriver를 통해 브라우저를 직접 제어하여 동적요소를 끌어올수 있음.
Selenium + BeautifulSoup4
- Selenium을 통해 타겟사이트와 driver 세팅
- BeautifulSoup4를 이용해 driver 세팅된 사이트에서 selector를 지정해 크롤링
API
-
GET방식을 통해 사이트 시작되면 해당 데이터들을 HTML에 뿌려줌
-
문제점
1. selenium의 driver.get() 으로 인해 구글 크롬창이 자꾸 켜짐
-> chrome_options = webdriver.ChromeOptions()
-> chrome_options.add_argument('headless')
로 해결2. 페이지가 켜질때마다 정보를 새로 크롤링해서 실행하면 크롤링 하는 시간 때문에 로딩이 길어짐
-> pymongo를 통해 DB에 크롤링데이터를 저장하는 테이블을 설계
-> DB에서 해당 데이터를 딕셔너리로 받아와 GET방식을 통해 넘겨줌.
-> api를 통해 넘겨준 데이터를 ajax를 통해 받아 append를 통해 HTML에 새로이 뿌려줌3. 경기일정이 팀마다 제각각이며 이로 인해 순위표 변경이 불규칙적으로 발생
-> DB에 저장된 정보는 정적정보이기 때문에 실시간 반영이 되지 않음.
-> 생각 날 때마다 DB에 새로 저장을 해주기엔 너무 번거로움.
-> app.py가 시작할때 DB의 최신화 유무를 검토해주는 방식으로 생각.
-> 크롤링을 할때 순위표의 모든 정보를 긁어오는게 오래 걸리는 것이기 때문에 DB가 최신이 아닌 경우에만 동작하게 해야 효율적이라 판단.
-> 그렇다면 최신화검사시에만 필요한 정보만 크롤링하고 바로 driver.quit해주면 비교적 빠르게 selenium이 동작할것으로 판단.4. 해결
-> 순위표의 수많은 정보중에서 시간 값은 순위표에 있지도 않고 팀마다 경기일정이 너무 달라 시간으로 최신화유무는 체크할수 없다.(일정 주기마다 하는걸로 하면 가능하긴 하지만 우리의 서비스를 이용하는 시간도 불규칙적 일것이기 때문에 delay로 인한 정보의 불일치가 있을수 있다.)
-> 순위표의 값들 중 경기가 있었다면 경기 결과에 상관없이 무조건 변하는 값은 팀별 경기수.
-> 우선 DB에 저장되어있는 경기수의 합계와
-> 크롤링을 통해 경기수만 가져와서 합산
-> if문을 사용하여 두 값을 비교해서 최신인지 아닌지 구분
-> 최신이 아니면 DB를 먼저 empty후 새로 insert
-> 최신인경우 종료후 app.route실행
->(두 데이터가 모두 배열에 저장되어 있는 문자형식의 데이터라 배열에서 추출후 다시 형변환하여 더해주는 과정을 거침.)
다음 수행 업무
- 튜터님과 상의 후 세부내용 결정
- 추가 CSS구성
- 버튼 들 css, hover시 css
- 전체적인 디자인 검토
- Tab 구성
- 추가적으로 다른 데이터 크롤링 하는 작업 시작
