别再手动测试了！用Playwright + Node.js 自动抓取网页短信接口（附完整代码）

高效自动化测试Playwright与Node.js实现短信验证码功能验证短信验证码功能已成为现代应用安全验证的标配但频繁的手动测试不仅耗时耗力还容易遗漏关键场景。作为开发者或测试工程师你是否厌倦了反复填写手机号、点击发送按钮的机械操作本文将介绍如何利用Playwright这一现代化测试工具结合Node.js构建自动化测试流程大幅提升验证效率。1. 为什么选择Playwright进行自动化测试Playwright是由微软开发的跨浏览器自动化测试库支持Chromium、WebKit和Firefox三大引擎。与传统的Selenium相比它具有以下显著优势多语言支持除了Node.js还支持Python、Java和.NET自动等待机制内置智能等待减少手动添加sleep的情况跨平台一致性在不同浏览器上提供一致的API体验强大的录制功能可通过Codegen工具录制操作生成测试脚本// 简单示例启动浏览器并打开页面 const { chromium } require(playwright); (async () { const browser await chromium.launch(); const page await browser.newPage(); await page.goto(https://example.com); await browser.close(); })();对于短信验证码功能的测试Playwright能够完美模拟真实用户操作流程导航到目标页面、填写手机号、点击发送按钮并验证是否收到短信。整个过程无需人工干预特别适合需要频繁验证或批量测试的场景。2. 环境准备与基础配置2.1 安装必要工具开始之前确保你的开发环境已准备好以下组件Node.js建议安装LTS版本16.x或更高npm或yarn随Node.js自动安装的包管理器Visual Studio Code推荐使用的代码编辑器内置终端和调试功能提示使用nvm(Node Version Manager)可以方便地管理多个Node.js版本特别适合需要同时维护多个项目的开发者。2.2 初始化项目并安装Playwright通过以下命令创建新项目并添加Playwright依赖mkdir sms-test-automation cd sms-test-automation npm init -y npm install playwrightPlaywright默认会下载所需的浏览器二进制文件如果遇到网络问题可以设置环境变量指定镜像源export PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright npx playwright install3. 构建短信验证码测试框架3.1 基本测试流程设计一个完整的短信验证码测试通常包含以下步骤导航到目标网页定位手机号输入框并填写测试号码定位发送按钮并点击验证是否成功触发短信发送清理测试数据如需要const { chromium } require(playwright); class SMSTester { constructor() { this.browser null; this.page null; } async init() { this.browser await chromium.launch({ headless: false }); this.page await this.browser.newPage(); } async testSMSSending(url, phoneNumber) { try { await this.page.goto(url); await this.page.fill(#phone, phoneNumber); await this.page.click(#send-sms-btn); // 验证是否显示发送成功提示 const successMsg await this.page.textContent(.sms-success); return successMsg.includes(验证码已发送); } catch (error) { console.error(测试失败:, error); return false; } } async close() { await this.browser.close(); } }3.2 处理常见验证机制现代网站为防止滥用通常会加入各种防护措施测试脚本需要相应处理验证码识别 对于图形验证码可以结合OCR服务或使用测试环境的万能验证码。// 处理图形验证码示例 async function handleCaptcha(page) { const captchaImage await page.$(#captcha-image); const captchaText await recognizeCaptcha(captchaImage); // 自定义OCR函数 await page.fill(#captcha-input, captchaText); }频率限制 模拟正常用户操作间隔避免触发频率限制。// 添加随机延迟模拟人工操作 async function humanLikeDelay(page, min 1000, max 3000) { const delay Math.floor(Math.random() * (max - min 1)) min; await page.waitForTimeout(delay); }4. 高级技巧与最佳实践4.1 并行测试与性能优化当需要测试多个网站或大量用例时合理利用并行能力可以显著提升效率。const { chromium } require(playwright); const websites [ { url: https://site1.com/login, phone: 13800138000 }, { url: https://site2.com/register, phone: 13900139000 } ]; (async () { const browser await chromium.launch(); const context await browser.newContext(); const results await Promise.all(websites.map(async (site) { const page await context.newPage(); await page.goto(site.url); await page.fill(#phone, site.phone); await page.click(#send-sms); // ...其他验证逻辑 return { url: site.url, status: success }; })); console.log(results); await browser.close(); })();4.2 测试报告与结果分析完善的测试报告能帮助快速定位问题可以考虑以下方案工具优点适用场景Playwright Test内置支持简单易用基础测试报告Allure丰富的可视化报告企业级测试Jest强大的断言和mock能力单元测试集成// 使用Playwright Test生成HTML报告 const { test, expect } require(playwright/test); test(短信发送测试, async ({ page }) { await page.goto(https://example.com); await page.fill(#phone, 13800138000); await page.click(#send-sms); await expect(page.locator(.sms-success)).toHaveText(验证码已发送); });4.3 异常处理与稳定性保障健壮的测试脚本需要妥善处理各种异常情况元素定位失败增加等待时间或使用更稳定的定位策略网络波动配置重试机制页面结构变化定期维护选择器async function safeClick(page, selector, maxAttempts 3) { for (let attempt 1; attempt maxAttempts; attempt) { try { await page.click(selector); return true; } catch (error) { if (attempt maxAttempts) throw error; await page.waitForTimeout(1000 * attempt); } } }在实际项目中我们通常会将这些最佳实践封装成公共工具方法供所有测试用例复用。经过多个项目的验证这种模式能显著提高测试代码的稳定性和可维护性。