当用户进入微信小程序登陆时,会出现一个登录界面,比如获取用户用户头像和昵称等,这些在微信小程序开发者而言,是可以获取用户数据的,下面就为大家介绍小程序各种姿势实现登录的方法
本文的小程序登录指的是什么?
在本篇文章所讲的登录不仅仅指的是wx.login而是包括以下三点--
用户头像和昵称对于我们开发小程序几乎算是刚需,那么我们应该怎么样正确高效的获取&利用它们呢?
使用open-data时需要注意小程序基础库的版本。具体使用方式如下
其实可以将open-data看作图片或字符串,想要控制样式在外层加上view标签以及相应的class即可。
相比之前获取用户基本信息的方式,这个方案还是比较走心的,如果一些小程序只是对用户的头像昵称等基本信息有需求的话就不需要和以前一样大费周章的调一个getUserInfo,拿回来一堆用不上的东西。
按照微信小程序的文档,能在服务器端完成登录(获取用户session_key/openid等),有三个前端传回的参数是必不可少的:
code是通过wx.login获取的,而encryptedData & iv是从wx.getUserInfo中获取的。
但是,因为微信基础库更新,取消通过api调用getUserInfo的能力,需要使用button组件的开放能力[open-type]去调用getUserInfo方法。
上述获取数据的方法具体建议阅读官方文档:
有关getUserInfo的文档
有关login的文档
踩坑心得:请确保wx.login早于getUserInfo,不仅是代码执行层面的早,最好是login回调成功之后才去getUserInfo,不然可能会出现后端解密失败的情况,导致登录失败。
(还可以通过API方式调用getUserInfo的时候如何实现后端登录就不在此赘述了。)
总体来说有两种授权模式,一种是强制授权,另一种则是按需授权,无论是怎么样的流程基本都可以归类为这两种授权。
适用范围:对用户身份强依赖的小程序,用户一进来就必须要知道用户的相关信息,或者是用户一进来就必须根据用户id来拉取相关资源。
授权模式:模式多种,但共同特点都是会打断用户正常进入小程序的流程,体验上有点瑕疵,在此列出两种模式:
这种方案的实现方式其实很简单也很粗暴--将一个覆盖全屏的button组件以position: fixed的方式盖在需要这样登录的页面上,然后将其opacity设为0即可。
就个人而言,还是比较喜欢这种授权模式的,和微信自己生态内的授权有些许相似,对用户来说不会那么突兀。
具体实现方式--相比上一种就复杂一些了,这一种方式属于全局性质的拦截授权,会中断当前页面的所有动作,跳转至登录专用的页面,在登录页登录成功后再返回原页面。
适用范围:对用户身份规划十分明确、可以接受在用户做出某些动作之后再获取用户身份的小程序。
授权模式:不会打断小程序页面的主流程,将授权加入主流程中。实现方式也是十分灵活,无论是列表或是图片甚至是一段文字,只要是需要用户手动触发的,都可以作为授权的发起时机。
与上述强制授权中不跳转页面的方式类似,但是有一个巨大的差异--这种方式不会强制用户授权,而是在需要授权时才会出现,相对没有这么骚扰使用小程序的用户。
以上就是微信小程序登录授权界面如何开发 ,更多小程序开发文档可以关注网站。
小程序工具提供多类型商城/门店小程序制作,可视化编辑 1秒生成5步上线。通过拖拽、拼接模块布局小程序商城页面,所看即所得,只需要美工就能做出精美商城。更多小程序请查看:小程序商店
KESION 科汛软件
KESION 科汛软件是国内领先的在线教育软件及私域社交电商软件服务提供商,长期专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。
公司核心产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化独立部署品牌网校和在线教育咨询等。KESION 不断通过技术创新,提供产品和服务,助力企业向数字化转型,通过科技驱动商业革新,让商业变得更智慧!
唱吧app是一款K歌社交软件,通过近几年的成长迅速成为一款现象级产品,不过前段时间,唱吧正式推出官方的“唱吧K歌”小程序,将app的基本功能完全挪到了小程序上。并且上线4天,...
有的微信小程序开发者在做小程序时,使用到了 textarea这个小程序组件,然后点击页面上的某个元素,会触发页面弹起一个弹窗,这时发现 textarea的 placeholder文字或者输入的文字内容