3 Ekim 2026'da sitenin yerel geliştirme sürümünü Safari'de açtık. Sayfa stilsiz geldi: düz metin, CSS yok, JavaScript çalışmıyor. Aynı adres Chrome'da sorunsuzdu.
Sebep: upgrade-insecure-requests
Sitenin güvenlik başlıkları arasında bir Content-Security-Policy var. İçindeki upgrade-insecure-requests direktifi tarayıcıya, sayfadaki http isteklerini https'e çevirmesini söylüyor. Yayındaki sitede istenen davranış tam olarak bu.
Yerel sunucu ise http://localhost üzerinde çalışıyor, https dinlemiyor. Chrome localhost'u bu kuraldan muaf tutuyor. Safari tutmadı: CSS ve JS isteklerini https://localhost adresine çevirdi, istekler düştü, sayfa iskelet olarak kaldı.
Çözüm
Direktifi yalnızca production'da gönderiyoruz. Next.js'te bu, next.config içindeki CSP listesinde ortam kontrolüne bağlı tek bir satır:
...(isDev ? [] : ["upgrade-insecure-requests"]),Strict-Transport-Security başlığını da aynı koşula aldık. Tarayıcıya localhost için "buraya hep https ile gel" demek, aynı makinede çalışan başka projelerde de benzer bir sürpriz doğurabilir.
Koşul geliştirme modunu ayırıyor, makineyi değil. Production build'i yerelde next start ile http üzerinden açarsanız direktif yine gönderilir ve Safari aynı şekilde stilsiz açar. Yayın öncesi testi Safari'de yapacaksanız yerel sunucuyu https ile çalıştırın ya da build'i gerçek bir önizleme adresinde açın.
Neden Chrome'da hiç görmedik
Geliştirmenin büyük kısmı Chrome'da geçiyor ve orada localhost güvenli bağlam sayıldığı için direktif sessizce atlanıyor. Direktif sitenin 29 Eylül tarihli ilk sürümünden beri oradaydı; dört gün boyunca siteyi Safari ile açan olmamıştı.
Kontrol listesi
- Bir tarayıcıda düzgün, diğerinde stilsiz açılan yerel sitede önce ağ sekmesine bak: istekler https'e mi gidiyor?
- CSP ve HSTS gibi yalnızca yayında anlamlı olan başlıkları ortama göre ayır.
- Safari'yi test listesinden çıkarma. Chrome'da hiç görünmeyen bu hata Safari'de sayfayı tamamen bozdu.