admin管理员组文章数量:1425695
I have a problem with installing my app in Firefox (Add to Home Screen). Everything is working fine on Chrome but on Firefox my button can’t install app (not working). I follow up documentation and I think everything should work. Also I have same problems with install process (add to home screen) on IOS - safari, chrome. What I'm doing wrong?
Here is my code:
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.oute === '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');
});
Also here is my service worker js code
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);
});
});
Can anybody help me with this? Did a miss something or?
I have a problem with installing my app in Firefox (Add to Home Screen). Everything is working fine on Chrome but on Firefox my button can’t install app (not working). I follow up documentation and I think everything should work. Also I have same problems with install process (add to home screen) on IOS - safari, chrome. What I'm doing wrong?
Here is my code:
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.oute === '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');
});
Also here is my service worker js code
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);
});
});
Can anybody help me with this? Did a miss something or?
Share Improve this question asked Mar 18, 2019 at 13:21 deqodadeqoda 481 silver badge4 bronze badges2 Answers
Reset to default 5beforeinstallprompt is not available in all browsers.
For those where it is not, you might possibly show instructions on how to add a shortcut.
See list here
https://developer.mozilla/en-US/docs/Web/API/BeforeInstallPromptEvent
If a page's manifest doesn't include the following properties, it will fail the audit:
- A short_name or name property
- An icons property that includes a 192x192 px and a 512x512 px icon
- A start_url property
- A display property set to fullscreen, standalone, or minimal-ui
- A prefer_related_applications property set to a value other than true.
Caution: A web app manifest is necessary for your app to be installable, but it isn't sufficient. To learn how to meet all the requirements for installability, see the Discover what it takes to be installable post.
source
本文标签： javascriptButton (install PWA) not working on FirefoxStack Overflow
版权声明：本文标题：javascript - Button (install PWA) not working on Firefox - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745457770a2659183.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论