{"id":45156,"library":"ionic-cache","title":"Ionic Cache","description":"Ionic Cache is a caching service for Angular/Ionic apps that caches HTTP requests, observables, promises, and plain data. Version 6.0.3 is current. It uses Ionic Storage (IndexedDB, SQLite, WebSQL) as the backing store and supports configurable TTL, group invalidation, offline resilience, and delayed observable caching. It ships TypeScript types and requires @angular/common >=9.0.0, @angular/core >=9.0.0, and @ionic/storage-angular >=3 as peer dependencies. Key differentiators: tight Ionic/Angular integration, delayed observable pattern for seamless stale-while-revalidate behavior.","status":"active","version":"6.0.3","language":"javascript","source_language":"en","source_url":"https://github.com/Nodonisko/ionic-cache","tags":["javascript","ionic","cache","ionic-cache","angular2","typescript"],"install":[{"cmd":"npm install ionic-cache","lang":"bash","label":"npm"},{"cmd":"yarn add ionic-cache","lang":"bash","label":"yarn"},{"cmd":"pnpm add ionic-cache","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required as the underlying storage engine for cache persistence.","package":"@ionic/storage-angular","optional":false},{"reason":"Angular peer dependency for injection and module system.","package":"@angular/core","optional":false},{"reason":"Angular peer dependency for common Angular utilities.","package":"@angular/common","optional":false}],"imports":[{"note":"Named export, not default. The library ships TypeScript types.","wrong":"import CacheService from 'ionic-cache'","symbol":"CacheService","correct":"import { CacheService } from 'ionic-cache'"},{"note":"CacheModule is for root import. Common mistake to use wrong package path.","wrong":"import { CacheModule } from '@ionic/cache'","symbol":"CacheModule","correct":"import { CacheModule } from 'ionic-cache'"},{"note":"Type export for configuring request caching options. Available since v4.","wrong":"","symbol":"CacheRequestOptions","correct":"import { CacheRequestOptions } from 'ionic-cache'"}],"quickstart":{"code":"import { NgModule } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\nimport { HttpClientModule } from '@angular/common/http';\nimport { IonicStorageModule } from '@ionic/storage-angular';\nimport { CacheModule, CacheService } from 'ionic-cache';\nimport { AppComponent } from './app.component';\n\n@NgModule({\n  declarations: [AppComponent],\n  imports: [\n    BrowserModule,\n    HttpClientModule,\n    IonicStorageModule.forRoot(),\n    CacheModule.forRoot({ keyPrefix: 'my-app-cache' })\n  ],\n  bootstrap: [AppComponent]\n})\nexport class AppModule { }\n\n// In a component/service:\nimport { Component } from '@angular/core';\nimport { HttpClient } from '@angular/common/http';\n\n@Component({ selector: 'app-root', template: '' })\nexport class AppComponent {\n  constructor(private http: HttpClient, private cache: CacheService) {\n    this.cache.setDefaultTTL(60 * 60); // 1 hour\n    const url = 'https://api.example.com/data';\n    const request = this.http.get(url);\n    this.cache.loadFromObservable('data-key', request).subscribe(data => {\n      console.log('Cached data:', data);\n    });\n  }\n}","lang":"typescript","description":"Shows full Angular module setup with CacheModule.forRoot and ionic-storage-angular, then basic HTTP request caching using CacheService.loadFromObservable."},"warnings":[{"fix":"Set a keyPrefix in CacheModule.forRoot({ keyPrefix: 'my-app-cache' }) to scope cache entries.","message":"clearAll() clears Ionic Storage entirely if no keyPrefix is set.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Pass a config object even if empty: CacheModule.forRoot({}).","message":"CacheModule.forRoot() without any arguments is deprecated.","severity":"deprecated","affected_versions":">=4.0.0"},{"fix":"For background refresh, use cache.loadFromDelayedObservable(cacheKey, request, group, ttl, 'all') instead.","message":"loadFromObservable returns cached data immediately and does NOT refetch in background; use loadFromDelayedObservable for stale-while-revalidate.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Upgrade to Angular 9 or later.","message":"Angular 9+ required; older versions of Angular not supported.","severity":"breaking","affected_versions":">=6.0.0"},{"fix":"Use descriptive, unique cache keys (e.g., URLs with query parameters).","message":"Cache keys must be unique per entry; collisions overwrite silently.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use the new signature: loadFromDelayedObservable(key, request, options) where options includes delayType.","message":"The 'delayType' parameter in loadFromDelayedObservable is deprecated in favor of a single config object.","severity":"deprecated","affected_versions":">=5.0.0"}],"env_vars":null,"search_vec":"'3':60 '6.0.3':22 '9.0.0':55,57 'angular/common':54 'angular/core':56 'angular/ionic':10 'angular2':85 'app':11 'back':34 'behavior':78 'cach':2,4,7,13,47,81,84 'configur':38 'current':24 'data':20 'delay':45,69 'depend':63 'differenti':65 'group':40 'http':14 'indexeddb':29 'integr':68 'invalid':41 'ionic':1,3,27,80,83 'ionic-cach':82 'ionic/angular':67 'ionic/storage-angular':59 'javascript':79 'key':64 'observ':16,46,70 'offlin':42 'pattern':71 'peer':62 'plain':19 'promis':17 'request':15 'requir':53 'resili':43 'revalid':77 'seamless':73 'servic':8 'ship':49 'sqlite':30 'stale':75 'stale-while-revalid':74 'storag':28 'store':35 'support':37 'tight':66 'ttl':39 'type':51 'typescript':50,86 'use':26 'version':21 'websql':31","created_at":"2026-06-07T12:53:38.117814+00:00","updated_at":"2026-06-07T12:53:38.117814+00:00","problems":[{"fix":"Run: npm install @ionic/storage-angular (or yarn add @ionic/storage-angular).","cause":"Missing peer dependency @ionic/storage-angular.","error":"Error: Can't resolve '@ionic/storage-angular' in '...'"},{"fix":"Always provide a non-empty string as the first argument to loadFromObservable.","cause":"Calling loadFromObservable with empty or undefined cacheKey.","error":"Attempted to load from observable but no key provided"},{"fix":"Ensure IonicStorageModule.forRoot() is imported in AppModule, and CacheService is used after app initialization.","cause":"Ionic Storage not initialized before CacheService usage.","error":"TypeError: Cannot read property 'get' of undefined"},{"fix":"Use HttpClient from '@angular/common/http' which auto-parses JSON. If using plain fetch, parse manually.","cause":"JSON response not parsed; cache returns raw string.","error":"Data: [object Object]"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/Nodonisko/ionic-cache#readme","github":"https://github.com/Nodonisko/ionic-cache","docs":null,"changelog":null,"pypi":null,"npm":"ionic-cache","openapi_spec":null,"status_page":null,"smithery":null,"categories":["storage"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}