Honesty/home
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(pwa): 优化PWA配置和缓存策略

Browse Source 
- 更新HTML文件中的PWA相关meta标签和图标路径
- 调整Service Worker缓存资源路径为相对路径
- 增强Service Worker fetch事件处理逻辑
- 升级缓存版本号以确保更新生效
- 优化Google Analytics脚本加载方式
- 整理HTML文件结构，提升可读性
This commit is contained in:
hehh
2025-11-25 18:36:52 +08:00
parent f1d4207e35
commit af27d9575b
3 changed files with 93 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
about.html
View File

@@ -450,10 +450,10 @@
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Honesty"> <meta name="apple-mobile-web-app-title" content="Honesty">
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="apple-touch-icon" href="./images/avatar.jpeg">
<!-- Windows PWA支持 --> <!-- Windows PWA支持 -->
<meta name="msapplication-TileImage" content="/images/avatar.jpeg"> <meta name="msapplication-TileImage" content="./images/avatar.jpeg">
<meta name="msapplication-TileColor" content="#6c5ce7"> <meta name="msapplication-TileColor" content="#6c5ce7">
<meta name="msapplication-tap-highlight" content="no"> <meta name="msapplication-tap-highlight" content="no">

126
index.html
View File

@@ -22,7 +22,8 @@
<meta property="og:type" content="website"> <meta property="og:type" content="website">
<meta property="og:url" content="https://www.hehouhui.cn/"> <meta property="og:url" content="https://www.hehouhui.cn/">
<meta property="og:title" content="Honesty的主页 - Java后端 & AI工程师"> <meta property="og:title" content="Honesty的主页 - Java后端 & AI工程师">
<meta property="og:description" content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。"> <meta property="og:description"
content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。">
<meta property="og:image" content="images/avatar.jpeg"> <meta property="og:image" content="images/avatar.jpeg">
<meta property="og:site_name" content="Honesty的主页"> <meta property="og:site_name" content="Honesty的主页">
@@ -30,14 +31,16 @@
<meta property="twitter:card" content="summary_large_image"> <meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.hehouhui.cn/"> <meta property="twitter:url" content="https://www.hehouhui.cn/">
<meta property="twitter:title" content="Honesty的主页 - Java后端 & AI工程师"> <meta property="twitter:title" content="Honesty的主页 - Java后端 & AI工程师">
<meta property="twitter:description" content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。"> <meta property="twitter:description"
content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。来自湖南，现在上海工作，享受在这座充满活力的城市中追求技术梦想。">
<meta property="twitter:image" content="https://www.hehouhui.cn/images/avatar.jpeg"> <meta property="twitter:image" content="https://www.hehouhui.cn/images/avatar.jpeg">
<meta property="twitter:site" content="@Honesty861024"> <meta property="twitter:site" content="@Honesty861024">
<!-- 微信小程序/朋友圈分享 --> <!-- 微信小程序/朋友圈分享 -->
<meta property="wechat:image" content="https://www.hehouhui.cn/images/avatar.jpeg"> <meta property="wechat:image" content="https://www.hehouhui.cn/images/avatar.jpeg">
<meta property="wechat:title" content="Honesty的主页 - Java后端 & AI工程师"> <meta property="wechat:title" content="Honesty的主页 - Java后端 & AI工程师">
<meta property="wechat:description" content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。"> <meta property="wechat:description"
content="我是Honesty，一名充满热情的Java后端开发工程师，专注于AI技术的探索与应用。">
<title>Honesty的主页</title> <title>Honesty的主页</title>
<link rel="stylesheet" type="text/css" href="./css/style.css?version=3"> <link rel="stylesheet" type="text/css" href="./css/style.css?version=3">
@@ -58,7 +61,6 @@
media="all"> media="all">
<!--IE淘汰计划--> <!--IE淘汰计划-->
<script> <script>
if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) window.location.href = "https://imsyy.top/upgrade-your-browser/index.html?referrer=" + encodeURIComponent(window.location.href); if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) window.location.href = "https://imsyy.top/upgrade-your-browser/index.html?referrer=" + encodeURIComponent(window.location.href);
@@ -66,12 +68,7 @@
</head> </head>
<body oncontextmenu=self.event.returnValue=false onselectstart="return false"> <body oncontextmenu=self.event.returnValue=false onselectstart="return false">
<!-- style="background: url(https://blog-file.hehouhui.cn/bj/1.jpg) center center / cover no-repeat rgb(102, 102, 102);" -->
<header id="panel" class="panel-cover"> <header id="panel" class="panel-cover">
<!--星空背景-->
<!-- <canvas id="bg"></canvas>-->
<!--天气-->
<!-- <div id="he-plugin-simple"></div> -->
<script> <script>
WIDGET = { WIDGET = {
"CONFIG": { "CONFIG": {
@@ -376,64 +373,77 @@
</script> </script>
<!-- Google Analytics --> <!-- Google Analytics -->
<script> <script type="text/javascript">
// 定义 gtag 函数作为安全兜底 // 定义 gtag 函数作为安全兜底
<script type="text/javascript"> try {
try { window.dataLayer = window.dataLayer || [];
window.dataLayer = window.dataLayer || [];
function gtag() { function gtag() {
dataLayer.push(arguments); dataLayer.push(arguments);
}
gtag('js', new Date());
} catch (e) {
console.log("Google Analytics Init 错误", e);
} }
</script> gtag('js', new Date());
} catch (e) {
console.log("Google Analytics Init 错误", e);
}
<!-- 再异步加载 Google 的 gtag.js --> </script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-DYWDEVKDP0"></script>
<!-- 可选：继续调用 config --> <!-- 再异步加载 Google 的 gtag.js -->
<script type="text/javascript"> <script async src="https://www.googletagmanager.com/gtag/js?id=G-DYWDEVKDP0"></script>
try {
gtag('config', 'G-DYWDEVKDP0');
} catch (e) {
console.error("Google Analytics config 失败", e);
}
</script>
<script> <!-- 可选：继续调用 config -->
!function(p){"use strict";!function(t){var s=window,e=document,i=p,c="".concat("https:"===e.location.protocol?"https://":"http://","sdk.51.la/js-sdk-pro.min.js"),n=e.createElement("script"),r=e.getElementsByTagName("script")[0];n.type="text/javascript",n.setAttribute("charset","UTF-8"),n.async=!0,n.src=c,n.id="LA_COLLECT",i.d=n;var o=function(){s.LA.ids.push(i)};s.LA?s.LA.ids&&o():(s.LA=p,s.LA.ids=[],o()),r.parentNode.insertBefore(n,r)}()}({id:"3OBGjwDdEIRS7XZ1",ck:"3OBGjwDdEIRS7XZ1"}); <script type="text/javascript">
</script> try {
gtag('config', 'G-DYWDEVKDP0');
} catch (e) {
console.error("Google Analytics config 失败", e);
}
</script>
<!-- PWA注册 --> <script>
<script> !function (p) {
if ('serviceWorker' in navigator) { "use strict";
window.addEventListener('load', function() { !function (t) {
navigator.serviceWorker.register('./js/sw.js') var s = window, e = document, i = p,
.then(function(registration) { c = "".concat("https:" === e.location.protocol ? "https://" : "http://", "sdk.51.la/js-sdk-pro.min.js"),
console.log('SW registered: ', registration); n = e.createElement("script"), r = e.getElementsByTagName("script")[0];
}) n.type = "text/javascript", n.setAttribute("charset", "UTF-8"), n.async = !0, n.src = c, n.id = "LA_COLLECT", i.d = n;
.catch(function(registrationError) { var o = function () {
console.log('SW registration failed: ', registrationError); s.LA.ids.push(i)
}); };
}); s.LA ? s.LA.ids && o() : (s.LA = p, s.LA.ids = [], o()), r.parentNode.insertBefore(n, r)
} }()
</script> }({id: "3OBGjwDdEIRS7XZ1", ck: "3OBGjwDdEIRS7XZ1"});
</script>
<!-- Apple PWA支持 --> <!-- PWA注册 -->
<meta name="apple-mobile-web-app-capable" content="yes"> <script>
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> if ('serviceWorker' in navigator) {
<meta name="apple-mobile-web-app-title" content="Honesty"> window.addEventListener('load', function () {
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> navigator.serviceWorker.register('./js/sw.js')
.then(function (registration) {
console.log('SW registered: ', registration);
})
.catch(function (registrationError) {
console.log('SW registration failed: ', registrationError);
});
});
}
</script>
<!-- Windows PWA支持 --> <!-- Apple PWA支持 -->
<meta name="msapplication-TileImage" content="/images/avatar.jpeg"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="msapplication-TileColor" content="#6c5ce7"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="msapplication-tap-highlight" content="no"> <meta name="apple-mobile-web-app-title" content="Honesty">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<!-- 其他PWA相关meta标签 --> <!-- Windows PWA支持 -->
<meta name="mobile-web-app-capable" content="yes"> <meta name="msapplication-TileImage" content="/images/avatar.jpeg">
<meta name="msapplication-TileColor" content="#6c5ce7">
<meta name="msapplication-tap-highlight" content="no">
<!-- 其他PWA相关meta标签 -->
<meta name="mobile-web-app-capable" content="yes">
</body> </body>
</html> </html>

24
js/sw.js
View File

@@ -1,15 +1,14 @@
// Service Worker for PWA // Service Worker for PWA
const CACHE_NAME = 'honesty-home-v1.0.0'; const CACHE_NAME = 'honesty-home-v1.0.1';
const urlsToCache = [ const urlsToCache = [
'/', './index.html',
'/index.html', './about.html',
'/about.html', './css/style.css',
'/css/style.css', './css/about.css',
'/css/about.css', './css/artalk.css',
'/css/artalk.css', './js/config.js',
'/js/config.js', './js/main.js',
'/js/main.js', './js/about.js'
'/js/about.js'
]; ];
// 安装事件 - 缓存资源 // 安装事件 - 缓存资源
@@ -25,6 +24,11 @@ self.addEventListener('install', event => {
// 获取事件 - 拦截网络请求 // 获取事件 - 拦截网络请求
self.addEventListener('fetch', event => { self.addEventListener('fetch', event => {
// 对于非GET请求或者不是同源请求，直接跳过
if (event.request.method !== 'GET' || !event.request.url.startsWith(self.location.origin)) {
return;
}
event.respondWith( event.respondWith(
caches.match(event.request) caches.match(event.request)
.then(response => { .then(response => {