我们有一个SaaS平台,需要根据用户设置加载不同的清单文件。一旦应用程序启动并获取了用户设置,我想要加载正确的清单文件。然而,这并没有起作用。我尝试了几种不同的方法,但无法触发
如果我在我的index.html中加载一个清单文件,然后不更改清单文件的href,似乎每次都可以正常工作。
我尝试在index.html中在清单元素上保留空的href,然后稍后更新它,但是当我这样做时,
在我的index.html中:
或者
在我的Bootstrap JS文件中,一旦我确定要加载哪个清单文件,就可以更新href到清单。
beforeinstallprompt
事件。如果我在我的index.html中加载一个清单文件,然后不更改清单文件的href,似乎每次都可以正常工作。
我尝试在index.html中在清单元素上保留空的href,然后稍后更新它,但是当我这样做时,
beforeinstallprompt
未被触发。在我的index.html中:
<link rel="manifest" href="">
或者
<link rel="manifest" href="/manifest.json">
在我的Bootstrap JS文件中,一旦我确定要加载哪个清单文件,就可以更新href到清单。
var href = "https://xxx.s3.eu-central-1.amazonaws.com/sites/1/manifest2.json";
var manifestJson = {
"name": "test in code",
"short_name": "test in code",
"icons": [
{
"src": "https://xxx.s3.eu-central-1.amazonaws.com/sites/0/icons/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "https://xxx.s3.eu-central-1.amazonaws.com/sites/0/icons/android-chrome-256x256.png",
"sizes": "256x256",
"type": "image/png"
},
{
"src": "https://xxx.s3.eu-central-1.amazonaws.com/sites/0/icons/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"start_url": "http://localhost:9000/home/",
"display": "standalone",
"background_color": "#2B3D4B",
"theme_color": "#00afec",
"prefer_related_applications": false
};
var stringManifest = JSON.stringify(manifestJson);
var blob = new Blob([stringManifest], {type: 'application/json'});
var manifestURL = URL.createObjectURL(blob);
// I have tried both ways of updating the manifest below
// $("head").find("link[rel='manifest']").attr("href", manifestURL);
$("head").find("link[rel='manifest']").attr("href", href);
window.addEventListener('beforeinstallprompt', function(event) {
console.log("poa: \nxxxxxxxxxx BEFOREINSTALLPROMPT xxxxxxxxxxx\n\n");
$("body").addClass("hypo-install-prompt");
// Save the event for later use (when the user clicks an install button)
app.cache.beforeinstallprompt = event;
});
navigator.serviceWorker.getRegistrations().then(function(registrations) {
console.log("Unregister ServiceWorker", registrations);
for (var i = 0; i < registrations.length; i++) {
var registration = registrations[i];
registration.unregister();
}
});
navigator.serviceWorker.register('/home/serviceWorker.js', { scope: '/home/' }).then(function(registration) {
// Registration was successful
console.log('ServiceWorker registration successful with scope: ', registration.scope);
}, function(err) {
console.log('ServiceWorker registration failed: ', err);
});
我知道这是一个相当常见的情况,很多人已经解决了它,但目前为止没有任何一种方法适用于我。有人有什么提示吗?