Uygulama kabuğu ve gezinme
Akıllı Kullanıcı Betikleri
URL Eşleştirme ve Zamanlama ile Siteye Özel Komut Dosyaları (Greasemonkey gibi)
1Akıllı Kullanıcı Komut Dosyaları Nedir?#
Akıllı Kullanıcı Komut Dosyaları, her biri kendine ait adlandırılmış komut dosyalarıdır:
🌐 URL eşleşme desenleri (hangi sayfalarda çalışacağı)
⏱ Çalışma zamanı (yüklemeden önce, sırasında veya sonra)
✅ Etkinleştirme/Devre dışı bırakma anahtarı
Masaüstü tarayıcılardaki Greasemonkey veya Tampermonkey gibi çalışırlar - ama doğrudan uygulamanızın içine yerleşiktirler.
✅ Şunlar için mükemmel:
- Otomatik giriş YALNIZCA /login sayfasında
- Reklamları YALNIZCA makale sayfalarında gizleyin (https://news.com/article/*)
- MutationObserver ile DOM değişikliklerini izleyin
- Yanıp sönmeyi önlemek için sayfa çizilmeden önce enjekte edin (document-start)
Hızlı Enjeksiyondan temel fark:
Hızlı Enjeksiyon = TÜM sayfalarda aynı CSS/JS
Akıllı Kullanıcı Komut Dosyaları = komut dosyası, URL ve zamanlama başına kontrol
2Nerede Bulunur#
Adım 4 (İzinler) → aşağı kaydırın → 🤖 Akıllı Kullanıcı Komut Dosyaları kartı.
Yeni bir komut dosyası oluşturmak için '+ Ekle'ye dokunun. Her komut dosyasında şunlar bulunur:
- Ad - yönetici listesinde gösterilir
- URL Eşleşme Desenleri - her satıra bir tane (* joker karakterini destekler)
- Çalışma Zamanı - document-end / document-start / document-idle
- Kod - JavaScript kodunuz
- Etkin anahtarı
Bir komut dosyasını düzenlemek veya silmek için herhangi bir satıra dokunun.
3URL Eşleşme Deseni Örnekleri#
Desenler, komut dosyasının hangi sayfalarda çalışacağını belirler. Joker karakter olarak * kullanın:
# Run on every page of every site
*://*/*
# Run only on example.com (any path)
https://example.com/*
# Run on ALL pages of ANY .com domain
https://*.com/*
# Run only on the /login path
https://example.com/login
https://example.com/login/*
# Run on news article pages
https://news.example.com/article/*4Çalışma Zamanı Açıklaması#
- document-end (varsayılan)
Sayfa yüklenmeyi bitirdikten SONRA çalışır. Güvenli ve en uyumlu seçenektir. Öğeleri gizlemek, düğme eklemek ve takip için kullanın.
- document-start ⚡ (gelişmiş)
Sayfa çizilmeden ÖNCE çalışır. Komut dosyasını shouldInterceptRequest ile ham HTML'ye ekler. CSP başlıklarını kaldırır. Karanlık mod CSS'i veya düzen çizilmeden önce görünüm alanını zorlamak için kullanın.
- document-idle ⏱
Sayfa yüklendikten 1,5 saniye sonra çalışır. Geç yüklenen AJAX içeriğini veya gecikmeyle beliren pencereleri yakalamak için uygundur.
5Örnek 1: Yalnızca /login Sayfasında Otomatik Giriş#
Eşleşme: https://myapp.com/login
Çalışma zamanı: document-end
// Auto-fill login form
(function() {
var email = document.querySelector('input[type=email], input[name=email]');
var pass = document.querySelector('input[type=password]');
if (email) email.value = '[email protected]';
if (pass) pass.value = 'mypassword';
// Uncomment to auto-submit:
// var form = document.querySelector('form');
// if (form) form.submit();
})();6Örnek 2: Makale sayfalarında ödeme duvarlarını gizleyin#
Eşleşme: https://news.site.com/article/*
Çalışma zamanı: document-end
// Hide paywall overlay and restore scroll
(function() {
var overlay = document.querySelector('.paywall-overlay, .metered-content, #paywall');
if (overlay) overlay.remove();
document.body.style.overflow = 'auto';
document.documentElement.style.overflow = 'auto';
})();7Örnek 3: Dinamik İçeriği İzleyin (MutationObserver)#
Eşleşme: *://*/*
Çalışma zamanı: document-end
Sayfa yüklendikten SONRA beliren öğeler için (geç yüklenen pencereler, reklamlar):
// Remove any modal/popup that appears dynamically
(function() {
var sel = '.modal, .popup, .overlay, [class*="modal"], [class*="popup"]';
// Remove existing ones first
document.querySelectorAll(sel).forEach(function(el) { el.remove(); });
// Watch for new ones
var obs = new MutationObserver(function() {
document.querySelectorAll(sel).forEach(function(el) { el.remove(); });
});
obs.observe(document.body, { childList: true, subtree: true });
// Stop watching after 30 s to save battery
setTimeout(function() { obs.disconnect(); }, 30000);
})();8Örnek 4: Çizimden Önce Karanlık Modu Zorlayın (document-start)#
Eşleşme: *://*/*
Çalışma zamanı: document-start
Sayfa çizilmeden önce CSS ekler - beyaz yanıp sönme olmaz:
// Inject dark theme before page renders
(function() {
var s = document.createElement('style');
s.id = '__force_dark__';
s.textContent = [
'html { filter: invert(1) hue-rotate(180deg) !important; }',
'img,video,canvas,svg { filter: invert(1) hue-rotate(180deg) !important; }'
].join('\
');
(document.head || document.documentElement).appendChild(s);
})();9Örnek 5: Özel Analitik / Olay Takibi#
Eşleşme: https://myshop.com/*
Çalışma zamanı: document-idle
Sayfa tamamen oturduktan sonra özel olaylar gönderin:
// Track page views + button clicks
(function() {
// Page view
console.log('[Analytics] Page: ' + location.href);
// Track all CTA button clicks
document.querySelectorAll('button, .btn, a[href]').forEach(function(el) {
el.addEventListener('click', function() {
console.log('[Analytics] Clicked: ' + (el.textContent || el.href));
// Replace with your own tracker call, e.g. gtag('event', ...)
});
});
})();10Güvenlik ve Sınırlamalar#
⚡ document-start, eşleşen sayfa için Content-Security-Policy başlıklarını kaldırır. Yalnızca size ait olan veya açıkça güvendiğiniz sitelerde kullanın.
🔒 Same-Origin Policy: JS, farklı kaynaklı iframe'lere (PayPal, Stripe, Google girişi) erişemez. Bu, tarayıcı motoru tarafından uygulanır ve aşılamaz.
📵 Yalnızca HTTPS: Enjekte edilen komut dosyalarında konum veya kamera gibi API'ler HTTPS gerektirir.
✅ Çift çalışmaya karşı koruma: her komut dosyası bir window bayrağıyla korunur, böylece sayfa başına yalnızca bir kez çalışır.
✅ Çevrimdışı çalışır: Akıllı Kullanıcı Komut Dosyaları, ZIP ile paketlenmiş çevrimdışı uygulamalarda da çalışır.