Automazione di browser e scraping: Playwright, Browser Use e il trucco .har

Panoramica

L'essenziale del web non ha un'API pubblica, ma ogni sito e gia una superficie che un umano puo pilotare, il che vuol dire che un programma puo pilotarla anche. Playwright e lo strumento che fa cio: pilota un vero browser come farebbe un utente, cliccando, digitando e leggendo la pagina. Sopra siedono due trucchi che trasformano uno scraping fragile in automazione affidabile. Il trucco non-headless ti lascia connetterti una volta a mano e riutilizzare la sessione. Il trucco .har ti lascia saltare interamente la pagina renderizzata e chiamare l'API che il sito chiama lui stesso. Questa lezione insegna i tre, piu quando afferrare un browser pilotato da agente e come restare dal buon lato dell'etica e della legge.

Cosa imparerai

Imparerai le basi di Playwright, in cosa il browsing pilotato da agente (Browser Use e simili) differisce dall'automazione scriptata, il pattern browser visibile con login manuale che aggira la parte piu dura dei siti autenticati, e come registrare un file .har e lasciare un agente estrarne le chiamate di API sottostanti. Imparerai anche dove sono i limiti legali ed etici e quando cedere la scalabilita a un fornitore come Brightdata.

Prerequisiti

I Corsi da 1 a 3 e un progetto Node funzionante. Devi essere a tuo agio con il codice asincrono, con il funzionamento delle richieste HTTP e degli header, e con la lettura dei tuoi DevTools di browser. La pagina dei fondamenti su cos'e una API aiuta se richiesta e risposta sono ancora confuse, perche tutto il trucco .har consiste nel trovare l'API che una pagina nasconde.

Il problema

Hai bisogno di dati o di un'azione da un sito che non ti da un'API. L'approccio naif e scrapare l'HTML renderizzato con selettori fragili che si rompono appena il sito cambia un nome di classe. I casi piu duri sono i siti dietro un login, con rilevamento di bot, o che caricano tutto via JavaScript cosicche l'HTML e vuoto finche gli script non girano. Le persone bruciano giorni a lottare contro i selettori e i flussi di login, mentre il sito fa tutto il tempo delle pulite chiamate di API JSON, visibili nei DevTools, che potrebbero chiamare direttamente.

Le basi di Playwright

Playwright lancia e pilota Chromium, Firefox o WebKit. Gli dici di andare a un URL, di attendere degli elementi, di cliccare, di digitare e di leggere testo o attributi. Attende automaticamente che gli elementi siano pronti, il che toglie l'essenziale della flakiness che affliggeva gli strumenti piu vecchi. La stessa libreria alimenta i test end-to-end dei tuoi quality gate, quindi il muscolo e riutilizzabile. Ecco la forma di uno script di base che carica una pagina e ne estrae qualche dato.

import { chromium } from 'playwright'

const browser = await chromium.launch()
const page = await browser.newPage()

await page.goto('https://example.com/products')
// Attende automaticamente il selettore prima di leggere
await page.waitForSelector('.product-card')

const titles = await page.$$eval('.product-card h2', (nodes) =>
  nodes.map((n) => n.textContent?.trim()),
)

console.log(titles)
await browser.close()

Il trucco non-headless con login manuale

La parte piu dura dell'automazione di un sito autenticato e il login: password, codici a due fattori, captcha e rilevamento di bot lottano tutti contro di te, e mettere le credential in chiaro in uno script e al tempo stesso fragile e un rischio di sicurezza. Il trucco e saltare interamente l'automazione del login. Lancia il browser non-headless (visibile), naviga verso la pagina di login e metti lo script in pausa mentre ti connetti a mano. Una volta entrato, Playwright salva la sessione autenticata (cookie e storage) in un file, e ogni run futuro carica quel file ed e gia connesso. Nessuna password memorizzata, nessun captcha da risolvere, nessun flusso di login fragile.

import { chromium } from 'playwright'

// Una volta : connettersi a mano, poi salvare la sessione.
const browser = await chromium.launch({ headless: false }) // visibile
const context = await browser.newContext()
const page = await context.newPage()

await page.goto('https://app.example.com/login')
console.log('Log in manually in the window, then press Enter here...')
// Attendere che TU abbia finito il login prima di continuare
await page.waitForURL('**/dashboard', { timeout: 0 })

// Salvare la sessione autenticata per tutti i run futuri
await context.storageState({ path: 'auth.json' })
await browser.close()

// Ogni run successivo parte gia connesso :
// const context = await browser.newContext({ storageState: 'auth.json' })

Tieni auth.json fuori da Git (e un token di sessione vivo) e trattalo come un segreto. Le sessioni scadono, quindi e normale rigiocare occasionalmente il passo di login unico. Questo pattern e di gran lunga il piu grosso upgrade di affidabilita per l'automazione autenticata.

Il browsing pilotato da agente

Il Playwright scriptato e preciso ma fragile: cambia la pagina e i tuoi selettori si rompono. Gli strumenti di browser pilotati da agente come Browser Use prendono l'approccio inverso. Dai a un agente un obiettivo in linguaggio normale ("trova il volo meno caro da Zurigo a Londra venerdi prossimo e mettilo nel carrello") e lui legge la pagina, decide cosa cliccare e si adatta quando il layout differisce dall'atteso. E piu lento e meno deterministico, ma sopravvive ai cambiamenti di sito e gestisce compiti che non puoi specificare interamente in anticipo. Il trade-off onesto: prendi il Playwright scriptato per i job stabili, ad alto volume, ripetibili dove controlli l'obiettivo, e un browser pilotato da agente per i compiti occasionali o confusi dove l'adattabilita batte la velocita. Molti veri sistemi combinano i due - un agente per scoprire il flusso una volta, poi uno script generato per farlo girare a basso costo su larga scala.

Il trucco .har

E la mossa al piu alto rendimento di tutta la lezione. Prima di scrapare il minimo HTML renderizzato, apri i DevTools, vai alla scheda Network, effettua l'azione che vuoi automatizzare, poi clic destro e "Save all as HAR". Un file .har e una registrazione completa di ogni richiesta di rete che la pagina ha fatto, incluse le chiamate di API JSON dietro le quinte. La maggior parte dei siti moderni renderizza da pulite API interne, il che vuol dire che i dati che vuoi siedono spesso in una risposta JSON ben ordinata che puoi chiamare direttamente - nessun selettore, nessun browser headless, molto piu rapido e molto piu robusto. Il file e grosso e rumoroso, il che e esattamente dove un agente brilla: dagli il .har e chiedigli di estrarne gli endpoint pertinenti.

## Task
Here is a .har file I recorded while loading the product list page.

Extract the underlying API the page uses to fetch products. I want:
1. The exact request URL and method.
2. Which headers actually matter (auth token, content-type) vs noise.
3. Query params or request body, with what each field appears to mean.
4. The shape of the JSON response (the fields I care about: name, price, id).
5. A minimal fetch() call in TypeScript that reproduces just that request.

Ignore analytics, fonts, images and tracking pixels. Focus only on the
call that returns the product data.

Una volta che l'agente ti da la chiamata fetch, hai rimpiazzato uno scrape di browser fragile con una chiamata di API diretta, piu rapida, meno cara e molto piu stabile. Se l'API ha bisogno di un token di auth, lo tiri dalla sessione non-headless qui sopra. Questa combinazione - login manuale per il token, trucco .har per l'endpoint - gestisce un'enorme parte dei veri problemi "questo sito non ha API".

Etica, legalita e scalabilita

Automatizzare il web e potente e non senza conseguenze, quindi sii consapevole. Questa sezione e orientamento, non consulenza legale - quando denaro o dati personali sono in gioco, parla con un avvocato.

• Leggi le condizioni d'uso e robots.txt. Certi siti vietano l'accesso automatizzato, e ignorarlo puo rompere un contratto o, in certe giurisdizioni, violare una legge sull'abuso informatico.
• Non scrapare mai dati personali senza base legale. Le leggi di protezione dei dati del CLAUDE.md (GDPR, FADP, leggi di Stati statunitensi) si applicano ai dati scrapati come a tutti gli altri.
• Auto-limita il tuo ritmo e identificati onestamente. Martellare un sito e abusivo e ti mette sulla lista di blocco; uno scraper educato e lento e un cittadino migliore e piu affidabile.
• Per una scalabilita legittima, prendi un fornitore come Brightdata. Gestiscono la rotazione di proxy, la distribuzione geo e il tooling di conformita, il che e il modo responsabile di far girare grossi job, invece di costruire un esercito di bot clandestino.

Errori frequenti

I classici: scrapare HTML fragile quando una pulita API JSON sedeva tutto il tempo nel .har; mettere le credential in chiaro invece di usare il trucco di sessione non-headless; committare auth.json o un token in Git; far girare un browser pilotato da agente per un job stabile ad alto volume dove uno script economico basterebbe; e ignorare le condizioni d'uso e i rate limit fino a essere bloccato o peggio. Ispeziona la scheda Network prima di scrivere un solo selettore.

ROI business

L'automazione di browser sblocca dati e azioni che richiederebbero altrimenti un'integrazione che il fornitore non ha mai costruito. Il trucco .har da solo puo trasformare un progetto di scraping di piu giorni in un pomeriggio, perche salti la pagina renderizzata e chiami la vera API. Il trucco non-headless toglie la parte piu fragile di ogni automazione autenticata. Insieme, lasciano una piccola squadra automatizzare la ricerca concorrenziale, l'inserimento di dati interno attraverso sistemi legacy e i compiti ripetitivi di portali fornitori senza API - lavoro che resterebbe altrimenti manuale per sempre.

Checklist

Conferma di saper fare ognuno di questi punti prima di andare avanti, perche la prossima lezione suppone che tu sappia eseguire codice non fidato in sicurezza.

• Scrivere uno script Playwright di base che carica una pagina e legge dati.
• Usare il trucco non-headless per connetterti una volta e riutilizzare la sessione in headless.
• Spiegare quando prendere il browsing pilotato da agente invece di uno script fisso.
• Registrare un file .har ed estrarne una chiamata di API ripetibile con il tuo agente.
• Nominare due limiti legali o etici che rispetti sempre scrapando.

Risorse

Tieni nei preferiti la documentazione Playwright per la reference dei selettori e dell'auto-attesa e la documentazione Browser Use per il browsing pilotato da agente. La scheda Network dei tuoi DevTools di browser e di gran lunga lo strumento piu utile di questa lezione - impara a registrare e salvare correntemente un HAR li. Per i job grossi o sensibili alla conformita, Brightdata e fornitori simili sono la via documentata e supportata.

La tua missione

Scegli un sito che usi e che non ha API. Registra un .har dell'azione che ti interessa, dallo al tuo agente con il prompt qui sopra e vedi se puoi riprodurre l'azione con una chiamata fetch diretta. Se il sito ha bisogno di un login, salva prima una sessione con il trucco non-headless. Nota quale approccio (script, pilotato da agente o API diretta dal .har) consegneresti.

Prossima lezione

Eseguire sulla tua macchina codice che un agente ha generato - o che uno scrape ha riportato - e rischioso. La prossima lezione copre le sandbox: ambienti isolati e usa e getta di E2B, Daytona e strumenti simili che rinchiudono un run cattivo perche non possa toccare il tuo sistema.