我刚刚尝试实现服务工作者在静态站点上缓存一些JSON文件和其他资产(在localhost chrome版本47.0.2526.73(64位)上运行).使用cache.addAll()我已将文件添加到缓存中,当我打开chrome中的资源选项卡,然后单击缓存存储时,将列出所有文件.
我遇到的问题是我的服务工作者在chrome:// service-worker-internals中被列为"激活"和"正在运行"但是,我无法确定该工作者是否实际上正在拦截请求并提供缓存文件.我添加了事件监听器,即使我在服务工作者开发工具实例中控制日志事件,它也永远不会遇到断点:
this.addEventListener('install', function(event) {
event.waitUntil(
caches.open('v1').then(function(cache) {
console.log(cache);
return cache.addAll([
'/json/0.json',
'/json/1.json',
'/json/3.json',
'/json/4.json',
'/json/5.json',
]);
})
);
});
this.addEventListener('fetch', function(event) {
console.log(event);
var response;
event.respondWith(caches.match(event.request).catch(function() {
return fetch(event.request);
}).then(function(r) {
response = r;
caches.open('v1').then(function(cache) {
cache.put(event.request, response);
});
return response.clone();
}).catch(function() {
}));
});
Run Code Online (Sandbox Code Playgroud)
基本上我正在完成HTML5摇滚服务工作者介绍中描述的事情,但我很确定我的资产不是从缓存中提供的.我已经注意到,服务工作者提供的资产在size列中的devtools的网络选项卡中通过指示"来自服务工作者"来注明.
看起来好像我的代码与示例没什么不同,但是由于某些原因它并没有达到fetch事件.我的代码的要点:https://gist.github.com/srhise/c2099b347f68b958884d
javascript google-chrome service-worker progressive-web-apps
我有一个关于新的Django 1.3静态文件框架的一般性问题.
我非常喜欢Django 1.3中引入的新Django静态文件功能.通常,我设置STATIC_URL ="/ static /"并在我的模板中输入{{STATIC_URL}}模板标签.开发服务器自动提供静态文件的方式非常棒,我的所有内容都按预期提供.
The {{ STATIC_URL }} would be substituted in the template and might serve up files like this...
example.com/static/css/master.css
example.com/static/images/logo.png
example.com/static/js/site.js
Run Code Online (Sandbox Code Playgroud)
但是,我正在使用旧网站,其中静态媒体安装在网址根目录.例如,静态URL的路径可能如下所示:
example.com/css/master.css
example.com/images/logo.png
example.com/js/site.js
Run Code Online (Sandbox Code Playgroud)
它不使用"静态"url命名空间.
我想知道是否有办法让新的静态文件功能不使用静态命名空间并提供上面的URL,但仍然保留了新的静态文件框架(开发服务器提供的collectstatic,静态文件等)的好处.我尝试设置STATIC_URL =""和STATIC_URL ="/",但似乎都没有达到预期的效果.
有没有办法配置静态文件来提供没有命名空间的静态文件?谢谢你的考虑.
我打算将django项目转换为Progressive Web App.我无法弄清楚在我的django项目中将service_worker.js和manifest.json文件放在何处.我尝试过以下方法:
我的项目/
|__app1
|__app2
|__manage.py
|__manifest.json
|__service_worker.js
Run Code Online (Sandbox Code Playgroud)
然后尝试使用相对路径../../../service_worker.js从html文件注册服务工作者.那没用.它显示了这个错误:"在获取脚本时收到了错误的HTTP响应代码(404)."
我尝试的另一种方法是将service_worker.js和manifest.json放在静态文件夹中:
我的项目/
|__app1/
|__static/
|__app1/
|__service_worker.js
|__manifest.json
|__app2
|__manage.py
Run Code Online (Sandbox Code Playgroud)
并使用{%static'app1/service_worker.js'%}访问那些.此方法的问题在于已注册的service_worker.js的范围仅限于该静态文件夹.我在一个stackoverflow回答中看到,我可以明确地将服务工作者的范围设置为{scope:'/'}.但是,我认为可能有一种我想念的更好的方法.如果有人有解决方案,请告诉我.
我正在尝试在 django 中注册 Service Worker 但出现此错误
DOMException:无法注册 ServiceWorker:脚本资源位于重定向后面,这是不允许的。
我的项目结构是
src/
templates/sw.js
static/js/main.js #file where I register service worker
Run Code Online (Sandbox Code Playgroud)
main.js
if ('serviceWorker' in navigator) {
navigator.serviceWorker
.register('sw.js', {scope: '/'})
.then(function(reg) {
console.log('Achieng Service worker Registration worked!');
})
.catch(function(error) {
console.log(error);
});
}
Run Code Online (Sandbox Code Playgroud)
根据这个django-service worker,我将我的网址定义为
path('sw.js/', (TemplateView.as_view(template_name="sw.js", content_type='application/javascript', )), name='sw.js'),
并将我的 sw.js 放在 templates 文件夹中。
我可能会错过什么?我希望服务人员有一个默认范围“/”
我已经学会使用 chrome https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en实现 Web 应用程序的推送通知 并成功运行博客中提到的示例代码。
不幸的是,我无法用 Django 复制成功。它永远不会进入 Service Worker 的 Ready 方法(navigator.serviceWorker.ready.then),即 Service Worker 永远不会准备好。
根据http://www.html5rocks.com/en/tutorials/service-worker/introduction/
Register 方法的一个微妙之处是 Service Worker 文件的位置。在这种情况下,您会注意到服务工作线程文件位于域的根目录下。这意味着 Service Worker 的范围将是整个源。换句话说,该服务工作人员将接收该域上所有内容的获取事件。如果我们在 /example/sw.js 注册 Service Worker 文件,那么 Service Worker 将只能看到 URL 以 /example/ 开头的页面(即 /example/page1/、/example/page2/)的 fetch 事件。
在Django中,如何将JS文件放在应用程序的根目录下?目前,服务工作者的范围是:http://127.0.0.1:8000/static/(当我使用 chrome://serviceworker-internals/ 时)
javascript django google-chrome push-notification service-worker