Sizib chiqqan API kalitlari: AI qanday qilib juniorlarni kod generatsiyasi paytida chuv tushiradi
Stek: React, Next.js App Router, Vite. Muammo: AI tomonidan yaratilgan kodda muhit o’zgaruvchilaridan noto’g’ri foydalanish natijasida maxfiy kalitlar va tokenlarning mijoz tomonidagi JS-paketlarga oqib ketishi.
Kirish
Tasavvur qiling, solo-dasturchining odatiy tongi: kofe, ochiq kod muharriri va yangi funksiya — SaaS mahsulotiga sun’iy intellekt integratsiyasi — mukammal ishlayotganidan quvonch. Vibe Coding amalda: siz asistentdan React mijoz komponentini yozishni so’radingiz, u kodni berdi va ma’lumotlar render qilinmoqda. Siz masterga push qilasiz va uxlashga ketasiz.
Ertalab esa uyg’onib, Google Cloud-dan 48 soat ichida $82,314 miqdoridagi hisob-fakturani ko’rasiz. Sababi? AI tomonidan yaratilgan kodning birgina satri siringizni ochiq paketga joylab qo’ygan. Bunday API kalitlari oqishi hozirgi kunda sohadagi eng katta muammolardan biriga aylandi.
Sun’iy intellekt dasturlashni tubdan tezlashtirdi. Ammo katta til modellarining fundamental zaif tomoni bor, bu Garry Tan audit keysida hujjatlashtirilgan: ular kodni joriy fayl uchun optimallashtiradi va xavfsiz server bilan ochiq mijoz o’rtasidagi arxitektura farqini mutlaqo tushunmaydi. Siz AI-dan “to’lovni tezda ulash” yoki “frontenddan ma’lumotlar bazasiga so’rov yuborish”ni so’raganingizda, u ishlaydigan kodni yaratadi. Lekin shu bilan birga sirlaringizni ham oshkor qiladi. Agar siz audit o’tkazmasangiz, Next.js yoki Vite infratuzilmasida API kalitlarining yo’qolishi faqat vaqt masalasidir.
Keys-stadi: Minglab Google Cloud kalitlari ochiq holatda
🔴 Tanqidiy · Moliyaviy yo’qotishlar · OWASP A02:2021 Cryptographic Failures
Muammo ko’lami faqat juniorlarning xatolari bilan cheklanmaydi. 2026-yil boshida Truffle Security xavfsizlik ekspertlari dahshatli tadqiqotni e’lon qilishdi. Ular ommaviy saytlarning manba kodini skanerladilar va bevosita mijoz JavaScript-iga tikilgan 2,863 ta faol Google Cloud kalitlarini topdilar (odatda ular AIza prefiksi bilan boshlanadi).
Ushbu keysdagi eng qo’rqinchli narsa — “Retroactive Privilege Expansion” (ortga qaytuvchi imtiyozlarni kengaytirish) mexanizmi. Ko’p yillar davomida Google ushbu kalitlarni Google Maps kabi ommaviy xizmatlar uchun ishlatishni tavsiya qilgan. Dasturchilar ularni frontendga bemalol joylashtirganlar, chunki kalitlar shaxsiy ma’lumotlarga kirish imkonini bermagan. Ammo loyihalarda Gemini AI generativ API-lari ommaviy ravishda yoqila boshlaganda, barcha eski “ommaviy” kalitlar avtomatik ravishda og’ir inference-modellarni ishga tushirish huquqini oldi. Xaritalar uchun zararsiz kalit, JS-paketlardan ushbu kalitlarni yig’ib olgan xakerlar uchun cheksiz kredit kartasiga aylandi.
Buni GitGuardian-ning “State of Secrets Sprawl 2026” hisoboti ham tasdiqlaydi: faqat 2025-yilning o’zida GitHub-ning ochiq omborlariga 28,65 million ta yangi kodga tikilgan sirlar oqib ketgan (bir yil ichida 34% o’sish). Shu bilan birga, AI vositalari yordamida yaratilgan commitlar inson tomonidan yozilgan kodga qaraganda ikki baravar ko’p sirni oshkor qiladi. AI xavfsizlik haqida qayg’urmaydi; uning vazifasi — kodni hoziroq ishlatishdir.
Oqish anatomiyasi
🔴 Tanqidiy · Infratuzilmani buzish · OWASP A02:2021 Cryptographic Failures
Nima uchun AI asistentlari ma’lumotlarni bunchalik oson oshkor qiladi? Hammasi zamonaviy frontend freymvorklari (Next.js, Vite) muhit o’zgaruvchilarini qanday boshqarishiga borib taqaladi. O’zgaruvchi brauzerga kirishi uchun freymvork maxsus prefiksni talab qiladi: Next.js uchun NEXT_PUBLIC_ yoki Vite uchun VITE_.
Vibe Coding paytida quyidagi klassik ssenariy sodir bo’ladi:
- Siz AI-dan uchinchi tomon API-sidan (masalan, OpenAI yoki Stripe) ma’lumot oluvchi mijoz komponentini yozishni so’raysiz.
- AI standart
process.env.SECRET_KEYdan foydalanibfetchyozadi. - Brauzerda so’rov muvaffaqiyatsiz tugaydi, chunki mijozda
process.env.SECRET_KEYqiymatiundefinedga teng. Siz xatoni chatga qayta joylaysiz. - AI asistent “o’zgaruvchi mijozda topilmadi” xatosini ko’rib, xursandlik bilan yechim taklif qiladi: “Shunchaki
.envfaylingizgaNEXT_PUBLIC_prefiksini qo’shing!”.
Siz buni qilasiz. So’rov ishlay boshlaydi. AI kunni saqlab qoldi. Ammo aslida Webpack yoki Vite bundleri maxfiy kalitingizni to’g’ridan-to’g’ri kompilyatsiya qilingan .js fayliga satrli literal sifatida joylab qo’ydi.
// ❌ AI-hallucination: Mijoz paketiga oqib tushayotgan odatiy generatsiyalangan kod
export default function CheckoutButton() {
const handlePayment = async () => {
const res = await fetch("https://api.stripe.com/v1/charges", {
headers: {
// OQISH: Kalit bevosita minifikatsiya qilingan JS-ga tushadi
Authorization: `Bearer ${process.env.NEXT_PUBLIC_STRIPE_SECRET_KEY}`,
},
});
};
return <button onClick={handlePayment}>To'lash</button>;
}
Har qanday tashrif buyuruvchi F12 tugmasini bosib, Network yoki Sources yorlig’ini ochib, kalitni olishi mumkin. Bunday oqishlar — bu aynan WebValid paket skaneri build production-ga chiqishidan oldin aniqlashi kerak bo’lgan narsadir.
Vite loyihalari: VITE_ tuzog’i
Vite-da mexanizm shunga o’xshash. Faqat VITE_ prefiksi bilan boshlanadigan o’zgaruvchilar mijoz tomonidagi kodga ta’sir qiladi. Agar AI asistent Vite komponentida undefined xatosiga duch kelsa, u prefiks qo’shishni tavsiya qiladi:
// ❌ Vite-da AI tomonidan yaratilgan oqish
// .env: VITE_SUPABASE_KEY=your_secret_key
const supabase = createClient(
process.env.VITE_SUPABASE_URL,
process.env.VITE_SUPABASE_KEY,
);
Bu ishlasa-da, Vite-ning build jarayoni statik almashtirishni amalga oshiradi. dist/ papkangizga qarang va quyidagiga o’xshash narsani topasiz:
const supabase = createClient("https://xyz.supabase.co", "your_secret_key");
Qo’shimcha himoya — Next.js Taint API:
Agar siz Next.js 14+ (App Router) dan foydalanayotgan bo’lsangiz, maxfiy ob’ektlarning mijozga o’tib ketishini aniq taqiqlash uchun eksperimental Taint API-dan foydalanishingiz mumkin. Bu AI kodlash asistentlari ham tasodifan aylanib o’tolmaydigan “qattiq blok” yaratadi:
// 1. next.config.js
module.exports = { experimental: { taint: true } };
// 2. server-only-logic.ts
import { experimental_taintObjectReference } from "react";
export function getSecureConfig() {
const config = { apiKey: process.env.STRIPE_SECRET_KEY };
experimental_taintObjectReference(
"Maxfiy konfiguratsiyani mijozga uzatmang",
config,
);
return config;
}
Agar AI ushbu config ob’ektini Mijoz Komponentiga uzatishga harakat qilsa, React renderlash xatosini beradi va oqishni manbada to’xtatadi.
// ✅ Tuzatish: So'rovni Server Action yoki Route Handler-ga o'tkazamiz
"use server"; // Kod qat'iy ravishda serverda bajariladi
export async function processPayment() {
const res = await fetch("https://api.stripe.com/v1/charges", {
headers: {
// XAVFSIZ: Prefiksiz kalit faqat Node.js muhitida yashaydi
Authorization: `Bearer ${process.env.STRIPE_SECRET_KEY}`,
},
});
}
AI asistentlarining sirlar bilan bog’liq halokatli xatolari
🟠 Yuqori · Foydalanuvchi ma’lumotlarini yo’qotish · OWASP A05:2021 Security Misconfiguration
Infratuzilmani sozlashda AI-ga ko’r-ko’rona ishonish minglab loyihalarda kuzatiladigan bir qancha umumiy xatolarga olib keladi.
Ochiq .env.example fayllarini yaratish
Asistentlar tez-tez loyiha hujjatlari uchun .env.example shablonini yaratadilar. Ammo ular GitHub-dagi ulkan ma’lumotlarda o’qitilganligi sababli, ular xabardorliksiz real ko’rinishdagi token signaturalarini yoki hatto siz sessiya davomida avvalroq eslatib o’tgan satrlarni “placeholder” sifatida ishlatishi mumkin.
# ❌ Xavfli AI tomonidan yaratilgan .env.example
# AI yaqinda qayta ishlagan real kalit formatidan foydalanishi mumkin
STRIPE_SECRET_KEY=sk_live_51PZ... # AI bu yerda real kalitni oshkor qilishi mumkin
Firebase va Supabase konsfiguratsiyalari
AI ko’pincha initsializatsiya kodini bevosita mijoz fayllarida (masalan, root-layout.tsx) yaratadi. U yerga konfiguratsiya ob’ektlarini backend Row Level Security (RLS) qoidalari bilan himoyalanganligini tekshirmasdan to’kib tashlaydi.
// ❌ Mijoz komponentidagi xavfli AI kodi
const supabase = createClient(
process.env.NEXT_PUBLIC_SUPABASE_URL,
process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY, // ❌ RLS tekshiruvisiz fosh qilingan
);
Server va Client komponentlari o’rtasidagi chalkashlik
Next.js-da AI ko’pincha sirlarni to’g’ri o’qiydigan Server komponentini yaratadi, so’ngra sizning so’rovingiz bo’yicha onClick yoki useState qo’shadi. Bu faylga 'use client' direktivasini qo’yishga majbur qiladi va to’satdan serverda xavfsiz bo’lgan o’zgaruvchilar mijoz kodiga paketlanadi.
// ❌ AI buni tugmani qo'llab-quvvatlash uchun 'use client' ga refaktor qiladi
"use client";
export default function SecretPage({ data }) {
// Agar 'data' sirlarni o'z ichiga olsa, u endi ommaviy JS-paketi proplarida
return (
<button onClick={() => console.log(data)}>Ma'lumotlarni ko'rsatish</button>
);
}
”Ichkarida” xavfsizlik: Paket qanday tekshiriladi
Nima uchun avtomatlashtirish kerakligini tushunish uchun, oqish qanday sodir bo’lishiga bir nazar tashlashga arziydi. Siz build-ni ishga tushirganingizda, bundler (Webpack yoki Turbopack) barcha bog’liqliklarni ulkan JS-fayllarga yig’adi. Agar AI-asistent u yerga sirni “yashirincha” kirgizgan bo’lsa, u oddiy qator ko’rinishida qoladi.
Build natijalarini inspecting qilish orqali buni o’zingiz ko’rishingiz mumkin. Bu xavfsizlikka mas’uliyat bilan qaraydigan har bir dasturchi bilishi kerak bo’lgan asosiy mahoratdir:
- Build-ni ishga tushiring:
npm run build. - Kompilyatsiya qilingan kod papkasiga o’ting (Next.js-da
.next/static/chunks/yoki Vite-dadist/). - Ma’lum bo’lgan maxfiy kalit signaturalarini qidirish uchun
grepyokiripgrepdan foydalaning:
# Signaturalarni qidirish: Stripe (sk_), Google Cloud (AIza), JWT (ey...)
grep -r -E "sk_test_|sk_live_|AIza|ey[A-Za-z0-9_-]*\.[A-Za-z0-9_-]*\." .next/static/
Bunday qo’lda auditlar muammoni “his qilish”ning ajoyib usuli. Biroq, aslida ularga tayanish xavfli: muntazam ifodalar (regex) noto’g’ri natijalar berishi mumkin va inson omili (deploy-dan oldin skriptni ishga tushirishni unutish) juda yuqori. Aynan shu yerda professional avtomatlashtirish yordamga keladi.
JS-paketidatagi oqishlarni avtomatik skanerlash
Har bir relizdan oldin terminalni tekshirish va regex yozish — dasturchilar shoshilinchda ko’p unutadigan narsadir. Vibe Coding tezlikni nazarda tutadi. Auditlar ham tezkor bo’lishi kerak.
| Imkoniyat | WebValid Security Scanner |
|---|---|
| JS-paketidagi kalitlarni skanerlash | ✅ Sirli namunalar uchun AST va paket matnini tahlil qiladi |
| Xavfsizlik sarlavhalari | ✅ CSP, HSTS, X-Frame-Options tekshiradi |
| Buzilgan semantika / ARIA | ✅ Render qilingan HTML-ni tahlil qiladi |
| Avtorizatsiya mantiqi | ❌ Biznes mantiqini qo’lda ko’rib chiqishni talab qiladi |
| Manba kodining statik tahlili | ❌ Faqat yig’ilgan production paketlarini tekshiradi |
Loyihangizni kompilyatsiya qiling va URL-ni ommaviy skanerga yuboring. Agar AI Stripe, OpenAI yoki Google Cloud kalitlarini ochiq foydalanishda qoldirgan bo’lsa, skaner nafaqat buni ko’rsatibgina qolmay, balki ai-fix ko’rsatmalari bilan to’liq Markdown hisobotini taqdim etadi.
Sun’iy intellekt funksional kodni ajoyib tarzda yozadi — u shunchaki qaysi vaqtda arxitektura noto’g’ri tomonga burilib, parolni ommaviy papkaga qo’yganini bilmaydi. Unga xatolar xaritasini bering va u hamma narsani o’zi tuzatadi. Ushbu hisobotlarni qanday qilib tayyor AI-vazifalariga aylantirishni bilib oling.
5 banddan iborat API xavfsizlik nazorat ro’yxati
Keyingi generativ funksiyani production-ga chiqarishdan oldin ushbu tezkor qo’lda tekshiruvni o’tkazing:
- Build-ni Grep qiling:
.next/yokidist/papkangizdagrep -r "sk_"yokigrep -r "AIza"dan foydalaning. - Prefiks auditi:
.envfayllaringizni skanerlang. Biron bir sirNEXT_PUBLIC_yokiVITE_prefiksiga egami? - Interaktivlikni tekshiring: AI muhit o’zgaruvchilari bilan ishlaydigan Server komponentiga
'use client'qo’shib qo’ymadimi? - Fiksturalarni tekshiring: Production distributivingizda
.env.exampleyoki test-moklarini taqdim etmayapsizmi? - Action-larni ko’rib chiqing: Server Action-laringiz egalikni tekshirish uchun
getServerSession(yoki ekvivalent) dan foydalanadimi?
20 soniyada tayyor AI tuzatish prompini oling. Nol konfiguratsiya. Bepul skanerlash. → https://webvalid.dev/
Audit natijalari bo’yicha savollaringiz bormi? Biz bilan bog’laning