找回密码
 立即注册
CeraNetworksBGVM服务器主机交流会员请立即修改密码Sharktech防护
查看: 23|回复: 1

(教程)给你的网站添加渐进式网络应用,让用户可以直...

[复制链接]

12

主题

34

回帖

212

积分

中级会员

积分
212
发表于 2024-10-4 19:13:31 | 显示全部楼层 |阅读模式
本帖最后由 樱花云主机 于 2024-10-4 19:14 编辑

(教程)给你的网站添加渐进式网络应用,以便于用户直接将网站安装到桌面

1.效果演示
移动端
(部分国产浏览器可能不支持)edge,chrome 均支持






PC端
(部分国产浏览器可能不支持)edge,chrome 均支持






2.开始添加
所需要的文件
[ol]
  • https://www.123684.com/s/E4XTjv-8ywZ3[/ol]复制代码
    下载到网站根目录然后解压,有的程序可能要放在主题文件的根目录。

    开始之前你是按照你的需求进行修改manifest.json



    修改之后需要删除注释



    保存


    3.解压完成之后编辑首页文件[/h2]
    在head标签中添加(文件路径需要替换为你实际的文件路径):
    [ol]
  • [/ol]复制代码




    滑到文件末尾添加以下代码(你的文件路径需要替换为你实际的文件路径):
    [ol]
  •   if ('serviceWorker' in navigator) {
  •     window.addEventListener('load', function() {
  •       navigator.serviceWorker.register('你的文件路径/service-worker.js').then(function(registration) {
  •         console.log('ServiceWorker registration successful with scope: ', registration.scope);
  •       }, function(error) {
  •         console.log('ServiceWorker registration failed: ', error);
  •       });
  •     });
  •   }
  • [/ol]复制代码




    最后
    我们刷新一下页面,就可以看到浏览器旁边多了一个按钮



    原文地址 https://www.sakuraidc.cc/forum-post/1396.html
  • 本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有账号?立即注册

    ×
    回复

    使用道具 举报

    78

    主题

    766

    回帖

    2754

    积分

    金牌会员

    积分
    2754
    发表于 2024-10-4 19:58:29 | 显示全部楼层
    谢谢,涨知识了,后面玩玩看
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    Archiver|手机版|小黑屋|HS2V主机综合交流论坛

    GMT+8, 2024-11-19 03:50 , Processed in 0.054876 second(s), 5 queries , Gzip On, Redis On.

    Powered by Discuz! X3.5

    © 2001-2024 Discuz! Team.

    快速回复 返回顶部 返回列表