HTTP Cache Behaviour?


#1

My app fetches JSON data from a backend (Google Cloud Storage) using the new Angular 5 HttpClient (from @angular/common/http). I used to add a ‘If-Modified-Since’ header to only transfer new data and get a 304 response if nothing changed, caching the data myself using @ionic/storage.

Now I noticed that, compared to older versions (Ionic 2), the caching behaviour seems to have changed. Even when I remove my caching code and do not set the header explicitly, it is still being set (verified using Chrome dev tools) and I get 304 responses! Something underneath seems to have done the caching, but I can not figure out where.

I have seen that both on Android and in Chrome (MacOS using ‘ionic serve’).

I am wondering now if Ionic / Angular uses some default built-in cache and how to configure it?

My HTTP GET code:

          // var headers = new HttpHeaders();
          // if (cachedBulletin && cachedBulletin.modified) {
          //   console.log('adding header');
          //   headers = headers.append('If-Modified-Since', cachedBulletin.modified);
          // }
          return new Promise((resolve, reject) => {
            this.http.get(url, {
              // headers: headers,    <- USED TO SET THE 'If-Modified-Since' HEADERS HERE
              observe: 'response'
            }).pipe(
              retry(3, 1000),
              timeout(6000)
              ).subscribe((res) => {
                var bulletin = this.processResult(res.body);
                bulletin.modified = res.headers.get('Last-Modified');
                this.storage.set(cacheKey, bulletin);
                resolve(bulletin);
              }, err => {
                // NOTE: cachedBulletin can be null if no cache entry available + no connection
                if (cachedBulletin) {
                  cachedBulletin.offline = (304 !== err.status);
                  console.log('returning cachedBulletin');
                  return resolve(cachedBulletin);
                }
                console.error('Failed fetching bulletin', err);
                return reject(err);
              });
          });

My environment (ionic info):

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.19.0
ionic (Ionic CLI) : 3.19.0

global packages:

cordova (Cordova CLI) : 7.1.0 

local packages:

@ionic/app-scripts : 3.1.2
Cordova Platforms  : android 6.3.0 ios 4.4.0
Ionic Framework    : ionic-angular 3.9.2

System:

Android SDK Tools : 26.1.1
Node              : v8.9.1
npm               : 2.15.12 
OS                : macOS Sierra
Xcode             : Xcode 9.1 Build version 9B55 

Environment Variables:

ANDROID_HOME : /Users/max/Library/Android/sdk

Misc:

backend : legacy

#2

Hi,

I’m wondering the same thing. Did someone gave you an answer ?

Thanks for your response (did you get the joke ? :grin: )


#3

Hi Pierre, nothing so far.