有JavaScript动态加载的内容如何抓取

本文涉及的产品
云数据库 Tair(兼容Redis),内存型 2GB
Redis 开源版,标准版 2GB
推荐场景:
搭建游戏排行榜
云数据库 RDS MySQL,集群系列 2核4GB
推荐场景:
搭建个人博客
简介: 有JavaScript动态加载的内容如何抓取

引言
JavaScript动态加载的内容常见于现代Web应用中,用于增强用户体验和减少初始页面加载时间。然而,这些动态加载的内容对于传统的网页抓取工具来说往往是不可见的,因为它们不包含在初始的HTML响应中。为了抓取这些内容,我们需要模拟浏览器的行为,执行JavaScript并获取最终渲染的页面。
方法一:使用无头浏览器
无头浏览器是一种在没有用户图形界面的情况下运行的Web浏览器。它允许我们模拟用户操作,如点击、滚动和等待JavaScript执行完成。

  1. 使用Puppeteer
    Puppeteer是一个Node.js库,它提供了一个高级API来控制无头Chrome或Chromium。以下是使用Puppeteer抓取动态内容的示例代码:
    ```const puppeteer = require('puppeteer');

(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.waitForSelector('selector-of-dynamic-content');
const content = await page.evaluate(() => {
return document.querySelector('selector-of-dynamic-content').innerText;
});
console.log(content);
await browser.close();
})();

2. 使用Selenium
Selenium是一个用于自动化Web浏览器测试的工具,它支持多种编程语言和浏览器。以下是使用Python和Selenium抓取动态内容的示例:
```from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

driver = webdriver.Chrome()
driver.get("https://example.com")
wait = WebDriverWait(driver, 10)
element = wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, "css-selector-of-dynamic-content")))
print(element.text)
driver.quit()

方法二:分析网络请求
许多动态内容是通过AJAX请求加载的。我们可以通过分析这些请求直接从服务器获取数据。

  1. 使用浏览器开发者工具
    使用浏览器的开发者工具(如Chrome DevTools)监控网络请求,找到加载动态内容的请求,并直接对其发起请求。
    示例步骤
  2. 打开Chrome DevTools(F12)。
  3. 切换到“Network”标签。
  4. 刷新页面并触发动态内容加载。
  5. 找到加载内容的请求,复制请求URL。
  6. 使用HTTP客户端直接请求
    一旦找到正确的请求URL,我们可以使用HTTP客户端直接请求这些数据。
    Python示例
    ```import requests

response = requests.get("direct-api-url-of-dynamic-content")
data = response.json()
print(data)

方法三:使用专门的抓取库
有些库专门设计用来处理JavaScript渲染的页面,如Python的requests-html
```from requests_html import HTMLSession

session = HTMLSession()
r = session.get('https://example.com')
r.html.render()
print(r.html.text)

结论
抓取JavaScript动态加载的内容需要使用更高级的工具和技术。无头浏览器、网络请求分析和专门的抓取库都是有效的解决方案。选择哪种方法取决于具体的需求和环境。在实施这些技术时,始终要遵守网站的使用条款和相关法律法规,确保抓取行为合法合规。

相关文章
|
11月前
|
数据采集 JavaScript 前端开发
Go和JavaScript结合使用:抓取网页中的图像链接
Go和JavaScript结合使用:抓取网页中的图像链接
|
2月前
|
数据采集 Web App开发 JavaScript
利用Selenium和XPath抓取JavaScript动态加载内容的实践案例
利用Selenium和XPath抓取JavaScript动态加载内容的实践案例
|
JSON JavaScript 前端开发
JS动态加载以及JavaScript void(0)的爬虫解决方案
Intro 对于使用JS动态加载, 或者将下一页地址隐藏为JavaScript void(0)的网站, 如何爬取我们要的信息呢? 本文以Chrome浏览器为工具, 36Kr为示例网站, 使用 Json Handle 作为辅助信息解析工具, 演示如何抓取此类网站.
6554 0
|
5月前
|
JavaScript 前端开发 Go
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
865 2
|
4天前
|
数据采集 JavaScript 前端开发
如何使用Python爬虫处理JavaScript动态加载的内容?
如何使用Python爬虫处理JavaScript动态加载的内容?
|
4月前
|
数据采集 存储 JavaScript
深入Node.js:实现网易云音乐数据自动化抓取
深入Node.js:实现网易云音乐数据自动化抓取
|
12月前
|
数据采集 JavaScript 前端开发
Javascript抓取京东、淘宝商品数据
随着互联网的发展,越来越多的商品信息被发布在各大电商平台上,如京东、淘宝等。这些平台上的商品信息对于消费者来说是非常重要的,可以帮助他们了解商品的价格、详情和评价等信息。而对于商家来说,了解竞争对手的商品信息也是至关重要的。因此,抓取京东、淘宝商品数据成为了一种常见的需求。本文将介绍如何使用JavaScript来抓取京东、淘宝的商品数据。
|
5月前
|
JavaScript 前端开发 iOS开发
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
48 0
|
数据采集 JavaScript API
Python爬虫抓取经过JS加密的API数据的实现步骤
Python爬虫抓取经过JS加密的API数据的实现步骤
|
JSON 前端开发 JavaScript
BootStrap框架下使用JS动态加载table并点击相关列弹出二级页面
在这里记录一下,也是在公司用到的一个例子,刚刚解决,正好趁热打铁。前端页面是采用BootStrap框架搭建的,主要的样式涉及到项目,在这里就不截图了,直接上代码:
105 1