ソースコードからデータを抽出する

Sunday, April 08, 2018 9:24 AM

質問: ソースコードとは何ですか?

答え: ソースコード は、プログラミング言語で記述されたテキストです。したがって、Webページのすべての情報が含まれています。Webページのソースコードを表示するには、右クリックして「ソースの表示」を選択すればよいです。

 

なぜソースコードからスクレイピングする必要がありますか?

星の評価のような非テキストコンテンツを抽出する場合、評価の値がページに直接表示されないため(星のみ)、「Extract text of the element」を使って直接評価を抽出できません。ただし、この情報をソースコード-HTML から取得できます。そのほか、テキストとして直接抽出するので、必要なデータに他の乱雑なデータを混ぜることがあります。この場合、HTMLからデータをスクレイピングできます。

 

 

Octoparseは、ソースコードからデータを直接抽出する機能をサポートしています。このチュートリアルでは、内部HTMLと外部HTMLから抽出する方法を説明します。

 

1) 内部HTMLからデータを抽出する

2) 外部HTMLからデータを抽出する

3) HTMLに関連するデータ再フォーマットツール

 

 

 

 

 

1) 内部 HTML  からデータを抽出する

HTMLは、Webページを作成するためのマークアップ言語の1つです。要素の内部HTMLを抽出すると、その要素に含まれるHTMLマークアップが取得されます。ですから、画像やアイコンの形で表示された情報には、まず内部HTMLを抽出し、データ再フォーマットツールで取得したコードから対象データを抽出できます。

Yelp.comでレストランの星の評価を例として使います。

  • 「星の評価」をクリックします。
  • 「Extract inner HTML of the selected element」を選択します。

web scraping with octoparse - scrape html 

ワークフロースイッチweb scraping with octoparse - scrape htmlを開き、ワークフローモードに切り替えます。抽出された内部HTMLが「Data field」に追加されました。

         <img class="offscreen" src="https://s3-media2.fl.yelpcdn.com/assets/srv0/yelp_design_web/9b34e39ccbeb/assets/img/stars/stars.png " alt="4.0 star rating" height="303" width="84">

星の評価4.0 star rating)の数値は、Webページで直接利用できないコードに含まれています。今、正規表現でデータを再フォーマットすることで、「4.0」を取得できます(HTMLの再フォーマットはパート3を見る)。

 

 

 

 

 

2) 外部 HTML  からデータを抽出する

外部HTMLは、開始タグと終了タグ、およびコンテンツを含む要素属性です。ですから、内部HTMLより、外部HTMLはより多くの情報を提供できます。内部HTMLに見つからない情報は外部HTMLに置くかもしれません。

外部HTMLを抽出する手順は、内部HTMLの手順と似ています。

  • 必要なデータをクリックします。
  • 「Action Tips」から「Extract outer HTML of the selected element」を選択します。

 

「星の評価」の外部HTMLは以下の通りです:

        <div style="background-color: rgb(229, 245, 233); outline: 1px solid rgb(0, 162, 59);" class="i-stars i-stars--large-4-rating-very-large" title="4.0 star rating">

        <img class="offscreen" src="https://s3-media2.fl.yelpcdn.com/assets/srv0/yelp_design_web/9b34e39ccbeb/assets/img/stars/stars.png

" alt="4.0 star rating" height="303" width="84"> </div>

 ご覧のとおり、内部HTML(青色で強調表示されている)は外部HTMLの一部です。対象データ(4.0)は、正規表現ツールを使って同様の方法で抽出できます(このステップにスキップする)。

ヒント!

1. Webページの完全なHTMLを抽出するにはそうすればいいですか?

完全なHTMLを抽出することで、Webページのすべての情報を取得ができます。

  • ページ内の任意要素を選択し、「Action Tips」の下にあるweb scraping with octoparse - scrape htmlをクリックします。
  • ドロップダウンリストで「HTML」を選択します。
  • 「Extract outer HTML of the selected element」を選択します。 今、完全なHTMLを取得しました!

web scraping with octoparse - scrape html 

 

2. なぜ「Action Tips」に「Extract inner HTML ...」または「Extract outer HTML..」がないのですか?

Action Tips」で提供するオプションは、選択したデータによって異なります。「Action Tips」の下部にある拡張アイコンをクリックして、選択範囲を拡大してみてください。

 

 

 

3) RegExツールでデータを再フォーマットする

データ再フォーマットツール は、抽出されたデータを処理するのに非常に役立ちます。Octoparseには8つデータ再フォーマットツールがあります。 このチュートリアルでは、2つのHTML関連の再フォーマットツールについて説明します。

データ再フォーマットツールを利用するには、

  • 再フォーマットするデータフィールドを選択します。
  • web scraping with octoparse - scrape htmlをクリックして、フィールドをカスタマイズします。
  • 「Refine extracted data」をクリックします。
  • 「Add step」をクリックします。

 

 

1. HTML transcoding

内部/外部HTMLを抽出したら、「HTML transcoding」を使ってHTMLタグをプレーンテキストに変換できます。例えば、"&gt"を ">"に変換し、 "&nbsp"をスペースに変換します。

  • 「HTML transcoding」を選択します。
  • 「Evaluate」をクリックして出力を確認します。
  • 「OK」をクリックして設定を保存します。

 

2. Match with Regular Expression

  • 「Match with Regular Expression」を選択します。
  • 「Try RegEx Tool」をクリックします。
  • マッチ基準を入力します:start with 「alt=" 」, end with 「star rating"」
  • 「generate」をクリックしてから「Match」をクリックすると、星の評価 (4.0)の数値が一致します。
  • 「Apply」をクリックします。
  • 「OK」をクリックして設定を保存します。

 

ヒント!

データ再フォーマットツールに興味がある場合は、このチュートリアルを参照してください 

 

 

関連記事:

データ再フォーマットツール  

ソースコード  -  Wikipedia 

HTML  -  W3schools

内部HTML

外部HTML

 

 

btn_sidebar_use.png