Кнопка (установить PWA) не работает на Firefox - PullRequest
0 голосов
/ 18 марта 2019

У меня проблема с установкой приложения в Firefox (Добавить на главный экран). В Chrome все работает нормально, но в Firefox моя кнопка не может установить приложение (не работает). Я отслеживаю документацию и думаю, что все должно работать. Также у меня такие же проблемы с процессом установки (добавление на домашний экран) на IOS - safari, chrome. Что я делаю не так?

Вот мой код:

var logData = new Object();
            logData.appVersion = window.navigator.appVersion;
            logData.language = window.navigator.language;
            logData.platform = window.navigator.platform;
            logData.product = window.navigator.product;
            logData.userAgent = window.navigator.userAgent;
            logData.vendor = window.navigator.vendor;
            console.log(logData);

            if (window.matchMedia('(display-mode: standalone)').matches) {
                console.log('display-mode is standalone');
                $.post({
                    "url": "[(@{/a2hs/installedV})]",
                    "data": JSON.stringify(logData),
                    "contentType": "application/json; charset=utf-8"
                });
                document.querySelector('.a2hs').remove();
            } 

            else if (window.navigator.standalone === true) {
                console.log('display-mode is standalone');
                $.post({
                    "url": "[(@{/a2hs/installedV})]",
                    "data": JSON.stringify(logData),
                    "contentType": "application/json; charset=utf-8"
                });
                document.querySelector('.a2hs').remove();
            } else {
                $.post({
                    "url": "[(@{/a2hs/webAppuse})]",
                    "data": JSON.stringify(logData),
                    "contentType": "application/json; charset=utf-8"
                });
            }


            var deferredPrompt;
            var addBtn = document.querySelector('.a2hs-button');
            var addDiv = document.querySelector('.a2hs');

            if (addDiv) {
                addDiv.style.display = 'none';

                window.addEventListener('beforeinstallprompt', function(e) {

                    e.preventDefault();

                    deferredPrompt = e;

                    addDiv.style.display = 'block';
                    $.post({
                        "url": "[(@{/a2hs/prikazanaopcijazaaddtohomescreen})]",
                        "data": JSON.stringify(logData),
                        "contentType": "application/json; charset=utf-8"
                    });
                    addBtn.addEventListener('click', function(e) {

                        deferredPrompt.prompt();

                        deferredPrompt.userChoice.then(function(choiceResult) {
                            if (choiceResult.outcome === 'accepted') {
                                console.log('User accepted the A2HS prompt');
                                $.post({
                                    "url": "[(@{/a2hs/accept})]",
                                    "data": JSON.stringify(logData),
                                    "contentType": "application/json; charset=utf-8"
                                });
                                addDiv.remove();
                            } else {
                                console.log('User dismissed the A2HS prompt');
                                $.post({
                                    "url": "[(@{/a2hs/denied})]",
                                    "data": JSON.stringify(logData),
                                    "contentType": "application/json; charset=utf-8"
                                });
                                addDiv.style.display = 'block';
                            }

                            deferredPrompt = null;
                        });
                    });
                });
            }

            window.addEventListener('appinstalled', function(evt) {
                $.post({
                    "url": "[(@{/a2hs/installed})]",
                    "data": JSON.stringify(logData),
                    "contentType": "application/json; charset=utf-8"
                });
                console.log('A2HS installed');
            });

Также вот мой сервисный код js

self.addEventListener('install', function(event) {
    var offlinePage = new Request('offline.html');
    event.waitUntil(
        fetch(offlinePage).then(function(response) {
            return caches.open('std').then(function(cache) {
                console.log('Cached offline page during Install: ' + response.url);
                return cache.put(offlinePage, response);
            });
        }));
});


self.addEventListener('fetch', function(event) {
        event.respondWith(
            fetch(event.request).catch(function(error) {
                console.error('Network request Failed. Serving offline page: ' + error);
                console.log(event.request)
                return caches.open('std').then(function(cache) {
                    return cache.match('offline.html');
                });
            }));

});


self.addEventListener('refreshOffline', function(response) {
    return caches.open('std').then(function(cache) {
        console.log('Offline page updated from refreshOffline event: ' + response.url);
        return cache.put(offlinePage, response);
    });
});

Кто-нибудь может мне помочь с этим? Пропустил что-то или?

1 Ответ

0 голосов
/ 18 марта 2019

beforeinstallprompt доступно не во всех браузерах.
Для тех, у кого его нет, вы можете показать инструкции по добавлению ярлыка.

См. Список здесь
https://developer.mozilla.org/en-US/docs/Web/API/BeforeInstallPromptEvent

...