I have successfully implemented a service worker in my Vue.js project before with simple HTML projects, where it worked great. However, when I include the same file in my Vue.js code, it keeps throwing an error:
The script has an unsupported MIME type ('text/html'). index.js?3609:11 Service wroker: error: SecurityError: Failed to register a ServiceWorker: The script has an unsupported MIME type ('text/html').
Here is the code I used to register my service worker:
if (navigator.serviceWorker) {
console.log("Service wroker: available");
window.addEventListener("load", () => {
navigator.serviceWorker
.register("/service-worker.js")
.then(res => console.log("Service worker: registered successfully"))
.catch(err => console.log("Service wroker: error: " + err))
})
} else {
console.log("Servicde wroker: not found");
}
My service worker file:
// This service worker caches all the responses of the sites besides caching files and assets individually
const cacheName = "v1";
// Install service worker
self.addEventListener("install", (e) => {
console.log("Service wroker: installed")
})
// Call activate event...
[Code continues...]
I have successfully located the service worker on my browser, but encountering issues when trying to register the service worker file. I have searched extensively for a solution and still seeking help. Any assistance would be greatly appreciated. Thanks in advance.