[{"data":1,"prerenderedAt":422},["ShallowReactive",2],{"blog-it-google-api-key-exposed-in-frontend":3},{"id":4,"title":5,"body":6,"category":380,"cover":381,"coverAlt":381,"description":382,"draft":383,"extension":384,"faq":385,"image":401,"keywords":402,"meta":409,"navigation":410,"ogTitle":411,"path":412,"published":413,"seo":414,"stem":415,"tldr":416,"updated":413,"__hash__":421},"blog_it\u002Fblog\u002Fgoogle-api-key-exposed-in-frontend.md","Una chiave API Google nel frontend è un problema?",{"type":7,"value":8,"toc":368},"minimark",[9,18,26,35,40,43,46,49,52,56,59,66,69,75,79,89,141,148,151,158,162,260,263,268,272,275,282,292,296,299,305,308,311,321,325,356],[10,11,12,13,17],"p",{},"Apri la tua app nel browser, guarda il codice sorgente della pagina e cerca\n",[14,15,16],"code",{},"AIza",". Se compare una stringa di quaranta caratteri, probabilmente qualcuno ti\nha già detto che è «esposta», e probabilmente non ti ha detto cosa fare dopo.",[10,19,20,21,25],{},"Ecco il punto che quasi tutti i consigli su questo tema sbagliano: ",[22,23,24],"strong",{},"una chiave\nAPI Google nel tuo frontend non è lo stesso tipo di problema di una chiave\nsegreta Stripe nel tuo frontend, e la soluzione non è nasconderla."," Trattarle\nallo stesso modo porta o a spaventarsi per la propria mappa o, peggio, a imparare\na scrollare le spalle davanti alla parola «esposta» poco prima del giorno in cui\nconta davvero.",[10,27,28,29,34],{},"Tra il 12 e il 14 agosto 2026 abbiamo eseguito gli stessi nove controlli esterni\nsu 30.998 app online costruite con Lovable, Bolt, v0, Replit e Base44. In 1.142\ndi esse è comparsa una chiave API Google. In tre è comparsa una chiave segreta\nStripe. I numeri completi sono nel\n",[30,31,33],"a",{"href":32},"\u002Fresearch\u002Fvibe-coded-app-security-2026","nostro rapporto di scansione",".",[36,37,39],"h2",{"id":38},"è-grave-che-la-mia-chiave-api-google-sia-esposta-nel-frontend","È grave che la mia chiave API Google sia esposta nel frontend?",[10,41,42],{},"Di solito no. Dipende interamente dal fatto che la chiave sia limitata.",[10,44,45],{},"Una chiave API Google non è una password. Assomiglia piuttosto a un numero di\nconto: dice a Google quale progetto fatturare e da quale quota attingere. Da\nsola non dice nulla su chi sta facendo la richiesta.",[10,47,48],{},"Ecco perché può stare nella tua pagina. La mappa viene disegnata dal browser del\ntuo visitatore, quindi è il browser a dover inviare quel numero di conto a\nGoogle. Non esiste una versione di tutto questo in cui la mappa si carica e il\nnumero resta nascosto.",[10,50,51],{},"La protezione arriva da una seconda impostazione, custodita dalla parte di\nGoogle, che dice da quali siti il numero può essere usato. Google la chiama\nrestrizione per referrer HTTP. Una volta impostata, la chiave stampata nella tua\npagina funziona sul tuo sito e restituisce un errore ovunque altro.",[36,53,55],{"id":54},"perché-la-tua-app-spedisce-la-chiave","Perché la tua app spedisce la chiave",[10,57,58],{},"Perché la richiesta parte dal browser del tuo visitatore e non dal tuo server.",[10,60,61,62,65],{},"Quando qualcuno carica una pagina con una mappa, quel browser parla direttamente\ncon ",[14,63,64],{},"maps.googleapis.com",". Deve dire a quale progetto Google appartiene la\nrichiesta, e quell'identificativo deve stare nella pagina, perché la pagina è il\npunto da cui parte la richiesta.",[10,67,68],{},"Google lo sa. È per questo che la restrizione esiste come controllo separato:\nl'identificativo sarebbe comunque diventato pubblico, quindi ciò che decide chi\npuò usarlo vive in un posto che il pubblico non raggiunge.",[70,71],"diagram",{"alt":72,"caption":73,"src":74},"Due righe. Nella riga in alto una restrizione si frappone tra le richieste e Google: una richiesta da yourapp.com la supera e raggiunge maps.googleapis.com, mentre la stessa chiave inviata da other.example viene fermata alla restrizione e segnata con una croce. Nella riga in basso la restrizione è disegnata come una linea interrotta ed entrambe le richieste passano, quella dell'estraneo tratteggiata in ambra.","La chiave è identica in entrambe le righe. L'unica differenza è se su di essa è impostata una restrizione.","\u002Fblog\u002Fgoogle-api-key-exposed-in-frontend\u002Frestricted-or-not-1600x820.png",[36,76,78],{"id":77},"come-limitare-una-chiave-api-google","Come limitare una chiave API Google",[10,80,81,82,88],{},"È gratis, richiede circa cinque minuti e non devi toccare il codice della tua\napp. Nella ",[30,83,87],{"href":84,"rel":85},"https:\u002F\u002Fconsole.cloud.google.com\u002F",[86],"nofollow","console di Google Cloud",":",[90,91,92,100,110,129,138],"ol",{},[93,94,95,96,99],"li",{},"Vai su ",[22,97,98],{},"API e servizi → Credenziali"," e clicca sulla chiave che hai trovato.",[93,101,102,103,106,107,34],{},"In ",[22,104,105],{},"Restrizioni applicazione",", scegli ",[22,108,109],{},"Siti web",[93,111,112,113,116,117,120,121,124,125,128],{},"Aggiungi il tuo dominio. Per un sito su ",[14,114,115],{},"yourapp.com",", aggiungi\n",[14,118,119],{},"https:\u002F\u002Fyourapp.com\u002F*",". Aggiungi anche il tuo dominio di anteprima o di\nstaging, se ne hai uno, e ricordati dell'indirizzo ",[14,122,123],{},".lovable.app"," o\n",[14,126,127],{},".vercel.app"," su cui la tua app era pubblicata prima che le collegassi un\ndominio personalizzato.",[93,130,102,131,106,134,137],{},[22,132,133],{},"Restrizioni API",[22,135,136],{},"Limita chiave"," e spunta solo le API che la\ntua app chiama davvero. Una mappa con ricerca di luoghi ha bisogno della Maps\nJavaScript API e della Places API, e di nient'altro.",[93,139,140],{},"Salva, aspetta qualche minuto, poi carica il tuo sito e controlla che la mappa\nvenga ancora disegnata.",[10,142,143,144,147],{},"Se il passo 3 è sbagliato, te ne accorgi subito e in modo visibile: la mappa\nfallisce con ",[14,145,146],{},"RefererNotAllowedMapError"," nella console del browser, che nomina\nesattamente il problema. Aggiungi il dominio mancante e torna a funzionare. È una\nmodifica reversibile, ed è per questo che vale la pena farla prima di aver finito\ndi leggere questo articolo.",[10,149,150],{},"Una cosa da non fare: le indicazioni di risoluzione dei problemi di Google dicono\nche le restrizioni per indirizzo IP sono pensate per chiavi lato server e non\nsono adatte a una chiave usata da un browser. Se limiti per IP una chiave del\nfrontend, la tua app si rompe per ogni visitatore.",[10,152,153,154,34],{},"Se preferisci vedere quali chiavi la tua app sta effettivamente spedendo prima di\npassarle una per una, la nostra scansione gratuita legge il tuo sito dal vivo\ndall'esterno e ti dice cosa trova. Dura circa 20 secondi e non richiede un\naccount: ",[30,155,157],{"href":156},"\u002F#scan","scansiona la tua app",[36,159,161],{"id":160},"quali-credenziali-google-stanno-in-un-browser","Quali credenziali Google stanno in un browser",[163,164,165,184],"table",{},[166,167,168],"thead",{},[169,170,171,175,178,181],"tr",{},[172,173,174],"th",{},"Credenziale",[172,176,177],{},"Che aspetto ha",[172,179,180],{},"Nel tuo frontend?",[172,182,183],{},"Cosa la protegge davvero",[185,186,187,208,224,242],"tbody",{},[169,188,189,193,198,205],{},[190,191,192],"td",{},"Chiave browser di Maps o Places",[190,194,195],{},[14,196,197],{},"AIza…",[190,199,200],{},[201,202,204],"key-verdict",{"type":203},"safe","Sta qui",[190,206,207],{},"La restrizione per referrer, più un tetto di quota",[169,209,210,213,217,221],{},[190,211,212],{},"Chiave di configurazione web di Firebase",[190,214,215],{},[14,216,197],{},[190,218,219],{},[201,220,204],{"type":203},[190,222,223],{},"Le regole di sicurezza di Firebase e App Check",[169,225,226,229,233,239],{},[190,227,228],{},"Una chiave che usi dal tuo server",[190,230,231],{},[14,232,197],{},[190,234,235],{},[201,236,238],{"type":237},"danger","Mai",[190,240,241],{},"Niente, una volta pubblica. Tienila lato server",[169,243,244,247,253,257],{},[190,245,246],{},"Account di servizio",[190,248,249,250],{},"un file JSON che contiene ",[14,251,252],{},"\"private_key\"",[190,254,255],{},[201,256,238],{"type":237},[190,258,259],{},"Niente. Questa è una credenziale vera",[10,261,262],{},"Le prime tre righe sono la stessa stringa. Una chiave API Google non porta\nscritto davanti a cosa serve, quindi la domanda non è mai «che aspetto ha questa\nchiave» ma «cosa può fare questa chiave», e quella risposta vive nella console e\nnon nel tuo codice.",[70,264],{"alt":265,"caption":266,"src":267},"Una sola chiave AIza in alto si dirama in tre copie identiche. La prima è spuntata ed etichettata yourapp.com, la seconda è spuntata ed etichettata firebaseConfig, e la terza è barrata ed etichettata con un asterisco che sta per qualsiasi sito. Separato sotto da una linea tratteggiata, un quarto elemento con la scritta type service_account è barrato.","Tre di queste sono gli stessi quaranta caratteri. A separarle è una impostazione che dal codice della pagina non si vede.","\u002Fblog\u002Fgoogle-api-key-exposed-in-frontend\u002Fone-shape-three-jobs-1600x720.png",[36,269,271],{"id":270},"la-chiave-di-firebase-è-fatta-per-essere-pubblica","La chiave di Firebase è fatta per essere pubblica",[10,273,274],{},"Questa è la riga su cui ci fanno più domande, e la documentazione di Firebase\nrisponde con chiarezza: le chiavi API dei servizi Firebase possono stare nel\ncodice o nei file di configurazione, perché non controllano l'accesso a nulla. A\ndeciderlo sono le regole di sicurezza di Firebase e App Check.",[10,276,277,278,34],{},"Se ti suona familiare, è lo stesso assetto che usa Supabase. La chiave\npubblicabile identifica il progetto, e le regole dietro di essa decidono riga per\nriga chi può leggere cosa. In entrambi i casi la chiave è sicura solo grazie a\nquelle regole, quindi sono le regole la cosa da andare a guardare:\n",[30,279,281],{"href":280},"\u002Fblog\u002Fsupabase-rls-on-but-table-still-public","attivarle non equivale a essere protetti",[283,284,286],"callout",{"type":285},"warn",[10,287,288,291],{},[22,289,290],{},"L'unica trappola di Firebase, ed è recente."," La documentazione di Firebase è\nesplicita: non aggiungere la Gemini Developer API, elencata come Generative\nLanguage API, all'elenco delle API consentite della tua chiave web Firebase.\nQuella chiave è pubblicata di proposito, e ogni chiamata al modello fatta con\nessa viene fatturata al tuo progetto. È un errore facile in una app nata come app\nFirebase e cresciuta poi con una funzione di IA, e ormai sono moltissime.",[36,293,295],{"id":294},"cosa-succede-davvero-quando-trapela-una-chiave-senza-restrizioni","Cosa succede davvero quando trapela una chiave senza restrizioni",[10,297,298],{},"Una bolletta, un disservizio o entrambi. Non una violazione di dati.",[10,300,301,302,304],{},"Scraper automatici percorrono le pagine pubbliche raccogliendo stringhe ",[14,303,16],{},", e\nuna chiave senza restrizioni funziona da qualsiasi posto, quindi la tua finisce\nper servire tasselli di mappa e ricerche di luoghi per il progetto di qualcun\naltro. Google lo dice direttamente nella sua documentazione introduttiva: il\nmotivo per impostare restrizioni è impedire il furto di quota.",[10,306,307],{},"Di solito te ne accorgi in uno di due modi. La fattura è più alta del mese scorso\nsenza un motivo che sai indicare, oppure le mappe della tua app smettono di\ndisegnarsi a metà mese perché il progetto ha esaurito la quota e ogni visitatore\nora vede un rettangolo grigio.",[10,309,310],{},"Entrambe si risolvono. Nessuna delle due espone i dati dei tuoi utenti, perché\nuna chiave di Maps non può leggere il tuo database. È questa la differenza onesta\ntra questo riscontro e una chiave di database trapelata, ed è il motivo per cui\nil nostro scanner segnala una chiave API Google come qualcosa da controllare e\nnon come un'emergenza.",[10,312,313,314,317,318,320],{},"L'unica credenziale Google che si comporta davvero come un'emergenza è un account\ndi servizio. Se la tua app sta spedendo un file JSON con\n",[14,315,316],{},"\"type\": \"service_account\""," e dentro un blocco ",[14,319,252],{},", quelle sono\ncredenziali vere con permessi veri sul tuo progetto cloud. Elimina la chiave\nnella console, poi guarda a cosa poteva arrivare.",[36,322,324],{"id":323},"cosa-fare-adesso","Cosa fare adesso",[326,327,328],"key-takeaways",{},[329,330,331,337,343,346,349],"ul",{},[93,332,333,334,336],{},"Cerca ",[14,335,16],{}," nel codice sorgente del tuo sito dal vivo. Ogni occorrenza è una chiave di cui rispondere.",[93,338,339,340,342],{},"Limita ognuna nella console di Google Cloud: ",[22,341,109],{}," nelle restrizioni applicazione, il tuo dominio, e solo le API che usi. Gratis, circa cinque minuti, nessuna modifica al codice.",[93,344,345],{},"Già che ci sei metti anche un tetto di quota giornaliera sulla chiave. La restrizione riduce il traffico; un tetto limita quanto tutto questo può costare.",[93,347,348],{},"Lascia la tua chiave di configurazione Firebase dov'è. Controlla invece che le tue regole di sicurezza stiano facendo il loro lavoro, e tieni la Gemini API fuori dall'elenco consentito di quella chiave.",[93,350,351,352,355],{},"Se trovi un file JSON ",[14,353,354],{},"service_account"," nel tuo frontend, trattalo come urgente. Elimina la chiave nella console invece di togliere solo il file, perché la tua cronologia delle versioni contiene ancora il vecchio valore.",[10,357,358,359,363,364,34],{},"Se preferisci affrontarlo come una lista, la\n",[30,360,362],{"href":361},"\u002Fchecklist","checklist di sicurezza in 10 minuti"," copre questo insieme alle altre\ncose da disattivare in una app appena lanciata. E per la domanda più ampia su\nquali chiavi stiano in un browser, abbiamo\n",[30,365,367],{"href":366},"\u002Fblog\u002Fwhich-api-keys-are-safe-in-your-frontend","una guida per distinguere le chiavi pubblicabili da quelle segrete",{"title":369,"searchDepth":370,"depth":370,"links":371},"",3,[372,374,375,376,377,378,379],{"id":38,"depth":373,"text":39},2,{"id":54,"depth":373,"text":55},{"id":77,"depth":373,"text":78},{"id":160,"depth":373,"text":161},{"id":270,"depth":373,"text":271},{"id":294,"depth":373,"text":295},{"id":323,"depth":373,"text":324},"Basi della sicurezza",null,"Una chiave API Google esposta nel frontend è la chiave che il nostro scanner trova più spesso, e di solito va bene così. Lo decide una impostazione gratuita.",false,"md",[386,389,392,395,398],{"q":387,"a":388},"Qualcuno ha trovato la mia chiave di Google Maps nel codice della pagina. Devo rigenerarla?","Prima limitala: richiede circa cinque minuti e non rompe nulla. Apri la chiave nella console di Google Cloud, imposta le restrizioni applicazione su Siti web e aggiungi il tuo dominio, poi limita le restrizioni API alle sole API che la tua app usa. Rigenerarla viene dopo, e solo se la chiave è rimasta senza restrizioni per un po' e vedi un consumo che non hai causato tu.",{"q":390,"a":391},"Non posso semplicemente nascondere la chiave?","No. Il browser del tuo visitatore deve inviare la chiave a Google per caricare la mappa, quindi tutto ciò che il browser può usare, un visitatore può leggerlo. Minificare o rinominare rallenta qualcuno solo per pochi secondi. Limitare la chiave è la soluzione che funziona davvero, e funziona indipendentemente dal fatto che qualcuno trovi la chiave.",{"q":393,"a":394},"La mia chiave è limitata al mio dominio. Qualcuno può usarla lo stesso?","Un header referrer si può falsificare, quindi una persona determinata può inviare richieste che dichiarano di venire dal tuo sito. Quello che la restrizione elimina è il caso facile: uno scraper automatico che raccoglie chiavi su pagine pubbliche e le usa direttamente dal proprio server. È quel traffico a produrre bollette a sorpresa, quindi la restrizione vale la pena anche se non è un muro. Metti anche un tetto di quota giornaliera sulla chiave e avrai un limite a quanto tutto questo può costarti.",{"q":396,"a":397},"Firebase ha messo una chiave API nel mio file di configurazione. È un errore?","No, e Firebase lo documenta. Una chiave API web di Firebase identifica il tuo progetto invece di autorizzare l'accesso, e dell'accesso decidono le regole di sicurezza di Firebase e App Check. È fatta per stare nel tuo codice. L'unica cosa da evitare è aggiungere la Gemini Developer API all'elenco delle API consentite di quella chiave, perché così una chiave pubblicata di proposito diventa una chiave che può spendere denaro.",{"q":399,"a":400},"E se trovo un file con \"type\": \"service_account\" nella mia app?","Quella è una situazione diversa ed è urgente. Una chiave di account di servizio è una credenziale vera con dentro una chiave privata, e il suo posto è un server. Elimina la chiave nella console di Google Cloud sotto IAM e amministrazione, poi Account di servizio, togli il file dal tuo frontend e controlla la fatturazione e i log di audit. Eliminarla solo dal codice non chiude la porta, perché il vecchio valore resta nella cronologia delle versioni.","\u002Fblog\u002Fgoogle-api-key-exposed-in-frontend\u002Fcard-800x500.png",[403,404,405,406,407,408],"chiave api google nel frontend","limitare chiave api google maps","restrizione referrer http","chiave api firebase pubblica","chiave api AIza","la mia chiave api google è sicura",{},true,"Una chiave API Google nel tuo frontend?","\u002Fblog\u002Fgoogle-api-key-exposed-in-frontend","2026-08-22",{"title":5,"description":382},"blog\u002Fgoogle-api-key-exposed-in-frontend",[417,418,419,420],"Una chiave API Google esposta nel tuo frontend di solito non è un problema, perché una chiave Google è un identificativo di fatturazione e non una password.","A renderla sicura è una restrizione per referrer HTTP: una impostazione che dice a Google che la chiave funziona solo dal tuo sito.","È gratis, richiede circa cinque minuti ed è la sola cosa che vale la pena fare oggi.","Un file di account di servizio Google nella tua app è il caso diverso e urgente. Quelle sono credenziali vere.","27aRSpJe8ocJ-BZJy8XfJbemed0XEpkAx3L7oqR2xPE",1787826051009]