rohow
89 行
2.7 KiB
JavaScript
89 行
2.7 KiB
JavaScript
'use strict'
|
|
|
|
// Service Worker 配置 - 默认值
|
|
let config = {
|
|
cdnUrl: 'https://cdn.fillcode.com/',
|
|
serviceWorkerUrl: '/__static/sw-cdn.js',
|
|
staticRegex: /(.*\.(css|js|png|jpg|jpeg|gif|svg|webp|ico|woff|woff2|ttf|eot)|avatars[^/]+)$/,
|
|
debug: false,
|
|
}
|
|
|
|
// 监听配置更新消息
|
|
self.addEventListener('message', e => {
|
|
if (e.data.type !== 'CONFIG') return
|
|
|
|
config = e.data.config
|
|
|
|
if (config.debug) console.log('PWA-CDN: Config updated', config)
|
|
})
|
|
|
|
// 拦截网络请求
|
|
self.addEventListener('fetch', e => {
|
|
const url = new URL(e.request.url)
|
|
|
|
// 如果请求不是GET方法，直接返回
|
|
if (e.request.method !== 'GET') return
|
|
|
|
// 如果请求的域名不是当前页面的域名
|
|
if (url.origin !== self.location.origin) return
|
|
|
|
// 过滤__static路径下的请求
|
|
if (url.pathname.startsWith('/__static/')) return
|
|
|
|
// 如果请求的路径不匹配静态资源正则表达式，直接返回
|
|
if (!config.staticRegex.test(url.pathname)) return
|
|
|
|
// 判断是否是强制需要同源请求
|
|
const requiresSameOrigin = ['worker', 'sharedworker', 'serviceworker'].includes(e.request.destination)
|
|
|
|
// 如果是强制需要同源请求的资源类型，直接返回
|
|
if (requiresSameOrigin) return
|
|
|
|
// 开始处理静态资源请求
|
|
e.respondWith(handleStaticResource(e.request, url))
|
|
})
|
|
|
|
// 处理静态资源请求
|
|
async function handleStaticResource(request, url) {
|
|
// 生成CDN子路径
|
|
const hostname = self.location.hostname
|
|
const cdnPath = hostname.replace(/\./g, '-')
|
|
|
|
const targetUrl = config.cdnUrl + cdnPath + url.pathname + url.search
|
|
|
|
if (config.debug) console.log('PWA-CDN:', url.href, '->', targetUrl)
|
|
|
|
try {
|
|
// 创建新请求
|
|
const newRequest = new Request(targetUrl, {
|
|
...request,
|
|
mode: 'cors',
|
|
redirect: 'error',
|
|
})
|
|
|
|
// 请求目标域名，浏览器会自动处理缓存
|
|
const response = await fetch(newRequest)
|
|
|
|
// 检查响应状态
|
|
if (!response.ok) throw new Error('PWA-CDN: Non-2xx response detected')
|
|
|
|
return response
|
|
} catch (error) {
|
|
if (config.debug) console.warn('PWA-CDN: Fallback to original request for', url.href, error)
|
|
|
|
// 失败时回退到原始请求
|
|
return fetch(request)
|
|
}
|
|
}
|
|
|
|
// Service Worker 生命周期
|
|
self.addEventListener('install', () => {
|
|
if (config.debug) console.log('PWA-CDN: Service Worker installing')
|
|
self.skipWaiting().catch(console.error)
|
|
})
|
|
|
|
self.addEventListener('activate', () => {
|
|
if (config.debug) console.log('PWA-CDN: Service Worker activated')
|
|
self.clients.claim().catch(console.error)
|
|
})
|