Widget'ın mobil cihazlarda otomatik olarak başlaması (Auto-start), tarayıcının kimlik bilgileri üzerinden yapılan bir tespite dayanır.
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;
}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:
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.
Ö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.
Bazı Android/iOS emülatörleri, WebView üzerinden yapılan isteklerde cihaz kimliğini (Device Identity) tam olarak yansıtmıyor olabilir.
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.