最近在制作微信登录接口时候踩了才少坑,下面做一个笔记,接入之前,首先要理解使用微信登录的常有的两种应用场景:
场景1、只限于在微信客户端打开的网页应用,比如在公众号菜单点击,直接打开某个页面;或在微信消息列表直接给好友发送一个网页的URL,用户收到直接点击URL直接打开页面。
场景2、用户在 PC 电脑 浏览器 打开页面,页面呈现一个二维码,用户使用手机微信扫一扫,确认登录后,网页自动跳转到登录后的页面。
针对以上两种场景,需要注意的是,移动端和PC端所请求的页面URL域名可能不一样,因为根据PC端和移动端屏幕的特性,网页开发者需要针对不同的客户端开发显示不同的view,甚至还分开部署在不同的域名下。
比如,PC端版本部署在一级域名下http://www.domain.com;移动端版本部署在二级域名下http://mobile.domain.com。(当然,其实你只需要申请、备案一级域名domain.com即可,二级域名(可多个)是你自行在 服务端 分配,这方面的知识请问度娘)
理解了这些,接下来的首要工作是在微信公众号、微信开放平台各自配置网页授权URL,你可能会问:“为什么要在两个地方配置不同的URL?”,这是因为上面所说的两种不同场景和不同场景部署到了不同的域名下(一级、二级)。
配置操作如下:
微信公众号平台。登录后,开发》接口权限》网页授权-修改
在下面找到网页授权域名,点击设置
踩坑1:
只需填写域名,不需要http://,假如 手机端访问 的域名是二级域名,只需填写:mobile.domain.com
微信开放平台。登录》管理中心》网站应用(如果没有,需先创建,需要几天的审核时间),
点击查看》应用详情,在下面有个授权回调域,点击修改。
这里配置的是PC端访问的域名,不需要http://,假如是一级域名,只需输入:domain.com
以上配置过程,描述需注意的细节就是坑2;配置好后,打开网页,很可能提示以下错误:
踩坑2:
因为你在代码里给参数 redirect_uri 赋值错误,值一定要带上http://,然后还需要对URL编码格式,比如URL.encode("http://domain.com")。这里不需要加www.