js抓取网页数据
作者:热点 来源:综合 浏览: 【大 中 小】 发布时间:2026-10-17 06:08:13 评论数:
浏览器里打开开发者工具,网页看到那些密密麻麻的数据JSON数据像流水一样从Network面板滚过去的时候,我就知道——又得写爬虫了。网页JS抓网页数据这事,数据说穿了就三步:找到数据藏在哪,网页想办法把它弄出来,数据再处理成你要的网页样子。但每一步都有坑,数据而且坑坑不一样。网页
最常见的数据场景是抓一个列表页。比如你想抓某个电商网站的网页商品价格,打开页面一看,数据HTML结构清清楚楚,网页每个商品都在一个div.item里,数据价格在span.price里。网页这时候你可能会想,直接document.querySelectorAll不就完了?对,但如果网站是React或者Vue写的,你看到的DOM是渲染后的结果,源码里根本没有这些节点。我第一次抓这种页面时,把整个HTML保存下来搜关键词,结果啥也没有——数据全是JS动态塞进去的。
那怎么办?两条路。一条是模拟浏览器行为,用Puppeteer这类无头浏览器。它真的打开一个Chrome实例,等页面加载完,JS执行完,你再从渲染后的DOM里取值。这办法最笨但最稳,适合那些交互复杂的页面——比如要点击“加载更多”按钮才能翻页的。我写过一次抓微博评论的脚本,页面滚到底部才会触发新请求,用Puppeteer的autoScroll函数模拟滚动,每次等500毫秒再抓,虽然慢点,但一条不漏。
另一条路更高效——直接抓接口。打开开发者工具的Network标签,刷新页面,你会看到浏览器发了一堆XHR请求。很多数据根本不在HTML里,而是通过AJAX从后端拿JSON。找到那个返回商品列表的接口,复制它的URL,用Node的fetch或者axios直接请求。但坑来了:接口通常带签名或者token,比如请求头里有个X-Signature,值是某个加密函数算出来的。这时候你得去Sources面板里找那个生成签名的JS文件,断点调试,把算法抠出来。有次我为了破解一个参数加密,硬是把人家压缩过的代码格式化,一行行读,最后发现就是个MD5加上时间戳再倒序——你说气不气人。
拿到数据之后,清洗也够头疼的。HTML里抓下来的字符串可能带各种标签、转义符,价格数字里混着人民币符号和逗号。我习惯用正则把非数字字符剔除,再转成浮点数。但正则写不好容易误伤——比如商品名称里本来就有“5,000积分”这种字样,你得先判断字段类型再决定处理方式。另外,有些数据是异步分批加载的,你抓的时候可能只拿到第一页,得循环请求直到接口返回空数组为止。
还有个容易忽略的点——反爬策略。你请求频率太高,服务器会返回403或者一个验证码页面。我吃过这个亏,有一次抓某招聘网站的职位列表,没设延迟,50个请求后IP直接被封了,只能换代理。后来学乖了,每次请求之间随机sleep 1到3秒,再伪装一下User-Agent,基本就稳了。但别去碰那些需要登录才能看的数据,除非你愿意处理cookie过期和验证码识别,那又是另一个深渊了。
最后提醒一句,别用JS去抓那些有明确robots.txt禁止的页面,也别把抓来的数据商用。技术本身没问题,但得知道边界在哪。
