乐趣区

关于微信授权后底部白条问题

 最近在做关于微信公众号 H5 页面开发,发现了一个微信“恶心”的底部白条,严重影响了用户的体验。查阅了很多资料,本人项目使用了 vue 单页面开发,页面间调整直接使用 this.$router.replace 的做法可以很完美地解决微信底部白底的问题。项目中涉及到了通过微信授权的方式进行获取用户信息以及实现用户的自动登录功能,然而以为 this.$router.replace 做法可以完美不留底部白底的时候,竟然出现了“恶心”的底部白条。思考问题所在:当进入了 Html 页面后会向后台请求授权,授权后页面将重定向,此时将会出现一个底部白条,不管你如何操作,“顽固”白条依然存在。处理问题的考虑:是否能够不进入 html 的情况下先行进行授权处理,授权处理完毕后才进入 html 页面 (就是在此之前不进入 html 页面)

 参考公众号开发的授权过程:

微信授权的其中一种方式(授权地址):scope 为 snsapi_base
https://open.weixin.qq.com/co…

 把 redirect_uri 中写入需要微信授权后重定向的页面,这样一来,通过上面的授权地址,点击后会先到微信授权,授权成功后才会进行我们设置在 redirect_uri 中的页面,此时并未出现任何的白条

至此,授权完成后导致的底部白条不再出现。

退出移动版