网页手机号抓取程序(手机登录成功后实现过程跳转到编写的用户信息页面实现源码下载)
优采云 发布时间: 2022-02-24 19:21网页手机号抓取程序(手机登录成功后实现过程跳转到编写的用户信息页面实现源码下载)
登录成功后的实现流程
由于使用代码登录时必须使用公网url进行开发，所以先使用内网穿透工具将本地项目穿透到外网。
推荐使用：NATAPP——内网穿透：
查看教程以了解具体用法：
创建一个项目来写代码
使用的工具
实现登录的原理是使用ajax调用码登录获取登录二维码相关接口：（即我们创建应用时生成的secretKey），获取登录服务器提供的qrCodeReturnUrl在代码上。使用二维码生成工具生成二维码后台编写界面，信息为qrCodeReturnUrl，判断是否获取到用户信息。前端生成二维码后，进行ajax轮询，发送请求询问后端是否获取到用户信息。如果没有，则表示没有人扫描二维码并继续投票。如果获取到，则结束 Ajax 轮询。将二维码设置为过期不再使用。结束投票，
首页
window.location.href = "/login"
二维码
body {
background: #095f88;
}
/* 登录字体 */
.text {
color: cornsilk;
text-align: center;
margin-top: 50px;
opacity: 0.7;
}
/* 二维码 */
#output {
margin: 50px auto;
width: 360px;
padding: 0;
opacity: 0.8;
}
请使用微信进行扫码登录
$.ajax({
type: "get",
url: "https://server01.vicy.cn/8lXdSX7FSMykbl9nFDWESdc6zfouSAEz/wxLogin/tempUserId?secretKey=62320bcb05f4428ca8b13c462e104777",
data: "data",
async: false,
dataType: "json",
success: function (response) {
// console.log('response :>> ', response);
qrCodeReturnUrl = response.data.qrCodeReturnUrl;
}
});
console.log(qrCodeReturnUrl)
$('#output').qrcode({
text: qrCodeReturnUrl, // 二维码的内容
render: "canvas", // 设置渲染方式
width: 360, // 设置宽度: 默认256
height: 360, // 设置高度: 默认256
background: "#ffffff", // 背景颜色
foreground: "#000000", // 前景颜色
// src: "http://qkongtao.cn/wp-content/uploads/2020/02/logo1.fa9c5aaa.png", //二维码中间的图片
});
//ajax的轮询
var timer1 = setInterval(checkScan, 1000);//每隔1s执行一次checkScan
var timer2 = null;
function checkScan() {
$.ajax({
type: 'get',
url: "/loginData",
// async: false,
success: function (data) {
console.log(data)
if (!$.isEmptyObject(data)) {//有用户扫描了该二维码，应停止对checkScanServlet的轮询
window.clearInterval(timer1);
console.log("拿到数据")
$('#msg').html(data.nickname + "已经扫描，请在客户端确认");//将二维码取消，防止其他人再扫
timer2 = setInterval(checkConfirm, 1000);//轮询用户是否确认登录
}
}
});
}
function checkConfirm() {
$.ajax({
type: 'get',
url: "/loginSuccess",
// async: false,
success: function () {
console.log("跳转********")
window.clearInterval(timer2);
window.location.href = "/loginSuccess"
}
});
}
登陆信息
您的登录信息
用户名：
openid：
头像图片：
登录ip地址：
后端实现
package cn.kt.wxlogin.domain;
/**
* @author tao
* @date 2021-03-06 23:18
* 概要：
*/
public class LoginResultVO {
Integer errcode;
String message;
public Integer getErrcode() {
return errcode;
}
public void setErrcode(Integer errcode) {
this.errcode = errcode;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
@Override
public String toString() {
return "LoginResultVO{" +
"errcode=" + errcode +
", message='" + message + '\'' +
'}';
}
}
package cn.kt.wxlogin.controller;
import cn.kt.wxlogin.domain.LoginResultVO;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;
import java.util.concurrent.TimeUnit;
/**
* @author tao
* @date 2021-03-06 23:09
* 概要：
*/
@Controller
public class WXLoginController {
/*扫码用户信息*/
private Map userMap = new HashMap();
/**
* @param response
* @param map
* @return 接收参数回调，是被回调的，第三方码上登录回调
*/
@RequestMapping("/loginService")
@ResponseBody
public LoginResultVO loginService(
HttpServletResponse response,
@RequestParam Map map) {
System.out.println(map);
userMap = map;
LoginResultVO loginResultVO = new LoginResultVO();
//System.out.println("我被调用了");
loginResultVO.setErrcode(0);
loginResultVO.setMessage("成功");
return loginResultVO;
}
/**
* @return 负责跳转登录
*/
@RequestMapping("/login")
public String login() {
return "qrcode";
}
/**
* @author ：tao
* @date ：Created in 2021-03-07 1:24
* @param: ：
* @return： 返回前端用户信息，判断二维码有没有被扫
*/
@RequestMapping("/loginData")
@ResponseBody
public Map loginData() {
return userMap;
}
/**
* @author ：tao
* @date ：Created in 2021-03-07 1:30
* @return： map
* 登陆成功，进行跳转
*/
@RequestMapping("/loginSuccess")
public ModelAndView loginSuccess(HttpServletResponse response,
Map map,
HttpServletRequest request) {
HttpSession session = request.getSession();
/*如果session中user有值,则不需要重复*/
if (request.getSession().getAttribute("loginUser") == null) {
session.setAttribute("loginUser", userMap);
}
//清空用户数据
System.out.println(userMap);
userMap = null;
return new ModelAndView("userInfo");
}
}
源代码下载
关联：
提取码：a9lh
复制完这个内容后，打开百度网盘手机应用，操作起来更方便。
把毕业设计中用到的小技巧写进了博客笔记，整理了好久。如果觉得对大家有帮助，可以点赞、评论、关注。长得帅的可以多多打赏支持^_^
如有任何问题，请随时与我联系（评论很好！）
