您当前的位置:首页 >> 拉丁舞
黑科技!无需改动小程序,点击劫持法搞定推送能力!
发布时间:2019-08-08
 

关注学习小程序黑科技!


点击劫持,这可不是一个褒义词!

以前,经常会用在网页广告上,有些恶意广告会经常劫持用户的网页,导致用户点击之后没得到自己想要的反馈,却弹出了恶意的广告地址!

但是!这是一把双刃剑!

利用得好,我们可以发挥出意想不到的效果!

在这里,我个人独创研发了一种新型的推送凭证收集方式,在不影响用户体验的情况下,让开发者顺利获取到用户的推送凭证,从而达到为用户下发推送消息,提高存留率的效果!



组件说明

继上一篇我们推出了个一分钟集成推送的SDK组件(vpush-checkin)之后,我们这次又大开了个脑洞,推出了全新的SDK组件:vpush-hijack

正如上边所说的点击劫持,这个组件,也采用了一样的原理!

当然,这对于用户是没半点影响、对开发者却是大大有益的!


为什么这么说呢?


以往的收集推送凭证方式,是在开发者创建一个form和button的情况下,通过用户点击后触发report-submit函数才能收集到formId。

这样还得处理样式、formId收集处理等繁琐的操作,浪费过多时间严重影响开发进度



所以,我们为什么不在不改动小程序界面的情况下,加上一个透明的推送凭证收集组件,用户点击后,既能收集到推送凭证,又能触发用户的下一步点击操作,达到一举两得的效果呢

所以,hijack点击劫持黑科技来了!

轻松让你在自己的小程序里不改动代码即可加入强大的推送能力!


使用组件

首先获取最新的SDK,地址:

https://github.com/guren-cloud/vpush-pro-sdk


如果你已经安装过,请直接更新。更新方法:

1. 重新下载覆盖sdk,

2. 进入sdk目录,git pull更新


SDK目录结构如下:



我们初始化vPush后,在需要安装点击劫持的页面的json配置文件,引入vpush-hijack组件:



然后直接就可以直接在wxml文件里边配置使用这个组件啦!


配置组件

组件默认属性为绝对定位,全屏覆盖,完全透明,用户无发觉

不过如果你打算只在某一个地方(如按钮、卡片)上进行安装这个劫持层(这样可以提升用户体验,比如滑动效果等不会影响),那么就可以通过配置,来让这个劫持层放置在任何位置上。


vpush-hijack组件支持如下属性配置:

  1. width,宽度,默认100%

  2. height,高度,默认100%

  3. top,顶部距离,默认0

  4. left,左边距离,默认0

  5. debug,是否开启调试,开启后你会看到劫持层,关闭后会透明隐藏,上线前请关闭!

  6. style,自定义样式,一般不用设置


默认的,会是全屏覆盖,我们直接在页面引入这个组件即可,如:



使用效果

使用后,用户是看不到任何界面改动的,点击后也会触发我们设置的操作。

这样在交互体验上完全没有影响,轻松收集到推送凭证!


如,我在一ONE小程序里设置了卡片覆盖劫持层,默认情况如下:



用户在点击卡片(覆盖层红色区域,我这里开了debug所以会显示,便于测试)后,会触发我们的操作。

这里我的操作是展开卡片详情,点击后的操作效果:



点击后,卡片展开了,也同时收集到了我们的推送凭证,一举两得!


体验尝试

如果这个方法能帮到你,那我由衷高兴!

代码已经开源,你完全可以直接拿来用或者修改成适合自己的版本!

轻松集成小程序推送功能,就上古人云开发平台!


官网:

https://mssnn.cn

SDK:

https://github.com/guren-cloud/vpush-pro-sdk



关注学习小程序黑科技!