Hem File System Access API hem de Origin Private File System API geliştiricilerin, kullanıcının cihazındaki dosyalara ve dizinlere erişmesine olanak tanır. Birincisi, geliştiricilerin normal, kullanıcı tarafından görülebilen dosya sisteminde okuma ve yazma işlemi yapmasına olanak tanır. Sistem de kullanıcı dosya sisteminden gizlenmiş, her bir sitenin kaynağında gizli olan ve belirli performans avantajları sunan özel bir dosya açar. Her iki durumda da geliştiricilerin dosyalar ve dizinlerle etkileşimde bulunma şekli, FileSystemHandle nesneleri (daha somut olarak, dosyalar için FileSystemFileHandle ve dizinler için FileSystemDirectoryHandle) aracılığıyla gerçekleşir. Şimdiye kadar, dosya sistemlerinden birinde bir dosya veya dizinde yapılan değişiklikler konusunda bilgi almak için bir tür yoklama ve lastModified zaman damgası, hatta dosya içeriğinin karşılaştırılması gerekiyordu.
Chrome 129'un kaynak denemesinde yer alan File System Observer API bunu değiştirir ve değişiklikler yapıldığında geliştiricilerin otomatik olarak uyarılmasını sağlar. Bu kılavuzda, özelliğin nasıl çalıştığı ve özelliği nasıl deneyeceğiniz açıklanmaktadır.
Kullanım alanları
Dosya sistemi değişiklikleri gerçekleşir gerçekleşmez haberdar edilmesi gereken uygulamalarda File System Observer API'yi kullanın.
- Bir projenin dosya sistemi ağacının bir temsilini gösteren web tabanlı entegre geliştirme ortamları (IDE'ler).
- Dosya sistemi değişikliklerini bir sunucuyla senkronize eden uygulamalar. Örneğin, bir SQLite veritabanı dosyası.
- Dosya sistemi değişikliklerinin ana iş parçacığını bir çalışandan veya başka bir sekmeden bildirmesi gereken uygulamalar.
- Görselleri otomatik olarak optimize etmek için bir kaynak dizinini gözlemleyen uygulamalar.
File System Observer API nasıl kullanılır?
Özellik algılama
File System Observer API'nin desteklenip desteklenmediğini görmek için aşağıdaki örnekte olduğu gibi bir özellik testi çalıştırın.
if ('FileSystemObserver' in self) {
// The File System Observer API is supported.
}
Dosya sistemi gözlemleyicisini başlat
new FileSystemObserver() öğesini çağırıp bağımsız değişken olarak bir callback işlevi sağlayarak bir Dosya Sistemi Gözlemcisini başlatın.
const observer = new FileSystemObserver(callback);
Bir dosya veya dizini incelemeye başlama
Bir dosyayı veya dizini gözlemlemeye başlamak için FileSystemObserver örneğinin eşzamansız observe() yöntemini çağırın. Bu yönteme, bağımsız değişken olarak seçilen dosyanın veya dizinin FileSystemHandle değerini sağlayın. Bir dizini gözlemlerken, dizindeki değişiklikler konusunda yinelemeli olarak bilgi almak isteyip istemediğinizi seçmenize olanak tanıyan isteğe bağlı bir options bağımsız değişkeni vardır (dizinin kendisi ve içerdiği tüm alt dizinler ve dosyalar için). Varsayılan seçenek, yalnızca dizinin kendisini ve doğrudan içerdiği dosyaları gözlemlemektir.
// Observe a file.
await observer.observe(fileHandle);
// Observe a directory.
await observer.observe(directoryHandle);
// Observe a directory recursively.
await observer.observe(directoryHandle, {recursive: true});
Geri çağırma işlevi
Dosya sisteminde değişiklik yapıldığında, dosya sistemi değişikliği records ile bir geri çağırma işlevi ve bağımsız değişkenleri olarak observer kullanılır. observer bağımsız değişkenini örneğin, ilgilendiğiniz dosyaların tamamı silindiğinde gözlemcinin bağlantısını kesmek için kullanabilirsiniz (bkz. Dosya sistemini gözlemlemeyi durdurma).
const callback = (records, observer) => {
for (const record of records) {
console.log('Change detected', record);
}
};
Dosya sistemi değişiklik kaydı
Her dosya sistemi değişiklik kaydı aşağıdaki yapıya sahiptir. Tüm alanlar salt okunurdur.
root(birFileSystemHandle):FileSystemObserver.observe()işlevine geçirilen herkese açık kullanıcı adı.changedHandle(aFileSystemHandle): Dosya sistemi değişikliğinden etkilenen herkese açık kullanıcı adı.relativePathComponents(birArray):changedHandleöğesininrootile göreceli yolu.type(aString): Değişikliğin türü. Aşağıdaki türler gösterilebilir:"appeared": Dosya veya dizin oluşturuldu ya darootiçine taşındı."disappeared": Dosya veya dizin silindi ya darootdışına taşındı."modified": Dosya veya dizin değiştirilmiştir."moved": Dosya veya dizin,rootiçine taşınmıştır."unknown": Bu, hiçbir etkinliğin veya daha fazla etkinliğin kaçırıldığını gösterir. Geliştiriciler buna yanıt olarak izlenen dizini yoklamalıdır."errored": Gözlem artık geçerli değil. Bu durumda, dosya sistemini gözlemlemeyi durdurmak isteyebilirsiniz.
relativePathMovedFrom(birArray, isteğe bağlı): Taşınan herkese açık kullanıcı adının önceki konumu. Yalnızcatype"moved"olduğunda kullanılabilir.
Bir dosya veya dizini gözlemlemeyi durdurma
Bir FileSystemHandle öğesini gözlemlemeyi durdurmak için unobserve() yöntemini çağırın ve herkese açık kullanıcı adını bağımsız değişken olarak iletin.
observer.unobserve(fileHandle);
Dosya sistemini gözlemlemeyi durdur
Dosya sistemini gözlemlemeyi durdurmak için FileSystemObserver örneğinin bağlantısını aşağıdaki gibi kesin.
observer.disconnect();
API'yi deneyin
File System Observer API'yi yerel olarak test etmek için about:flags öğesinde #file-system-observer işaretini ayarlayın. API'yi gerçek kullanıcılarla test etmek için kaynak deneme sürümüne kaydolun ve Chrome kaynak denemelerinde belirtilen talimatları uygulayın. Kaynak denemesi Chrome 129 (11 Eylül 2024) ile Chrome 134 (26 Şubat 2025) tarihleri arasında gerçekleştirilecektir.
Demo
File System Observer API'nin nasıl çalıştığını yerleşik demoda görebilirsiniz. Kaynak kodu kontrol edin veya Glitch'te demo kodunu yeniden düzenleyin. Demo, gözlemlenen bir dizinde rastgele dosya oluşturur, siler veya değiştirir, ayrıca etkinliklerini uygulama penceresinin üst bölümüne kaydeder. Ardından, değişiklikleri uygulama penceresinin alt bölümünde yapıldıkları sırada günlüğe kaydeder. Bu metni File System Observer API'yi desteklemeyen bir tarayıcıda okuyorsanız demonun ekran görüntüsünü inceleyin.
Geri bildirim
File System Observer API'nin şekliyle ilgili geri bildirimde bulunmak istiyorsanız WhatWG/fs deposundaki Issue #123 (Sorun 123) ile ilgili yorum yazabilirsiniz.
İlgili bağlantılar
- Açıklayıcı
- TAG incelemesi
- Mozilla Standartları Konumu
- WebKit Standards Konumu
- ChromeStatus
- Chromium hatası
Teşekkür
Bu belge Daseul Lee, Nathan Memmott, Etienne Noël ve Rachel Andrew tarafından incelenmiştir.