pup*_*701 5 html javascript iframe service-worker
我正在尝试在 iframe 内初始化服务工作者。我知道服务人员在起源时有安全限制,但据我了解,设置base应该可以解决这个问题。
<html>
<base href="http://127.0.0.1:9090">
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', function() {
navigator.serviceWorker.register('/sw.js').then(function(reg) {
if(reg.installing) {
console.log('Service worker installing');
} else if(reg.waiting) {
console.log('Service worker installed');
} else if(reg.active) {
console.log('Service worker active');
console.log(self)
}
}).catch(function(error) {
// registration failed
console.log('Registration failed with ' + error);
});
});
}
</script>
Run Code Online (Sandbox Code Playgroud)
错误:
Registration failed with InvalidStateError: Failed to register a ServiceWorker: The document is in an invalid state.
如果我修改基础,它会抱怨起源不同,因此服务工作人员在某种程度上与基础 href 有关。我在这里缺少什么?
感谢您的帮助
该<base>元素不会更改文档的来源。您可以通过记录来测试这一点self.origin。
然而,所做<base>的是更改解析相对 URL 的基本 URL。在这种情况下,您的 Service Worker 脚本是相对 URL。因此,而不是相对于其self.location相对于新基地。
这意味着如果您提供<base>跨域 URL,那么您的 Service Worker 脚本也将是跨域的。当您尝试注册时,这将触发错误。