あるものを実施する過程で、ある場所の情報を引っ張って利用する必要がある場合がある.
この動作をスクラッチ、スクロールと呼ぶ.
1回のみインポート
繰り返しインポートをスクロールと呼びます.
もちろん、作業を完了するためのライブラリがあります.
スクラッチはcherio
スクロールはPuppetterに存在します.
これは何ですか.こんな感じもありましたが、私たちはついついこれを利用してしまいました.
チャット機能を含むアプリケーション(KakaoTalk,Disco)に直接サイトにリンクすると、プレビューが表示されます.
このプレビューは、HTMLドキュメントのHEADタグのmeteタグのogの内容をスクリプトとしてインポートします.
Facebookからですが、お客様(ユーザー)への満足感が良いので、すべてのサイトで利用しています.
現在、リンクを受け取ってプレビューがないと不安になり、特定のプログラムで検証できないというサイトをフィルタリングするところもあります.


上のタスクはフロントで完了していますが、バックエンドのタスクはどのように利用されていますか?
サイトのホームページでは、フロントで作業できます.
ホームページ以外のコンテンツがいつでも変更されるページは機能しません.
apiで自動化する必要があります.

このように、ある商品がリンクに入るときに、一部の内容だけで構成する必要がある場合は、스크래핑を使用します.
写真やリンクなどの情報は、データの一部としてクライアント(ユーザ)に送信できます.

では、スクロールとは何でしょうか。

スクロールが周期的なスクラッチだと考えると、少し楽になります.주기적は、特定のサイトの情報を그 사이트의 서버에 과부화를 줄 수 있기에 주의해야한다.にインポートする.
これらの理由により、スクロールが拒否され、アドレスウィンドウに/robotsがあります.txtなら.
この住所には「やらないで、できる」と書かれた書類があります.

どうすればいいのでしょうか?

小さなプロジェクトはもうすぐ完成するので、小さなプロジェクトのコードを持ってきてコメントで行いたいと思います.

Cheerioを使用したスクリプトの作成

import axios from "axios";
import Cheerio from "cheerio";
export async function ogGet(user) {
  user.includes("http") ? user : (user = "https://" + user);
  let obj = {};
  const page = await axios.get(user);
  const $ = Cheerio.load(page.data);
  $("meta").each((_, el) => {
    if ($(el).attr("property")) {
      const key = $(el).attr("property").split(":")[1];
      const value = String($(el).attr("content"));
      obj[key] = value;
    }
  });
  return obj;
}

これは私がogタグに入れた内容のために書いた内容です.
axiosインポートポート

スクリプト作成のために通信が必要

cherioを使用して

をインポート

userにアドレスが含まれている場合はパラメータを受信します.

2https://がないと運転できないので、異常処理部

は、

新しい空のオブジェクトを宣言

axiosを使用してHTML文書

全体をインポート

Cherrio.データ

は、ロードするHTML文書からのみ抽出される.

から抽出するデータのうち、metaと表記された値はeach(重複)に戻り、

に戻る.

elの属性に属性がある場合、

は、その値をsplit(":")に分割し、1番のインデックス(og:titleの場合、titleのみ)をキー値に

格納する.

el属性の内容を値に記憶する<重要>

.
各値

は、objオブジェクト中の

にキーおよびbellクラスとして格納.

返却

ここでは大した困難はない.しかし、最大の問題は주소です.
コードを作成して変換するだけではurlは読み込めません.文字列の形式でエラーが繰り返し発生します.
そのエラーをつかむのに本当に時間がかかったので、その値に強制変換と宣言すればいいのですが…^^
とにかく、上と同じ方法で.

pupperterを使用してスクロール

import puppeteer from "puppeteer";
async function startCrawling() {
  const browser = await puppeteer.launch({ headless: true }); // 브라우저가 보이게 한다
  const page = await browser.newPage(); // 새로운 브라우저 켜기
  await page.goto(""); // 페이지 이동
  await page.waitForTimeout(1000);
  for (let i = 1; i <= 10; i++) {
    // 반복문 돌면서 값 여러개 가져오기
    await page.waitForTimeout(500);
    const img = await page.$eval(,(el) => el.src);
    const name = await page.$eval(,(el) => el.textContent);
  }
}

のストローで転がすので

に導入します
これは

ブラウザを表示するオプションです.見る必要がないので、オフにしました.見たいならheadless:false,

と書いてもいいです

カーペットは直接ウェブサイトに導入する形式で、//クロムを宣言しなければなりません...なんだ.

goto()アクセスサイト

の遅延はなく、近づき続けるとサーバに大きな負荷がかかるため、時間条件

が加わる.

を取りたい価格は10個なので、繰り返し文で10回回します.

が繰り返されるが、再び

が遅延する.
コード

入力srcソースコード

は、その値が画像であるため

コード

は、入力したい値がテキストであるためです.
このように構成されている.
独自の方法がたくさんあり、jsメソッドを利用できる関数もあります.
思い切って使うなら….複雑なようです.