Tevin Joseph K O Tevin Joseph K O - 2 months ago 18
Javascript Question

Implementing push notification using chrome in Django

I have learned to implement push notifications for a Web Application using chrome https://developers.google.com/web/updates/2015/03/push-notifications-on-the-open-web?hl=en and successfully ran the sample code mentioned in the blog.

Unfortunately, I couldn't replicate the success with Django. It never goes into the ready method of the service worker,(navigator.serviceWorker.ready.then) ie, the service worker is never ready.

As per http://www.html5rocks.com/en/tutorials/service-worker/introduction/


One subtlety with the register method is the location of the service
worker file. You'll notice in this case that the service worker file
is at the root of the domain. This means that the service worker's
scope will be the entire origin. In other words, this service worker
will receive fetch events for everything on this domain. If we
register the service worker file at /example/sw.js, then the service
worker would only see fetch events for pages whose URL starts with
/example/ (i.e. /example/page1/, /example/page2/).


In Django, how to put a JS a file under root of the application? Currently,scope of the service worker is: http://127.0.0.1:8000/static/ (When I use chrome://serviceworker-internals/)

Answer

Follow this method...

  • put the sw.js file in template folder
  • configure view to serve as static file

    #urls
    url(r'^sw(.*.js)$', views.sw_js, name='sw_js'),
    
    #views
    from django.views.decorators.cache import never_cache
    from django.template.loader import get_template
    @never_cache
    def sw_js(request, js):
        template = get_template('sw.js')
        html = template.render()
        return HttpResponse(html, content_type="application/x-javascript")