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

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

[复制链接]

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

[复制链接]

12

主题

35

回帖

216

积分

中级会员

积分
216
樱花云主机

12

主题

35

回帖

216

积分

中级会员

积分
216
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

    主题

    767

    回帖

    2758

    积分

    金牌会员

    积分
    2758
    千牛

    78

    主题

    767

    回帖

    2758

    积分

    金牌会员

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

    使用道具 举报

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

    本版积分规则

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

    GMT+8, 2024-11-29 07:43 , Processed in 0.017766 second(s), 2 queries , Gzip On, Redis On.

    Powered by Discuz! X3.5

    © 2001-2024 Discuz! Team.

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