要在umi搭建的React后台系统中实现PWA应用，可以遵循以下步骤：
-
创建一个service worker文件，其中包含缓存策略和离线支持逻辑。这个文件可以使用workbox或者sw-precache等工具自动生成。
-
在入口文件index.js中注册service worker，并开启PWA支持。可以使用workbox-webpack-plugin或者umi-plugin-sw等插件来完成这个步骤。
-
添加PWA所需的meta标签和manifest.json文件。manifest.json文件描述了应用的名称、图标、主题色等元信息，并且可以通过添加到主屏幕的方式启动应用。
-
对于需要缓存的资源，可以在service worker文件中定义缓存策略。比如，可以将静态资源（JS、CSS、图片等）缓存下来，在离线时可以直接从缓存中读取。
-
实现基本的离线支持逻辑，使用户在离线状态下也能够访问之前访问过的页面和数据。可以在service worker中监听fetch事件，并在离线时返回之前缓存的内容。
以上是在umi搭建的React后台系统中实现PWA应用的基本步骤。需要注意的是，不同的项目可能会有一些差异，具体实现还需要根据项目的具体情况进行调整。
service worker缓存的资源放在哪里？
Service Worker缓存的资源通常被放置在浏览器中的Cache Storage（缓存存储）中。
Cache Storage是一种专门为Service Worker提供的高效、可靠的缓存机制，用于存储应用程序的离线资源。它与传统的浏览器缓存不同，因为它可以通过JavaScript进行控制，而不仅仅局限于浏览器自身的逻辑。
要使用Cache Storage，在Service Worker脚本中需要通过caches API进行访问和管理。您可以将需要缓存的文件列表放入一个数组中，并使用cache.addAll()方法将这些文件添加到Cache Storage中。在之后的请求中，Service Worker会从Cache Storage中获取已缓存的资源并返回给客户端，而不必再向服务器发起请求。
需要注意的是，由于Cache Storage是针对服务工作者的，因此在一些老版本的浏览器（如IE）中可能不受支持。
