Skip to content

Instantly share code, notes, and snippets.

@buraxta
Created March 27, 2026 09:55
Show Gist options
  • Select an option

  • Save buraxta/1f5be12b0c771633a03210b11f9493fa to your computer and use it in GitHub Desktop.

Select an option

Save buraxta/1f5be12b0c771633a03210b11f9493fa to your computer and use it in GitHub Desktop.

Widget'ın mobil cihazlarda otomatik olarak başlaması (Auto-start), tarayıcının kimlik bilgileri üzerinden yapılan bir tespite dayanır.

🛠 Bizim Tarafımızdaki Tespit Mantığı

Chat Widget'ımız, cihazın mobil olup olmadığını anlamak için tarayıcının paylaştığı User-Agent dizesini standart Regex (Düzenli İfade) yöntemleriyle kontrol eder.

Sistemde çalışan güncel kod bloğumuz şudur:

/* src/app/utils/utils.ts */

export function detectIfIsMobile(windowContext) {
  let isMobile = false;
  // Aşağıdaki anahtar kelimelerden biri User-Agent içinde geçiyorsa 'Mobil' olarak işaretlenir.
  if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(windowContext.navigator.userAgent))
    isMobile = true;
  else
    isMobile = false; 
    
  return isMobile;
}

⚠️ Flutter WebView Neden Algılanmıyor Olabilir?

Eğer bir Flutter projesinde (veya herhangi bir mobil uygulama WebView içerisinde) widget otomatik başlamıyorsa, bunun temel sebebi sistemimizin cihazı "Masaüstü (Desktop)" olarak algılamasıdır. Bunun en yaygın 3 nedeni şunlardır:

1. Özel (Custom) User-Agent Kullanımı

Flutter'daki WebView bileşenine elle bir userAgent atandıysa ve bu dize içinde "Mobile", "Android" veya "iPhone" gibi yukarıdaki Regex'e uyan bir ifade geçmiyorsa tespit yapılamaz.

Çözüm: userAgent parametresinin içinde Mobile anahtar kelimesinin geçtiinden emin olunmalıdır.

2. iPadOS ve Tablet Modu Sorunu

Özellikle iPadOS 13+ yüklü tabletler ve bazı Android tabletler, varsayılan olarak "Desktop Class Browsing" modundadır. Bu durumda tarayıcı, kendini "Macintosh" (Masaüstü Safari) olarak tanıtır.

Çözüm: WebView ayarlarından "Desktop Mode" kapatılmalı veya User-Agent'a manuel olarak Mobile dizesi eklenmelidir.

3. Emülatör Yapılandırması

Bazı Android/iOS emülatörleri, WebView üzerinden yapılan isteklerde cihaz kimliğini (Device Identity) tam olarak yansıtmıyor olabilir.

✅ Flutter Tarafındaki Çözüm Önerisi

Eğer webview_flutter veya benzeri bir paket kullanıyorsanız, userAgent özelliğini aşağıdaki örnekteki gibi yapılandırarak sorunu anında çözebilirsiniz:

// Flutter WebView Örneği (webview_flutter)
WebViewWidget(
  controller: WebViewController()
    ..setJavaScriptMode(JavaScriptMode.unrestricted)
    // Mevcut User-Agent'ın sonuna 'Mobile' anahtar kelimesini eklemek tespiti sağlar.
    ..setUserAgent("CustomApp/1.0 (Mobile)") 
    ..loadRequest(Uri.parse('https://widget_url_buraya_gelecek')),
)

Cihazınızda User-Agent dizesinin ne olduğunu görmek için widget yüklendiğinde tarayıcı konsoluna navigator.userAgent yazarak test edebilir veya whatismybrowser.com gibi siteleri WebView içinden açarak kontrol sağlayabilirsiniz.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment