【GAS】スクレイピングで便利なCheerioライブラリの使い方･サンプルコード

2022-08-16

今回は､自分でもよく使うスクレイピングに便利なライブラリCheerioライブラリの使い方とサンプルコードを自分用のメモとして､書き残しておこうとおもいます｡

Cheerioライブラリの導入

ライブラリから下記のIDを入力しましょう｡

1ReeQ6WO8kKNxoaA_O0XEQ589cIrRvEBA9qcWpNqdOP17i47u6N9M5Xh0

ちなみにライブラリIDは下記の形式でURLを入力をすると､ソースコードを直接閲覧できます｡

https://script.google.com/home/projects/*********************/edit

Cheerioライブラリの場合だと以下のURLです｡実に18000行のコード量･･･!ということがわかります｡

https://script.google.com/home/projects/1ReeQ6WO8kKNxoaA_O0XEQ589cIrRvEBA9qcWpNqdOP17i47u6N9M5Xh0/edit

テスト用のHTML

GASのファイルの追加からHTMLを追加します｡ファイル名は｢test/CherioSample｣としてください｡

test/CherioSample

<html>

<head></head>

<body>
  '<h2 class="title">Hello world</h2>'
  <ul id="fruits">
    <li class="apple">Apple</li>
    <li class="orange">Orange</li>
    <li class="pear">Pear</li>
  </ul>
  <ul id="people">
    <li class="human">Bob</li>
    <li class="human"><b>Tom</b></li>
    <li class="human">Joy</li>

  </ul>
</body>

</html>

サンプルコード

元となったライブラリのサンプルコードをGASにだいたい書き直したものです｡

/**
 * 元のHTMLを取得して､要素をいじる
 */
function textAndAddClass() {
  const html = HtmlService.createTemplateFromFile("test/CherioSample.html").getRawContent()
  const $ = Cheerio.load(html)
  $('h2.title').text('Hello there!'); //テキストを書き換える
  $('h2').addClass('welcome'); //classを追加する｡

  console.log($.html());

}

/**
 * 
 */
function selecter() {
  const html = HtmlService.createTemplateFromFile("test/CherioSample.html").getRawContent()
  const $ = Cheerio.load(html)

  console.log($('.apple', '#fruits').text());
  //=> Apple

  console.log($('ul .pear').attr('class'));
  //=> pear

  console.log($('li[class=orange]').html());
  //=> Orange

  $('[tags=li]').each((i,elem)=>{
    console.log($(elem).text())
  });

}

/**
 * eachを使うと個別の要素を取り出せる｡
 */
function testCherioEach() {
  const html = HtmlService.createTemplateFromFile("test/CherioSample.html").getRawContent()
  const $ = Cheerio.load(html)
  
  $('[class=human]').each((cnt,elem)=>{
    console.log($(elem).html())
  });
  //=>Bob
  //=><b>Tom</b>
  //=>Joy

  $('[class=human]').each((cnt,elem)=>{
    console.log($(elem).text())
  });
  //=>Bob
  //=>Tom
  //=>Joy

}

単純なページであればこれで取得ができますね｡
今回は､以上です｡