728x90
자바스크립트 크롤링을 사용해야하는 경우
- 웹 사이트가 동적으로 로딩한 데이터를 수집하는 방식
- 패킷 스니핑으로 데이터를 찾을 수 없을때 사용
이러한 데이터들은
HTML
소스코드 안에 있다고 합니다(json)
1. 먼저 데이터를 정적으로 가져오는지 동적으로 가져오는지 확인 (자바스크립트를 꺼본다)
2. 동적인데 fetch에도 데이터가 없다면 html이나 js에서 데이터(json)형태 찾아보기
3. 정규표현식으로 데이터 형태만 가져오기
이게 크롤링을 하면 할수록 숨어있는 데이터를 잘 찾는것이 중요한 거 같아요
그리고 정규표현식으로 원하는 데이터를 추출할 줄 알아야 해요
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSON in script</title>
</head>
<body>
<h1>제품 목록 페이지</h1>
<ul id="product_list">
</ul>
<!-- (1) Script 태그 내부에 JSON 포함 -->
<script id="product_data">
var productData = {
"items": [
{ "id": 101, "name": "Laptop", "price": 1000 },
{ "id": 102, "name": "Smartphone", "price": 400 },
{ "id": 103, "name": "Tablet", "price": 200 }
],
"itemCnt": 3,
"category": 12
};
</script>
<!-- 제품 목록 생성 스크립트 -->
<script>
var productList = document.getElementById("product_list"); // ul 요소 가져오기
// productData 객체의 items 배열 순회
productData.items.forEach(function (item) {
var li = document.createElement("li"); // li 생성
li.textContent = "제품명: " + item.name + ", 가격: " + item.price + "원"; // 텍스트 설정
productList.appendChild(li); // ul에 li 추가
});
</script>
</body>
</html>
이런 html코드에서
pattern = r'var\s+productData\s*=\s*(\{.*?\});'
match = re.search(pattern, res.text, re.DOTALL)
이렇게 정규표현식을 사용해주면
이런식으로 json형태로 뽑아낼 수 있어요
여러 웹의 데이터를 가져오는 연습을 많이 해봐야 할 거 같아요
728x90
'크롤링' 카테고리의 다른 글
| 봇탐지 우회 (1) | 2025.03.29 |
|---|---|
| 로그인이 필요한 서비스 자동화 - 쿠키와 세션 (1) | 2025.03.26 |
| 무신사 크롤링 (0) | 2025.03.23 |
| 크롤링 - 키움증권 (2) (0) | 2025.03.18 |
| 크롤링-키움증권 고객문의 (0) | 2025.03.17 |