Forum Discussion

_anomDiebolt_'s avatar
Qrew Elite
7 years ago

Service Worker Travel Log - Day 13

Day 13 - Hip Hip Cheerio!

Let's continue our previous post which dealt with our new Service Worker buddy sw8.js.

Code Page sw8.js

You will notice that our new Service Worker had a line at the top that imported the cheerio.js library:


The reason that we are including this library is because we need to parse the XML response from API_DoQuery and convert it to a JSON response without having access to the DOM or jQuery. Cheerio.js is just a light weight jQuery replacement library that is often used server side (typically with Node) but equally useful within a Service Worker.

Here are some docs about Cheerio.js:


Cheerio.js Github Page

The usage of Cheerio.js within our Service Worker is pretty straightforward and basically is exactly the same as the jQuery solution that used the helper function XMLFlatToObj .

$ = cheerio.load(body);

var data = [];
var record = {};
$("record").each(function() {
  record = {};
  $(this).children().each(function () {
    record[$(this).prop("tagName")] = $(this).text();

The first statement loaded the XML response into the Cheerio object and the rest of the code is exactly the same as the orignal jQuery solution.

The only other thing worth remarking on is how we package up the JSON response. In a nutshell we take the data array obtained from the above script format it as JSON and set the headers of the new Response to indicate we are sending back JSON instead of XML and to not cache the new response:

var newBody = JSON.stringify({records: data}, null, "  ");
return new Response(newBody, {
  headers: {
    'Content-Type': 'application/json',
    'Cache-Control': 'max-age=0'

It is really that simple! In summary, we created a new parameter value &fmt=json  for API_DoQuery and included the conversion code within our Service Worker which will convert the XML response to JSON whenever this API method is used in Table #8.

Your are really going to like our next post as we are going to create a new API from scratch! To make it even more exciting I will take suggestions for what this new API will be named and what it will do. I am going to be out of the office for a few days so if there is some API you want let me know and if it is simple enough I that can make a demo out of it I will.

Next Up: Day 14 - Where No API Has Gone Before

20 Replies


    I hate to mention this but please refrain from commenting or liking my posts in this series for a few hours as I can no longer edit my post if you do this. The hardest part about these posts is getting them formatted in the forum correctly with spelling and grammar checks and sometimes there is a small typo I have to correct or a needed clarification. I wish there was a way to edit your posts but that is the way the admin set things up.
  • You may have noticed we had a lapse in our postings to the Service Worker Travel Log. It is definitely not for lack of content - I am simply very busy with other work. I will probably resume posting early next week.

    But I would like to update you on some other Service Worker information. I have been waiting over a year for Microsoft to support Service Workers in their Edge browser. Well it looks like that will happen with the Windows 10 Update in the Fall and code named the Creators Update (v1703). The announcement will probably come on September 13 at Microsoft�s Edge Web Summit in Seattle. Along with greater support for the Fetch API Microsoft is indicating the Creaters Update will include support for the following features:

    • Enable service workers
    • Enable push notifications
    • Enable background sync
    • Enable service worker cache storage
    Also, I have just given my second Meetup presentation on Service Workers in my home community and this weekend I will be participating in a healthcare hackathon were my team's submission will be using Service Workers with QuickBase to create an off-line first Progressive Web Application using Google's new Workbox framework:
  • The Service Worker Travel Log has been on a bit of a hiatus during the summer as I am super busy but I wanted to pass on the latest good news.

    As previously mentioned we are waiting for Service Workers to land in Edge in September. Meanwhile, the last browser holdout - Safari - has now committed to adding Service Workers to their browser:

    Apple signals it's willing to let next-gen web apps compete with iOS apps
    Service Workers land in WebKit, clearing way for better in-browser applications
  • Service Workers are in Edge Fall Creators Update To Be Released October 17!

    I have been waiting almost two years for this. QuickBase will never be the same!

    Install Windows 10 Insider Preview

    These screenshots are from the Preview Build 16296.0

    All my examples appear to work in this Preview version of Edge. Here is an offline demo that works in Chrome, FireFox, Opera and now Edge:


    It will take me some time to run through all my accumulated QuickBase examples but I don't think there are going to be any major problems.
    • _anomDiebolt_'s avatar
      Qrew Elite
      If you think this Service Worker thingy is some type of wacky idea think again. Cloud providers are now adopting Service Workers so they will operate server-side (as opposed to client-side or in your browsr):

      Introducing Cloudflare Workers: Run JavaScript Service Workers at the Edge

      Utilizing this capability would require QuickBase to host on Cloudflare (they don't) but Cloudflare provides a nice service to demonstrate how a Service Workers operate that is equally informative to demonstrate how the client-side (ie browser) based Service Workers that I am using operate because they use the same Service Worker API.

      Here is a screenshot AND sharable Service Worker built in Cloudflare's Playgound (similar in concept to jsfiddle to some extent) that modifies QuickBase Support Center page by transforming the text "KnowledgeBase" into "The Big Knowledge Base":

      Go ahead and change the replacement text in the code and click the blue Update button:
      let modified = text.replace(
      /KnowledgeBase/g, "Does this Service Worker Thingy Really Work?")
      Don't be shy about chaining anything. Even the most novice QuickBase user should be able to change the text, press the button and stand in awe at the results.

      Again you will not be able to use Cloudflare's Service Worker technology with QuickBase because QuickBase does not their host the domain there. However, the changes you just saw can be achieve with the client-side Service Worker technology built into your browser and hosted in a QuickBase code page.

      We have reached singularity and are now converged - anything is now possible with QuickBase using Service Workers.
    • _anomDiebolt_'s avatar
      Qrew Elite
      I should add that if you navigate around in the right hand panel the QuickBase page will update to whatever link you click on and the Service Worker on the left hand side stays active and continues to perform the substitution for the word "KnowledgeBase". So you will continuously see the table name "KnowledgeBase" change "The Big Knowledge Base" as you navigate because the Serrvice Worker continues to remain in scope.

      Now if the Service Worker were coded to add a <script> tag to every page you would see the effect of that script tag execute on every QuickBase page within the domain.
    • _anomDiebolt_'s avatar
      Qrew Elite

      >Utilizing this capability would require QuickBase to host on Cloudflare (they don't) ...

      There is a bit of a misstatement here and some interesting news. First Cloudflare isn't really a hosting company. Rather they offer more of a unique combination of a CDN and Anycast Service (one IP address, Multiple Servers) in that their primary goal it to accelerate access to a domain and enhance security by connecting to the geographically closest servers among their worldwide network of servers (~100 worldwide).  Read their description here:

      Cloudflare Anycast Explainer

      But the interesting part of this is that apparently QuickBase will be using Clourflare in the near future. I have no further information about this but it does significantly raise the prospect that QuickBase users could gain access to Clourflare Service Workers if QuickBase allowed it at some time in the future.

      In any case you can still use browser bassed Service Workers today in Chrome, FireFox, Opera and shortly in Edge (10/17/17) and the same Service Worker could be used server side via Cloudflare if QuickBase allowed it. This is very speculative but it could certainly play out in the long run.

      Irrespective of all of this, the Clourflare Service Worker playground ( can be used today to safely experiment with using QuickBase with Service Workers without altering your QuickBase application.

      These are extremely interesting developments and I think the long term benefits are enormous for QuickBase despite what appears to be a lot of legacy issues they are working out in their present product development plans.
    • _anomDiebolt_'s avatar
      Qrew Elite
      It is revolutionary and now in all modern browsers. I have been piecemeal using Service Workers in select applications but over the next month I plan on converting every application in my account to using them.
    • _anomDiebolt_'s avatar
      Qrew Elite
      >spinning with the possibilities :)

      QuickBase should be spinning with the possibilities as by employing CloudFlare for their DDOS protection they are now in a position employ CloudFlare Workers which use the same API as Service Workers!