저번 보도에 대한 반응은 차가웠지만 필기를 해야 했다.
지난번에는 호출 기능이 있는 사이트를 대상으로 리스트 내용을 일람하는 웹 파행기를 제작했다.대상 사이트일본 IBM 개발자 웹 사이트: Code Patterns는 100개 이상의 모델 정보를 포함하는 배열JSON 데이터을 생성했다.
이 샘플을 확대해서 다른 사이트의 자유형을 실행해 보세요.나는 도구의 구조와 확장 방법을 이해하는 데 도움이 된다고 생각한다.

영어 사이트를 복제해 보다

일본 사이트에 번역원영어 사이트이 있는데 저도 그와 상의한 적이 있습니다. 저도 자유형을 하고 싶습니다.
아니, 그냥 영어 버전이면 URL만 바꾸면 안 돼?그런데 왜 방문한 후에 사이트의 구조와 사이트의 조립 방법이 다르다는 것을 발견했을까.그래도 상당히!따라서 원래의 공구를 개조하여 기타 도구로 설치하였다.

어쨌든 js 파일을 준비할게요.

list-ibmjs-patterns.js 파일을 복사하여 list-ibm-patterns.js라는 파일을 만든다.어쨌든 먼저 시작 부분을 영어 사이트로 바꾸자.
list-ibm-patterns.js

if (process.argv.length !== 2) {
    console.log('list-ibm-patterns.js');  // メッセージを英語サイト用に変更した
    console.log('  Simple crawler tool to list patterns from IBM Code patterns site.');
    console.log('  2018/11/24 by github.com/yamachan');
    return;
}

const nedb_file_name = 'list-ibm-patterns.nedb';  // nedb ファイル名も忘れず変更する

먼저 호출기 기능 확인

지난번과 같이 실시대상 사이트의 URL 분석하죠.
먼저 2페이지의 URL입니다.
https://developer.ibm.com/patterns/page/2/
네.그런 다음 이를 첫 페이지에 적용하면 다음 최상위 수준으로 리디렉션됩니다.
https://developer.ibm.com/patterns/
여기까지는 일본어 사이트와 동일합니다.
그러나 영어 홈페이지에서 9999쪽의 표시를 확인하면 404 오류가 발생한다.이후 주 순환을 수정할 때는 검사가 끝날 때 시간이 좀 걸릴 것 같다.
https://developer.ibm.com/patterns/page/9999/
기본적으로 똑같아요, 이렇게 진행해요.우선 영어 사이트에 따라 대상 URL을 얻는 함수를 수정한다.
list-ibm-patterns.js

function getListURL(_page) {  // 日本版から /jp を外しただけです
    if (_page == 1) {
        return 'https://developer.ibm.com/patterns/';
    } else {
        return 'https://developer.ibm.com/patterns/page/' + _page + '/';
    }
}

사이트 내용 분석

다음은사이트 내용 분석.페이지에 배열된 카드 형식의 콘텐츠 목록을 대상으로 하기 때문에 웹 브라우저를 활용할 수 있는 개발자 도구를 찾아 이런 문제점을 해결할 수 있는 조건을 찾아야 한다.

목록 대상이 ibm-card라는 등급을 부여받았음을 알 수 있습니다.일본판보다 하이픈이 더 많은데... 그 부모가 되는 요소는 cpt-content 반에 부여됐다.
따라서 개발자 도구의 컨트롤러로 전환해서 이 조건들이 범위를 좁히는 데 사용할 수 있는지 확인하십시오.
개발자 콘솔

document.querySelectorAll(".cpt-content .ibm--card")

페이지 내 8개 모드(일본판은 15개)가 열거된 것을 잘 확인했다.

당장, js 코드에 있어서 이 값을 미리 반영하십시오.
list-ibm-patterns.js

const list_item_query = '.cpt-content .ibm--card';

운영 논리 업데이트

다음은 주 논리다.
일본어 버전은'웹 페이지를 방문하여 얻은 요소 수가 0이 아니면 계속 순환한다'는 조건으로 처리 순환을 진행한다.그러나 영어판에서는'요소가 없는 페이지는 404 오류를 되돌려준다'는 이유로 순환하는 조건을 조금 수정해야 한다.
이번에 우리는 코드를'영어판도 일본어판과 같이 순환'으로 수정했다. 즉,'404 오류가 되돌아오면 오류가 끝난 것이 아니라 소수를 0으로 처리한다'는 것이다.실현은 다음과 같다.
list-ibm-patterns.js

(async () => {
    let page = 1;
    let number_of_items = 0;
    let count_of_items = 0;
    do {
        console.log('LOOP: page = ' + page);
        let url = getListURL(page);
        let ret = client.fetchSync(url);
        if (ret.error || !ret.response || ret.response.statusCode !== 200) {
            console.log('ERROR:' + url);
            number_of_items = 0;  // エラー時に終了させず要素数を0にセットする
        } else { // 以降の処理は元のまま
            let items = ret.$(list_item_query);
            number_of_items = items.length;
            processListItems(ret, items, page);
            count_of_items += number_of_items;
            console.log('number_of_items = ' + number_of_items);
            page++;
        }
    } while (number_of_items > 0);
    console.log('count_of_items = ' + count_of_items);
})();

단지 return 만든 부분을 number_of_items = 0로 고쳤을 뿐, 다른 코드는 거의 그렇다. 알겠니?종료 조건에 기반한 코드 변경 이외에 직접 사용할 수 있는지 확인하세요.
또한 오류 문이 저장되어 있기 때문에 정상적으로 끝나도 오류가 한 번 표시됩니다.됐어, 디테일에 신경 쓰지 마.

목록 객체 분석

그러면 메인 순환을 업데이트한 후 목록 객체 분석에 착수합니다.

이 구성을 단서로 삼아 필요한 데이터의 각각의 요소를 얻어cheerio와cheerio-httpcli의 방법으로 조작하여 값을 얻는다.객체 구성에 따라 itemToObject 함수를 업데이트합니다.
list-ibm-patterns.js

function itemToObject(_ret, _item) {
    return {
        title: _ret.$('h3', _item).text().trim(),
        url: _ret.$('a.ibm--card__block_link', _item).url(),
        date: _ret.$('.ibm--card__date', _item).text().trim(),
        tech: _ret.$('span.bx--tag--category', _item).map(function(){
            return _ret.$(this).text().trim()
        }).get().sort()
    };
}

같은 카드 형식이지만 일본판과는 내용이 다르다.개요문과 GiitHub의 URL은 없지만 업데이트 날짜가 표시됩니다.
생성된 데이터(Object)의 속성과 달리 checkUpdateObject 함수도 이에 따라 수정됩니다.
list-ibm-patterns.js

function checkUpdateObject(_obj, _doc) {
    return JSON.stringify(_obj) !== JSON.stringify({
        title: _doc.title,
        url: _doc.url,
        date: _doc.date,  // ここ追加
        tech: _doc.tech
    });
}

이렇게 완성이 됐습니다.

도구의 업데이트는 이것으로 끝냅니다.아래와 같이 영어 사이트의 정보를 복제하십시오.

node list-ibm-patterns.js

해당 페이지 삭제

대상 사이트에서 삭제 페이지가 있는 경우 이에 대한 문제가 있습니다.이번 도구의 동작도 매우 가벼워서 작업과 재료를 줄이는 페이지가 삭제되는 대응 논리가 없다.다음에 논리 삭제에 대해 설명하고 싶은데요.
따라서 *nedb 파일을 삭제한 다음 도구를 실행해서 목록을 다시 만듭니다.

이용에 주의하다

nedb의 특징으로서 갱신 처리 후 신구 쌍방의 정보는 모두 *이다.nedb 파일에 남아 있는 경우가 있습니다.이것은 UPDATE가 다시 실행하는 도구가 확실하다는 것을 표시하기 때문에 다시 읽기가 해제되었습니다.json 형식의 파일을 얻으려면 다음과 같이 실행하는 것이 안전합니다.

node list-ibm-patterns.js
node list-ibm-patterns.js
node nedb2json list-ibm-patterns.nedb > list-ibm-patterns.json

실제 생성된 JSON 형식의 데이터는 이쪽에 공개된다.

즉

같은 사이트의 영어판과 일본어판인 줄 알았는데 큰 차이가 있어서 깜짝 놀랐어요.그럼에도 호출기 기능을 사용한 사이트는 같고 카드 형식도 비슷해 고생하지 않아도 도구에 대응할 수 있다.
지난번 일본어 웹사이트용 코드list-ibmjp-patterns.js는 이번 영어 웹사이트용 코드list-ibm-patterns.js에 비해 사용할 수 있는 코드와 구성, 대상에 따라 변경해야 하는 코드까지 대략적으로 볼 수 있겠죠.
실제로 자유형이 필요한 사이트도 있는데 시간이 나면 투고로 정리하고 싶어요.적어도 미래의 내가 읽으면 참고 가치가 있을 것 같아 w
그럼 이따 봐요!