[TOC] #### **1、小程序前端页面** ``` <script type="text/javascript" src="https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.21.js"></script> <!-- 引入百度jssdk --> <script> const isWebView = /swan\//.test(window.navigator.userAgent) || /^webswan-/.test(window.name); //判断是否在百度小程序内 function login() { if(isWebView) { swan.login({ success: res => { var str = JSON.stringify(res); //对象转json 字符串 var json = eval("(" + str + ")"); //字符串转json ,方便获取数值 var code=json.code; //登录成功后，获取code(为后面获取session_key使用) var appid="20347284"; //appid: 百度小程序的appID。不能空【按自己小程序配置填写】 var str = { "code":code, "appid":appid, "title":"获取用户信息", //调用登录时，弹出标题【可自定义修改，不要为空】 "msg":"请单击底部按钮", //调用登录时，弹出提示【可自定义修改，不要为空】 "type":"phone" //phone 和 userinfo 2个数值 }; var datastr=JSON.stringify(str); //因为要把参数传递给小程序，所以这里需要转为字符串 var url_data="/pages/mid_login/mid_login?data="+datastr; swan.webView.navigateTo({url:url_data}); } , fail: err => { } }); } } </script> <button onclick="login()">登录</button> </body> </html> </html> ``` > **说明** > 1若要调用百度登录功能，则可参考上面代码，在自己页面内添加即可 > 2一定要引入百度jssdk ,否则无法调起登录。 > 3上面代码中，标题和提示可自定义修改。已用【】标出 > 4 appid: 添加自己小程序的appID【步骤二图片中标出app_id】 > 5 type= phone,获取用户手机号; type= userinfo ,获取用户昵称，性别(值为 0 时是未知，为 1 时是男性，为 2 时是女性) > 6 type=phone,需要开通申请，进入小程序首页,在左侧导航栏单击“设置 -> 开发设置”。下拉页面，在“获取用户手机号权限申请”中单击“申请开通”。否则可能无法获取用户手机号。 #### **2、后端登录配置** 1、进入小程序列表，找到小程序， 如下图单击进入配置  2、进行配置  3、AppSecret (智能小程序密匙) 参数来源  > **说明** > 1 通知地址是小程序内登录完成后，用户信息(手机号)返回的地址,后续可添加自己的业务逻辑。 #### **3、登录完成后,通知格式** type=phone,返回的数据格式 ``` { "mobile": "18232105186", "openid": "W2FsJR5e86Fiuwpb6683g_3-Mc", "type": "userphone", "time": "2020-11-06 10:56" } ``` type=userinfo,返回的数据格式 ``` { "openid": "W2FsJR5e86Fiuwpb6683g_3-Mc", "nickname": "海洋洋123321", "headimgurl": "https:\/\/himg.bdimg.com\/sys\/portrait\/item\/695abaa3d1f3d1f33132333332315224", "sex": "1", "type": "userinfo", "time": "2020-11-10 11:09" } ``` > **说明** > 1 type=userphone,返回的手机号数据;type=userinfo,返回的用户信息数据 > 2 openid :用户openid ；sex值为 0 时是未知，为 1 时是男性，为 2 时是女性；nickname:用户昵称；headimgurl:用户头像， > 3 若用户未登录或者拒绝授权，会返回默认用户“百度网友”及默认的头像地址。