social-login2.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
  6. <title>社交登陆测试页</title>
  7. <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
  8. </head>
  9. <body>
  10. <div>点击如下按钮,授权登录</div>
  11. <div>
  12. 手机号<input id="mobile" value="15601691300"><br>
  13. 手机验证码<input id="smsCode">
  14. <button id="send_sms_code">发送手机验证码</button>
  15. <br>
  16. <button id="wx_pub">微信公众号授权登录</button>
  17. </div>
  18. </body>
  19. <script>
  20. // let server = 'http://127.0.0.1:48080';
  21. let server = 'http://192.168.1.2:48080';
  22. let type = 31; //登录类型 微信公众号
  23. // 微信公众号
  24. $("#wx_pub").on("click", function () {
  25. let code = getUrlParam("code"); // 访问授权连接后,会回调本页面地址,参数在本页面url后面
  26. let state = getUrlParam("state");
  27. console.log("获取code: " + code + ", state: " + state)
  28. let data = {
  29. 'mobile': $('#mobile').val(),
  30. 'smsCode': $('#smsCode').val(),
  31. 'code': code,
  32. 'state': state,
  33. 'type': type
  34. }
  35. // 调用授权登录接口
  36. $.ajax({
  37. url: server + "/app-api/social-login2",
  38. method: 'POST',
  39. data: JSON.stringify(data),
  40. contentType: "application/json;charset=utf-8",
  41. dataType: "json",
  42. success: function( result ) {
  43. if (result.code !== 0) {
  44. alert('调用授权登录接口失败,原因:' + result.msg)
  45. return;
  46. }
  47. alert("授权登录成功, token: "+result.data.token)
  48. }
  49. })
  50. });
  51. // 发送手机验证码
  52. $("#send_sms_code").on("click", function () {
  53. let data = {
  54. 'mobile': $('#mobile').val(),
  55. 'scene': 1 // 手机号登陆 类型
  56. }
  57. $.ajax({
  58. url: server + "/app-api/send-sms-code",
  59. method: 'POST',
  60. data: JSON.stringify(data),
  61. contentType: "application/json;charset=utf-8",
  62. dataType: "json",
  63. success: function (result) {
  64. if (result.code !== 0) {
  65. alert('发送手机验证码失败,原因:' + result.msg)
  66. return;
  67. }
  68. alert("发送成功, 请查看日志");
  69. }
  70. })
  71. })
  72. //获取url中的参数
  73. function getUrlParam(name) {
  74. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
  75. var r = window.location.search.substr(1).match(reg); //匹配目标参数
  76. if (r != null) return unescape(r[2]);
  77. return null; //返回参数值
  78. }
  79. </script>
  80. </html>