ios pwa sorunu
merhaba arkadaşlar, Tayfun hocanın pwa makalesini gördüm ve sayfama uyguladım. Android tarafında chrome da sıkıntı yok fakat samsung internette ve ios tarafında çalışmıyor.
html:
<link rel="manifest" href="{{ asset('/manifest.json') }}">
<meta name="theme-color" content="#6777ef"/>
<link rel="apple-touch-icon" href="{{ asset('img/logo.png') }}">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="sosyalkampus.net">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="{{ asset('img/logo.png') }}" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 621px) and (device-height: 1104px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ asset('img/logo.png') }}" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link rel="apple-touch-icon" sizes="128x128" href="{{ asset('img/logo.png') }}">
<link rel="apple-touch-icon-precomposed" sizes="128x128" href="{{ asset('img/logo.png') }}">
<link rel="icon" sizes="128x128" href="{{ asset('img/logo.png') }}">
<script src="{{ asset('/sw.js') }}"></script>
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('/sw.js');
});
}
</script>
javascript:
const installApp = document.getElementById('install-app');
installApp.addEventListener('click', async () => {
if (deferredPrompt !== null) {
deferredPrompt.prompt();
const { outcome } = await deferredPrompt.userChoice;
if (outcome === 'accepted') {
deferredPrompt = null;
}
}
});
window.addEventListener('beforeinstallprompt', (e) => {
$('.install-app-container').show();
deferredPrompt = e;
});
manifest.json:
{
"name": "Sosyal Kampüs",
"short_name": "Sosyal Kampüs",
"start_url": "/giris-yap",
"theme_color": "#212529",
"background_color": "#ffc107",
"display": "fullscreen",
"orientation": "natural",
"icons": [
{
"src": "img/pwa/logo.png",
"sizes": "192x192",
"type": "image/png"
}
]
}
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!