Search⌘ K
AI Features
Home
Courses
Building Real-Life Applications with Blazor WebAssembly

Using the CacheStorage, Geolocation, and OpenWeather One Call APIs

Explore how to integrate the CacheStorage API for offline caching, use the Geolocation API to obtain device coordinates, and call the OpenWeather One Call API to fetch local weather data. This lesson guides you through using these web APIs within a Blazor Progressive Web App to build a robust weather application.

We'll cover the following...

Using the CacheStorage API

The CacheStorage API is used to cache request/response object pairs where the request objects are the keys and the response objects are the values. It was designed to be used by service workers to provide offline functionality. A caches object is an instance of CacheStorage. It is a global object that is located in the window object. We can use the following code to test if it is available on the browser:

C++
const hasCaches = 'caches' in self;

A caches object is used to maintain a list of caches for a particular web app. Caches cannot be shared with other web apps and they are isolated from the browser’s HTTP cache. They are entirely managed through the JavaScript that we write.

These are some of the methods of CacheStorage:

  • delete(cacheName): This method deletes the indicated cache and returns true. If the indicated cache is not found, it returns false.
  • has(cacheName): This method returns true if the indicated cache exists, and false otherwise.
  • keys: This method returns a string array of the names of all of the caches.
  • open(cacheName): This method opens the indicated cache. If it does not exist, it is created and then opened.

When we open an instance of ...