Web App Install Banners简介

移动端,web和native app有一个比较大的区别:访问的过程。

以一个“标准”的访问流程为例:

web:用户打开一个第三方程序,比如浏览器、微信。如果是浏览器,则需要用户在地址栏里输入内容,比如:cloud.tencent.com,浏览器中显示这个站点。用户完成访问。当他再次访问的时候,大多数用户仍然需要重复这一过程,当然有经验的用户会使用书签或者利用浏览器的功能保存到一个很丑快捷入口到主屏幕。

app:用户打开一个第三方程序,比如app store,下载,安装到主屏幕,完成,使用。再次访问的时候,只需在主屏幕找到app的图标即可。这个过程是所有用户都如此,就算是第一次使用智能手机的用户也会。

这里就产生一个问题,在移动端潮流中,web的回访性就天然的低于app,因为访问的成本实在是太高了。

好在,google推出了一个技术Progressive Web Apps,他是几个技术的集合。以后慢慢介绍,先介绍一个最常用的:web app install banners。如下图:

要触发一个安装,需要满足下面的条件:

要有一个web app manifest,并且要配置好必须的字段:

  • short_name (主屏幕上的名字)
  • name (banner上的名字)
  • 192x192 png icon (图标的声明必须包含mime类型 image/png)
  • start_url 点击图标访问的地址

网站上要注册一个service worker

必须是https

至少访问两次,且两次间隔不小于5分钟

谷歌提供了一个测试工具lighthouse,可以在chrome扩展里面查找并且安装,然后在Devtools中的application中看到。点击Manifest,然后再点击Add to homescreen。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏中国白客联盟

利用超长命令绕过sysmon

Sysmon是容易下载安装使用的日志审计应用,每个人都可以查看sysmon记录的内容。这些日志被EDR获取的话,能够在这些产品中看到一连串“有趣的东西”。

765
来自专栏ytkah

发现一个小技巧:火狐浏览器对phpmyadmin支持更友好

  这段时间ytkah正在迁移服务器(A→B),为了方便起见,直接用phpmyadmin导入数据库。一般我们是用navicat来操作数据库的,但是服务器A设置了...

2755
来自专栏青枫的专栏

Github全面学习笔记

==================================================== 如何创建分支branch?   分支可以方便同时处理...

1012
来自专栏飞雪无情的博客

Android Gradle实用技巧(一) | 隐藏Android签名文件和密钥信息

Gradle是一款非常优秀的构建系统工具,它使用可以配置的DSL语言描述构建流程,同时允许我们使用原生的Java和Groovy编码的方式进行构建,所以相比Ant...

701
来自专栏诸葛青云的专栏

这份Python标准异常表 你应该了解!

异常即是一个事件,该事件会在程序执行过程中发生,影响了程序的正常执行。一般情况下,在Python无法正常处理程序时就会发生一个异常。异常是Python对象,表示...

170
来自专栏DevOps时代的专栏

Hygieia 为何物?DevOps 利器也

一、前言碎语 Hygieia是什么? Capitalone(全美十大银行之一)开源的DevOps利器。 使用Hygieia后,在整个软件开发周期中,用户可以选择...

3136
来自专栏数据和云

数据恢复:如何恢复Linux中意外删除的Oracle和MySQL数据库

张乐奕 云和恩墨副总经理,Oracle ACE总监,ACOUG 联合创始人 没有删除过数据库的DBA职业生涯是不完整的,删除过数据库还能幸存的DBA一定是订阅...

2816
来自专栏玩转JavaEE

SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题(一)

当前后端分离时,权限问题的处理也和我们传统的处理方式有一点差异。笔者前几天刚好在负责一个项目的权限管理模块,现在权限管理模块已经做完了,我想通过5-6篇文章,来...

3905
来自专栏FreeBuf

巡风风险扫描开源系统的一些演变

同程SRC团队开源巡风资产风险控制系统也有一段时间了,我们临时用它作为一个简单的soc平台来使用,期间也做了一些定制化开发,此次分享,权当做个笔记吧。基于巡风我...

1022
来自专栏SDNLAB

SDNLAB技术分享(五):浅谈Open vSwitch移植

前一段时间自己私下一直学习Open vSwitch。起初学习Open vSwitch的目的,只是为了更好的学习OpenFlow协议,然而当我看到Open vSw...

3599

扫码关注云+社区