使用 jQuery 进行网络抓取

使用 jQuery 进行网络抓取的完整教程

作者数据期刊

在这里，我将向你展示如何使用 jQuery 构建你的网络搜索器。无论你是在客户端还是在服务器端进行刮擦，我都会指导你完成步骤和关键概念。最后，你将掌握从网站上立即提取数据的技能！让我们深入学习！

什么是 jQuery？

jQuery 是最流行的 JavaScript 库之一，用于 DOM（文档对象模型）操作。它简化了诸如遍历和修改 DOM、处理事件和进行 AJAX 请求等任务。jQuery 用于为网站添加交互性，而且对网络刮擦非常有用，因为它允许您选择 HTML 元素并从中轻松提取内容。

您可以将 jQuery 用于客户端和服务器端网络搜刮。在客户端搜刮中，您的网络浏览器执行搜刮代码，而在服务器端搜刮中，搜刮过程在服务器上处理，通常使用 Node.js。我们将在本教程中探讨这两种方法。

什么是客户端搜索？

客户端搜索是指直接在用户浏览器中运行搜索代码。这种方法是使用 JavaScript 完成的，它允许浏览器访问网页的 HTML 内容并提取所需的数据。不过，客户端搜刮有一些局限性，主要是由于 CORS（跨源资源共享）等安全功能的限制。

例如，如果您尝试从另一个域（与您当前浏览的网站不同的网站）获取数据，您的浏览器会因 CORS 策略而阻止请求。这些限制使得客户端搜刮难以完成大规模的网络搜刮任务，但对于小型项目或可以搜刮同一域的情况，客户端搜刮仍然很有用。

如何使用 jQuery 抓取网页？

首先需要下载要抓取的网页的 HTML 内容。jQuery 提供了使用 $.get() 函数进行此类请求的简单方法。

下面是一个如何抓取网页的示例：

$.get("https://example.com", function(html) {
console.log(html)；
});

这段代码会向指定 URL 发送 HTTP GET 请求，并将网页的 HTML 内容记录到控制台。但是，如果在不允许跨源请求的网站上尝试此操作，就会遇到一个称为 CORS 错误的问题。

为什么不能在客户端抓取网站？

之所以会出现 CORS 问题，是因为现代浏览器实施了安全限制，以防止恶意网站窃取他人数据。当浏览器请求访问不同的网站时，会包含一个 "Origin "头信息，用于识别请求来自何处。接收请求的服务器会检查该标头，查看请求是否来自允许的域。如果不是，服务器将阻止该请求。

这一安全特性使得客户端刮擦变得非常困难。要绕过这一点，可以使用代理服务器或无头浏览器，但这些解决方案通常是服务器端刮擦的一部分。

使用 Bright Data 的网络解锁器绕过 CORS 限制

由于客户端刮擦受到 CORS 策略的限制，更好的方法是使用服务器端代理解决方案，如 Bright Data 的网络解锁程序.

为什么使用网络解锁程序？

✅ 绕过 CORS 限制 - 从任何网站获取数据，无需浏览器安全拦截。
✅ 处理反僵尸措施 - 自动管理标头、cookie 和验证码。
✅ 无需手动轮换代理--动态分配 IP 并根据需要进行轮换。
✅ 与 jQuery 和 Node.js 无缝协作--先在服务器端获取数据，然后再用 jQuery 进行处理。

如何在 Node.js 中使用 jQuery 的 Web 解锁器

要将 Web Unlocker 集成到服务器端刮板中，请按照以下步骤操作：

1️⃣注册 Bright Data 并获取 Web Unlocker 凭证。
2️⃣ 安装 Axios（Node.js 的常用 HTTP 客户端）：

npm install axios

3️⃣ 修改你的 scraper 以使用 Web Unlocker：

const axios = require("axios");

const 网络解锁代理 = "http://username:[email protected]:22225";

async function scrapeWithWebUnlocker(url) {
    try {
        const response = await axios.get(url, {
            代理IP - 突破网站地域 & IP 限制: {
                host: "brd.superproxy.io",
                port: 22225,
                授权: {
                    用户名: "您的用户名",
                    暗号: "您的密码"
                }
            }
        });

        console.log(回应。data); // 使用 jQuery 处理 HTML
    } catch error) {
        console.error("获取数据出错："，错误）；
    }
}

scrapeWithWebUnlocker("https://example.com");

如何操作

  • 请求通过 Bright Data 的 Web Unlocker 路由，绕过 CORS 和反僵尸保护。
  • 响应包含目标页面的 HTML，可在 Node.js 中使用 jQuery 进行处理。
  • 这种方法可确保可靠和可扩展的刮擦，而无需担心 IP 禁止或验证码问题。

使用 jQuery 和 Node.js 进行服务器端抓取

由于客户端搜刮受到 CORS 的限制，因此更稳健的方法是使用服务器端搜刮。这种方法是在服务器上运行刮擦程序，而服务器不会受到与浏览器相同的限制。Node.js 是一种 JavaScript 运行环境，非常适合服务器端搜刮。您可以在 Node.js 中使用 jQuery 来刮擦网页，而不必担心 CORS 错误。

如何在 Node.js 中使用 jQuery？

要在Node.js中使用jQuery，需要安装jQuery库和一个名为jsdom的工具。jsdom是在Node.js中运行的网络标准（如DOM）的JavaScript实现。它本质上是在服务器中模拟网络浏览器，让 jQuery 就像在真实的浏览器环境中工作一样。

首先，您需要设置 Node.js 环境。确保您的系统已安装 Node.js。然后，为您的项目创建一个新目录，并安装所需的依赖项。

mkdir 我的-web-scraper
cd 我的-web-scraper
npm init -y
npm install jquery jsdom

安装软件包后，您就可以开始在 Node.js 搜刮器中使用 jQuery 了。

示例：使用 Node.js 和 jQuery 抓取网页

下面是一个如何在 Node.js 中使用 jQuery 搜刮网页的基本示例：

const { JSDOM } = require("jsdom");
const { window } = new JSDOM("", { url: "https://example.com" });
const $ = require("jquery")(window);
$.get("https://example.com", function(html) {
console.log(html)；
});

这段代码用你要抓取的页面 URL 初始化了一个 jsdom 实例。之后，jQuery 就可以像在浏览器中一样与 HTML 文档交互了。

搜索特定数据

获得页面的 HTML 内容后，下一步就是提取所需的数据。这正是 jQuery 的优势所在。您可以使用 jQuery 的 .find() 方法选择特定元素，然后使用 .text() 或 .attr() 方法提取其内容。

比方说，您想从一个电子商务网站上抓取产品名称、价格和 URL。 具体方法如下

$.get("https://example.com/products", function(html) {
const productElements = $(html).find("li.product");
const 产品 = []；
productElements.each((i，产品元素) => {
const 产品 = {
name:$（产品元素）。find("h2").text(),
price:$（产品元素）。find(".价格").text(),
url:$（产品元素）。find("a").attr("href")
};
产品push(产品）；
});
console.log(产品）；
});

在这个例子中

  • 我们使用 $.get() 获取产品页面的 HTML 代码。
  • .find() 方法会搜索所有具有 product 类的 li 元素。
  • 我们循环浏览每个产品元素，并使用 jQuery 的 .text() 和 .attr() 方法提取产品名称、价格和 URL。

这将打印一个包含刮擦数据的产品对象数组。

存储抓取的数据

提取出所需数据后，下一步就是存储数据。您可以将数据保存到本地文件、数据库或任何其他存储介质中。为简单起见，我们将数据存储在一个 JSON 文件中。

为此，您可以使用 Node.js 内置的 fs（文件系统）模块将数据写入文件。

const fs = require("fs");
fs.writeFileSync("products.json", JSON.串化(产品）、 null, 2));

这段代码将把搜刮到的产品数据保存到当前目录下名为 products.json 的文件中。

高级搜索技术

分页

许多网站都有分页内容，这意味着并非所有数据都显示在一个页面上。要从分页的网站中抓取所有数据，需要浏览多个页面。

在这种情况下，您可以修改您的搜索器，使其跟随 "下一页 "链接或为每个页面构建 URL。下面是一个例子，说明你可以如何抓取多个页面：

function scrapePage(pageUrl) {
$.get（pageUrl、 function(html) {
const productElements = $(html).find("li.product");
const 产品 = []；
productElements.each((i，产品元素) => {
const 产品 = {
name:$（产品元素）。find("h2").text(),
price:$（产品元素）。find(".价格").text(),
url:$（产品元素）。find("a").attr("href")
};
产品push(产品）；
});
console.log(产品）；
const nextPage = $(html).find(".下一页").attr("href");
if (nextPage) {
scrapePage(下一页）； // 递归刮取下一页
}
});
}
scrapePage("https://example.com/products?page=1");

此递归函数将刮取当前页面，然后检查下一页的链接。如果找到 "下一页 "链接，它将再次调用 scrapePage() 并输入下一页的 URL。

使用正则表达式

有时，您可能需要从网页中提取特定的数据模式。例如，如果产品价格以一致的格式列出，则可以使用正则表达式 (regex) 匹配并提取价格。

下面是一个如何在 jQuery 中使用 regex 的示例：

$.get("https://example.com/products", function(html) {
const 价格 = new 设置();
$(html).find("span.price").each((i，价格元素) => {
const priceText = $(priceElement).text();
if (/^$d .d{2}$/.测试(priceText)) {
价格add(priceText)；
}
});
console.log(Array.from(价格））；
});

该代码使用正则表达式 (/^$d .d{2}$/) 来匹配表示价格的字符串，如 "$69.00"。它将匹配的价格存储在一个集合中，以确保唯一性。

结论

在本教程中，我向大家展示了如何使用 jQuery 从网站上抓取数据。我们研究了客户端和服务器端两种刮擦方法。客户端搜刮因 CORS 等安全措施而受到限制，而使用 Node.js 中的 jQuery 进行服务器端搜刮则可以避开这些限制，从任何网站搜刮数据。我还介绍了如何使用 jQuery 的 DOM 遍历方法来提取特定信息。

我们介绍了如何处理分页、使用正则表达式和存储数据。现在，你已经掌握了构建有效的网络刮擦工具并从网络上收集有用数据的工具。我希望你能充满信心，兴奋地开始刮擦！

# 网络数据与分析专家

通过先进的抓取技术、道德数据收集和代理基础架构探索网络数据的秘密。凭借在数据工程和网络自动化方面多年的实践经验，我将深入探讨：

- 网络抓取架构与最佳实践
- 数据收集策略和方法
- 代理解决方案和基础设施设计
- 应用程序接口集成与开发
- 实时数据分析与洞察

我的使命是帮助企业和开发人员驾驭复杂的在线数据收集环境，将原始数据转化为可操作的增长战略和有意义的见解。

在领先的技术出版物上大放异彩，因其数据收集专业知识和诚实实用的建议而深受行业专业人士的信赖。

类似文章