웹 캡처는 로봇이 특정 사이트에서 데이터를 얻는 과정으로 화면 캡처와 달리 화면 캡처는 화면 픽셀만 복제하고 웹 캡처는 사이트 링크의 하부 HTML 데이터를 추출하며 링크가 제공하는 데이터베이스에 있는 데이터를 포함한다.그렇다면 이 기술의 사용은 합법적입니까?간단한 대답은: 네, 보이.
만약 동적 웹 페이지에서 데이터를 삭제하려고 한다면, 이것은 도전적인 작업일 수도 있다.그러나 초보자로서 정적 페이지를 스크랩해 보겠습니다.

지게와 무한궤도식 지게의 차이:

파충류는 웹 사이트의 모든 링크와 페이지를 훑어볼 뿐, 웹 페이지의 하위 집합이 아니다.다른 한편, 웹 스크립트는 사이트의 특정한 데이터에 주목한다.따라서 간단히 말하면, 인터넷은 더욱 집중적인 방법과 목적을 가지고, 인터넷 파충류는 사이트의 모든 데이터를 스캔하고 추출한다

우리는 무엇을 추출할 것입니까?

우리 피해자 페이지는 IMDB입니다.일반 도메인 이름 형식.지금 너는 IMDB가 동적 웹 페이지가 아니라고 생각하고 있니?예, 하지만 웹 사이트 전체를 삭제하지는 않았습니다. 저희는 특정 제품 링크의 데이터를 추출했을 뿐입니다.예를 들어 이 링크IMDB.com/top-movies
상위 250개 영화를 보여주는 IMDB top movies 페이지
따라서 영화 제목과 시청률을 추출해 TXT 또는 CSV 파일에 저장하는 것이 목표다.

첫걸음설정:

그래서 스크래치에 대해 우리는 프로젝트를 시작하기 위해 세 개의 가방이 필요하다.아래 코드를 붙여넣고 패키지를 node_modules 디렉토리에 설치하면 됩니다.

npm i cheerio fs request

cheerio nodeJS의 HTML을 해석하는 데 도움을 줍니다.이것은 서버 측의 웹 스팸 처리에 사용되는 효과적이고 강력한 기술이다.
필요한 경우 FS 모듈을 node_modules에 미리 설치해야 합니다.
이전에 npm init 명령을 사용한 적이 있습니다.

두 번째 단계.네트워크에 요청:

우리는 요청 패키지를 사용하여 사이트에 요청을 보내고 받을 것입니다.우선, 우리는 require("packagename") 문법으로 이전에 설치된 세 개의 소프트웨어 패키지를 가져올 것이다.

const request = require("request");
const cheerio = require('cheerio');
const fs = require("fs");

그리고 Google은 웹 사이트 링크를 저장하기 위해 새로운 상수 URL 를 정의할 것입니다.
이제 request 함수를 만들 것입니다.두 개의 매개 변수를 분배하는 요청 함수입니다.하나는 요청을 보낼 URL이고, 다른 하나는 세 개의 인자가 있는 리셋 함수와 유사하다. error, response, body.

const url = "https://www.imdb.com/chart/top/?ref_=nv_mv_250";
// website URL for sending request

request(url , (err , res , body) => {
   if (err) console.log(err) // if something gets wrong
   else {
      console.log("request sent successfully ! ")
   }
}) 

따라서 URL이 파괴되거나 무효가 되거나 사이트 서버에'404 오류'가 발생하면 조건 처리 방법으로err를 되돌려야 합니다.만약 줄의 정보를 보았다면, 이것은 당신의 요구가 성공했다는 것을 의미한다.
지금 우리는 반드시 몸을 사용하여 데이터를 추출해야 한다.따라서 주체를 해석하는 매개 변수를 포함하는 parseBody 함수를 만들었습니다.
신청 코드는 다음과 같습니다.

const url = "https://www.imdb.com/chart/top/?ref_=nv_mv_250";
// website URL for sending request

request(url , (err , res , body) => {
   if (err) console.log(err) // if something gets wrong
   else {
      parseBody(body);
   }
}) 

3. 본문 해석:

이제 재미있는 부분이 시작됐다.요청한 HTML 코드에서 내부 데이터를 분석하거나 추출합니다.HTML은 cheerio를 사용하여 해석합니다.
본 블로그에서는 cheerio 패키지의 기본 지식만 사용합니다.깊이 알고 싶으면방문cheerio.org.
html 주체를 처리하기 위해 parseBody 함수를 만듭니다.

function parseBody(body) {
   const $ = cheerio.load(body)

   return $.html() // return the whole html body of the page
}

parseBody에서 우리는 .load 함수를 사용하여 요청 주체를cheerio 모듈에 불러옵니다.

4. 추출할 요소를 확인합니다.

IMDB로 이동하여 검사 탭을 엽니다.추출할 HTML 요소를 탐색합니다.여기서 우리는 시청률을 포함한 영화명을 얻을 것이다.

우리는 class 속성 중의 항목을 선택할 것이다.
그러면 코드로 돌아가기

function parseBody(body , callback) {
   const $ = cheerio.load(body)

  const movieName = $("tbody.lister-list").find("td.titleColumn > a").text()

return movieName

}

cheerio의 선택기는 jquery와 유사합니다.클래스 이름, ID 및 기타 속성을 입력할 수 있습니다.
이것은 클래스 이름에 포함된 모든 텍스트 요소 titleColumn 를 되돌려줍니다.우리는 매우 매력적으로 만들었지만, 모든 이름이 함께 되돌아갔다.이렇게:

그러나 우리는 이것이 titleName 값을 포함하는 여러 개의 대상을 만들고 하나의 그룹에 넣기를 원하지 않는다.
이를 위해 우리는 .each 가방 중의 cheerio 방법을 사용해야 한다.그것은 단지 같은 원소 이름으로 순환을 할 뿐이다.
다음은 구문입니다.

$("element").each(function(index) {$("child element")});

그래서 우리는 each 방법을 우리의 코드에 넣는다.

function parseBody(body, callback) {
  const $ = cheerio.load(body);

  const movieName = $("tbody.lister-list > tr").each(function(index) {
     const movie = {

      name : $(this).find("td.titleColumn > a").text()
     }
     console.log(movie)

   })


}

현재, 순환을 실행하고 모든 td 요소를 되돌려주며, 잠시 후 되돌아오는 대상에 놓을 것입니다.
결과:

이제 화push 대상을 가진 등급을 특정 변수에 두자.
마지막 코드는 다음과 같습니다.

const request = require("request");
const cheerio = require("cheerio");
const fs = require("fs");
// importing the modules

const url = "https://www.imdb.com/chart/top/?ref_=nv_mv_250";
// the url we want to scrap

request(url, (err, res, body) => {
  if (err) console.log(err);
  else {
    parseBody(body); // calls the function with body
  }
}); // sending request to the url or the webpage



function parseBody(body) {
  const $ = cheerio.load(body);  // cheerio loads the HTML body
  let array = [];
  $("tbody.lister-list > tr").each(function (index) {
    const movie = {
      name: $(this).find("td.titleColumn > a").text(), // the name of the movie
      rating: $(this).find("td.ratingColumn > strong").text(), // the rating of the movie
    };
    array.push(movie);
  });

  console.log(array);
} 

결과는 다음과 같습니다.

제거150 more items...(마지막에 표시됨)하려면 console.log(array)만 (으)로 교체하십시오.

console.dir(array , {maxArrayLength : null})

감사합니다:):