ホーム テクノロジー 開発 非公開: Web スクレイピング API を使用して Web サイトをスクレイピングする方法

Web スクレイピング API を使用して Web サイトをスクレイピングする方法


Web スクレイピングは、World Wide Web から有用な情報を抽出するプロセスです。 Google 検索中、Web クローラー (ボット)、つまりクローラーは Web 上のほぼすべてのコンテンツを調べて、ユーザーに関連のあるものを選択します。

情報や知識は誰でもアクセスできるべきであるというこの考えが、World Wide Web の形成につながりました。ただし、求めているデータは公共使用が許可されている必要があります。

Webスクレイピングはどのように役立つのでしょうか?

私たちはデータの時代に生きています。 Web スクレイピングの助けを借りて、生データをより大きな目的に使用できる有用な情報に変換できます。製品のユーザーを分析および調査して製品を改善する、つまりフィードバック ループを作成するために使用できます。

電子商取引企業は、これを利用して競合他社の価格戦略を研究し、それに応じて独自の価格戦略を策定する可能性があります。 Web スクレイピングは天気予報やニュース報道にも使用できます。

課題

#1. IP制限

いくつかの Web サイトでは、IP アドレスまたは地理位置情報を検出することにより、一定の時間間隔でサイトのデータを取得するために実行できるリクエストの数を制限しています。これは、Web サイトに対する悪意のある攻撃を防ぐために行われます。

#2.キャプチャ

本物の人間と Web サイトにアクセスしようとしているボットを区別するのが、キャプチャの実際の機能です。 Web サイトは、Web サイト上のスパムを防止したり、Web サイト上のスクレイパーの数を制御したりするためにこれを使用します。

#3.クライアントサイドレンダリング

これは、Web スクレイパーにとって最大の障害の 1 つです。最近の Web サイトでは、単一ページのアプリケーションを作成できるフロントエンド フレームワークが使用されています。ほとんどの単一ページ アプリケーションには、サーバーでレンダリングされたコンテンツがありません。

代わりに、クライアント側の JavaScript を使用して、必要に応じてコンテンツを生成します。これにより、スクレイパーが Web ページのコンテンツを把握することが困難になります。コンテンツを取得するには、クライアント側の JavaScript をレンダリングする必要があります。

API

Web スクレイピング API はすべてを自動的に処理するため、Web スクレイピングの実行中に直面する課題のほとんどを解決します。 API を調べて、それを Web スクレイピングに使用する方法を見てみましょう。

の API には、シンプルな 3 ステップのプロセスがあります。

  • スクレイピングする URL を指定します
  • いくつかの構成オプションを提供する
  • データを取得する

Web ページをスクレイピングして、生の HTML データを文字列として返すか、リンク経由でアクセスできる HTML ファイルとして返すことができます。

APIの使用

このチュートリアルでは、JavaScript ランタイム環境であるNodeJSを使用して API を使用する方法を学びます。 NodeJS をシステムにインストールしていない場合は、先に進む前にインストールしてください。

  • 新しいフォルダー内に、 index.mjsという名前のファイルを作成します。 mjs拡張子の背後にある理由は、このファイルを Common JS ファイルではなく ES モジュールとして考慮するためです。 ESモジュールと共通JSファイルの違いを確認してください。
  • ターミナルの現在のフォルダーまたはディレクトリでコマンドnpm init -yを実行します。 package.jsonファイルが作成されます。
  • package.jsonファイル内で、 mainキーの値がデフォルトで他の値になっている場合は、 index.mjsに変更します。あるいは、キーtypeを追加し、その値をmoduleに等しく設定することもできます。
 {
  “type”: “module”
}
  • ターミナルでnpm i axiosコマンドを実行して、 axiosという名前の依存関係を追加します。この依存関係は、特定のエンドポイントにフェッチ リクエストを行うのに役立ちます。
  • package.jsonは次のようになります。
 {
  "name": "webscraping",
  "version": "1.0.0",
  "description": "",
  "main": "index.mjs",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Murtuzaali Surti",
  "license": "ISC",
  "dependencies": {
    "axios": "^1.1.3"
  }
}
  • このようにして、 index.mjsファイル内にaxiosをインポートします。ここでは ES モジュールであるためimportキーワードが使用されています。 commonJS ファイルの場合は、 requireキーワードになります。
 import axios from ‘axios’
  • API へのすべてのリクエストのベース URL は、すべてのエンドポイントで同じになります。したがって、定数内に格納できます。
 const baseUrl = 'https://api..com'
  • データをスクレイピングして取得する URL を指定します。
 let toScrapeURL = "https://developer.mozilla.org/en-US/"
  • 非同期関数を作成し、その中で axios を初期化します。
 async function getData() {
    const res = await axios({})
    return res
}
  • axios設定オプションでは、メソッドをpost 、URL とエンドポイント、値が によって提供される API キーとなるx-api-keyとして知られるヘッダー、そして最後に送信されるdataオブジェクトを指定する必要があります。 API に。 API キーは、dash..com にアクセスして取得できます。
 const res = await axios({
    method: "post",
    url: `${baseUrl}/webscraping`,
    headers: {
        "x-api-key": "your api key"
    },
    data: {
        url: toScrapeURL,
        output: 'file',
        device: 'desktop',
        renderJS: true
    }
})
  • ご覧のとおり、データ オブジェクトには次のプロパティがあります。
    • url : スクレイピングする必要がある Web ページの URL。
    • Output : データが文字列としてインラインで、または HTML ファイルで表示される形式。インライン文字列がデフォルト値です。
    • device : Web ページを開くデバイスのタイプ。 「デスクトップ」、「モバイル」、「タブレット」の 3 つの値を受け入れます。「デスクトップ」がデフォルト値です。
    • renderJS : JavaScript をレンダリングするかどうかを指定するブール値。このオプションは、クライアント側のレンダリングを扱う場合に便利です。
  • 構成オプションの完全なリストが必要な場合は、 API の公式ドキュメントをお読みください。
  • 非同期関数を呼び出してデータを取得します。 IIFE (即時呼び出し関数式) を使用できます。
 (async () => {
    const data = await getData()
    console.log(data.data)
})()
  • 応答は次のようになります。
 {
  timestamp: 1669358356779,
  apiStatus: 'success',
  apiCode: 200,
  meta: {
    url: 'https://murtuzaalisurti.github.io',
    device: 'desktop',
    output: 'file',
    blockAds: true,
    renderJS: true,
    test: { id: 'mvan3sa30ajz5i8lu553tcckchkmqzr6' }
  },
  data: 'https://api-assets..com/tests/web-scraping/pbn0v009vksiszv1cgz8o7tu.html'
}

HTMLの解析

HTML を解析するには、 node-html-parserという名前の npm パッケージを使用し、HTML からデータを抽出することもできます。たとえば、Web ページからタイトルを抽出したい場合は、次のように実行できます。

 import { parse } from ‘node-html-parser’
const html = parse(htmlData) // htmlData is the raw html string you get from the  API.

あるいは、Web サイトからのメタデータのみが必要な場合は、 のメタデータ APIエンドポイントを使用できます。 HTML を解析する必要さえありません。

API を使用する利点

シングル ページ アプリケーションでは、多くの場合、コンテンツはサーバーでレンダリングされず、代わりに JavaScript を使用してブラウザによってレンダリングされます。したがって、コンテンツのレンダリングに必要な JavaScript をレンダリングせずに元の URL をスクレイピングすると、コンテンツのないコンテナ要素だけが得られます。例を示しましょう。

これは、react と vitejs を使用して構築されたデモ Web サイトです。 renderJS オプションを false に設定して API を使用して、このサイトをスクレイピングします。何を手に入れましたか?

 <body>
    <div id="root"></div>
<body>

コンテンツのないルート コンテナだけが存在します。ここで、renderJS オプションが機能します。次に、renderJS オプションを true に設定して同じサイトをスクレイピングしてみます。何が得られますか?

 <body>
    <div id="root">
        <div class="App">
            <div>
                <a href="https://vitejs.dev" target="_blank">
                    <img src="/vite.svg" class="logo" alt="Vite logo">
                </a>
                <a href="https://reactjs.org" target="_blank">
                    <img src="/assets/react.35ef61ed.svg" class="logo react" alt="React logo">
                </a>
            </div>
            <h1>Vite + React</h1>
            <div class="card">
                <button>count is 0</button>
                <p>Edit <code>src/App.jsx</code> and save to test HMR</p>
            </div>
            <p class="read-the-docs">Click on the Vite and React logos to learn more</p>
        </div>
    </div>
</body>

API を使用するもう 1 つの利点は、循環プロキシを使用できるため、Web サイトによる IP ブロックが発生しないことを保証できることです。 API には、 プレミアム プランにプロキシ機能が含まれています。

最後の言葉

Web スクレイピング API を使用すると、技術的な手間をかけずに、スクレイピングされたデータのみに集中できます。それとは別に、 API は、壊れたリンクのチェック、メタ スクレイピング、Web サイトの負荷統計、スクリーンショットのキャプチャ、サイトのステータスなどの機能も提供します。これらすべてを単一の API で実行します。詳細については、 API の公式ドキュメントを確認してください。

「 Web スクレイピング API を使用して Web サイトをスクレイピングする方法」についてわかりやすく解説!絶対に観るべきベスト2動画

【PythonでWebスクレイピング】Beautiful Soupの使い方解説! 〜 初心者向け 〜 プログラミング入門