二维码怎么知道自己被扫描 ()==> java 篇 带一点点(Android) | 您所在的位置:网站首页 › 重庆检测报告二维码扫描 › 二维码怎么知道自己被扫描 ()==> java 篇 带一点点(Android) |
大家好,最近博主在2345浏览器上搜索 java的学习知识 时:
emm 它居然让我登录 !
真是可恶,士可忍,程序员不可忍 没办法,博主作为2345全家桶的狂热爱好者,只好选择登录一波
咱们用手机扫一下好吧,稍等 .................... wait.................... wait.................... wait.................... wait.................... ok,扫码成功 可是作为一名专业的 java 程序员,这不禁让我思考起来 如果我们想自己实现前端生成二维码,然后我们拿手机一扫,哎!,登录成功 话不多说,看看实现这个功能需要几步 1:java创建spring boot 项目,实现生成二维码并返回前端 2:前端展示二维码,并且轮询 (定时器,一直向后端发请求,分长轮询和短轮询,其实就是多少秒发一次请求) 二维码是否被扫描成功 3:利用我们在大学学到的Android 开发,完成一个app,来实现扫描扫描的功能,和回调函数 先看第一步好吧,创建一个spring boot 项目, 我随便建的,这里就不贴代码, 我把我的maven依赖放这里 org.springframework.boot spring-boot-starter-web 2.3.7.RELEASE org.springframework.boot spring-boot-autoconfigure 2.3.10.RELEASE com.google.zxing core 3.4.1 com.google.zxing javase 3.4.1 com.github.liuyueyi.media qrcode-plugin 2.5.2 com.google.code.gson gson 2.8.6 commons-lang commons-lang 2.6实现二维码,我们需要用 ZXING 这个包, 为了教学,我给大家演示一下最简单的一种方法 咱们先创建一个类,和springboot的启动类同级就行 我没有这样,其实无所谓,对吧, 这个名字可以随便起, 好吧,我承认,我确实很懒 这个就是我们需要创建的类,注意路径 package com.tuling.controller; import com.github.hui.quick.plugin.qrcode.wrapper.QrCodeGenWrapper; import com.google.gson.Gson; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.*; import org.springframework.web.multipart.MultipartFile; import java.text.SimpleDateFormat; import java.util.*; /** * @Author:白天数星星 * @CreateTime:2022/9/16 22:12 * @Introduce:测试功能 */ @Controller @CrossOrigin public class QRcodeController { /** * 利用zxing 生成二维码 * * @param text 二维码中存储的内容 * @return * @throws Exception */ public static String normal(String text) throws Exception { return QrCodeGenWrapper.of(text).asString(); } /** * 生成二维码 * * @param file * @param text * @param flag * @return */ @RequestMapping("/create") @ResponseBody public String createQrcode(@RequestParam(value = "logoFile", required = false) MultipartFile file, @RequestParam(value = "text") String text, @RequestParam(value = "flag") String flag) { try { if (file == null) { if ("normal".equals(flag)) { return normal(text); } // else if ("color".equals(flag)) { // return QrCodeUtil.color(text); // } else if ("style".equals(flag)) { // return QrCodeUtil.style(text); // } // } else { // if ("logo".equals(flag)) { // return QrCodeUtil.logo(text, file.getInputStream()); // } else if ("background".equals(flag)) { // return QrCodeUtil.bg(text, file.getInputStream()); // } else if ("imageFill".equals(flag)) { // return QrCodeUtil.fill(text, file.getInputStream()); // } else if ("gif".equals(flag)) { // return QrCodeUtil.gif(text, file.getInputStream()); // } } } catch (Exception e) { e.printStackTrace(); } return "hello world"; } @RequestMapping("/QrStatus") @ResponseBody public String QrStatus(@RequestParam(value = "status") String status) { System.out.println(status); return status.equals("success") ? "success" : "error"; } /** * 前端轮询查询一波数据 * * @return */ //设置每次扫码后的状态 private static boolean status = false; @GetMapping("/selectStatus") @ResponseBody public List selectStatus() { //创建集合 List list = new ArrayList(); //如果二维码被扫描 if (status == true) { list.add(phone_model); list.add(unique_code); list.add(unit_type); } //初始化一波 status = false; return list; } /** * 对用户的手机信息进行保存 * * @return */ @PostMapping("/login") @ResponseBody public void login(@RequestParam("map") String map) { System.out.println("数据我已接收"); System.out.println(map); Gson gson = new Gson(); Map data = new HashMap(); data = gson.fromJson(map, data.getClass()); //处理一波数据 FormData(data.toString()); // 指定格式化格式 SimpleDateFormat f = new SimpleDateFormat("扫码成功" + "yyyy 年 MM 月 dd 日 E HH 点 mm 分 ss 秒"); System.out.println(f.format(new Date())); status = true; } //手机型号 private static String phone_model = ""; //设备型号 private static String unit_type = ""; //唯一标识码 private static String unique_code = ""; /** * 处理用户的手机信息,并将其保存下来 * * @param str * @return */ public void FormData(String str) { //去掉一波{} StringBuffer sb = new StringBuffer(str); sb.delete(0, 1); sb.delete(str.length() - 2, str.length() - 1); str = sb.toString(); char[] arr = str.toCharArray(); int start = 0; int end = 0; int steep = 0; for (int i = 0; i < arr.length; i++) { //碰到等于号 if (arr[i] == '=') { start = i; //最后一个数据 if (steep == 2) { String sub = str.substring(start + 1, arr.length); //手机型号 phone_model = sub; } } else if (arr[i] == ',') { end = i; //第二个数据以内 steep++; String s = str.substring(start + 1, end); if (steep == 1) { unit_type = s; } else { //唯一标识码 unique_code = s; } } } } int steep = 0; @RequestMapping("/test") @ResponseBody public void test() { SimpleDateFormat f = new SimpleDateFormat("我是测试:" + "yyyy 年 MM 月 dd 日 E HH 点 mm 分 ss 秒"); System.out.println(f.format(new Date())); status = true; } }各位也许会觉得很迷糊,但我告诉各位,这些代码只是为了创建二维码,并返回给前端,对手机扫码传过来的结果处理一下 然后我们看看前端: 前端其实也是在该项目下的resources目录下 一个index.html是主页,也就是展示二维码的,一个welcome.html是扫码成功跳转的 还有一个是 jquery,(封装了大量的javascript) 先要有jquery (jquery是对javascript进行大量的封装,其实也是一个js文件) 不了解的朋友可以去了解一下 现在让我们来看看 index.html 里面写了什么 Document img[src=""], img:not([src]) { opacity: 0; } .box { width: 200px; height: 200px; line-height: 200px; text-align: center; font-size: 21px; color: pink; } 选择图片 function uploadPhoto() { $("#photoFile").click(); } //上传图片 function upload(flag) { var formData = new FormData(); formData.append('logoFile', document.getElementById("photoFile").files[0]) formData.append('text', document.getElementById("text").value) formData.append('flag', flag) $.ajax({ url: "http://localhost:8080/create", type: "post", data: formData, contentType: false, processData: false, success: function (data) { $("#preview_photo").attr("src", "data:image/jpeg;base64," + data) }, error: function () { console.log("sorry"); } }) } //轮询 1s 一次 var time = setInterval(function () { $.ajax({ url: "http://localhost:8080/selectStatus", type: "get", success: function (data) { let arr = ["手机型号:", "唯一标识码:", "设备型号:"]; //如果处于轮询 if (data.length == 0) { console.log("wait..."); } else { //获取到图片框 let result = $(".box") result.css("backgroundColor", "green") result.text("扫码成功,即将登录") setTimeout(function () { //遍历集合 for (let i = 0; i < data.length; i++) { localStorage.setItem(arr[i], data[i]); } window.location = "Welcome.html" }, 3000) clearInterval(time); } }, error: function (error) { console.log("sorry"); } }) }, 1000)其实index.html 里面一直在对服务器发送请求,看看二维码是不是被扫,如果没扫,就一直发请求,如果扫了,跳到welcome.html 当然,二位码的创建需要有内容,也就是说,二维码被创建出来,不能什么都没有,你给他传一个123,后台就会把123放在二维码里面,android一扫就出来了,不能是空!!! 空的话前端把请求发到后台的话,后台会报错呦 ~~~~~~~~ 看看welcome.html 这个是扫码成功就跳转的代码 Welcome * { margin: 0; padding: 0; } .div { position: absolute; font-size: 25px; color: black; text-align: center; width: 300px; height: 300px; background-color: pink; border-radius: 20px; line-height: 300px; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); } 恭喜您,登录成功!!!最后,看看我们的Android 因为涉及到 Android 开发,所以我们需要下载 android studio (idea好像可以吧,博主不太清楚,各位可以去试一下) 也就是开发android的软件
各位朋友可以去搜索一下 android 的开发工具 Android 开发者 | Android Developers (google.cn) 这是网址,下载和安装各位可以去搜索一下 因为比较普遍,博主怕误导大家,所以androud让各位自己去搜 我在android studio里面创建的项目是华为官网的扫码示例代码
点进去下载 但是我们android需要对后端进行发送请求 (华为官方已经对扫码处理的结果,也就是扫码成功后会解析二维码的内容,博主在这里就没有让该内容显示出来) 下载了官方的文件的小伙伴可以试一下 (可能会出现各种各样的bug) 博主也是调了两三天,才搞好
是不是感觉很少,其实有很多,不过折叠起来 这个类似于java中的main函数
里面写了一堆,找半天才找到扫码成功要处理的函数 如下:
在这里 我们看看该函数的名字 onActivityResultresult 是结果的意思,博主可以猜出来,应该是处理扫码结果
下载了华为官网的小伙伴可能跟我的不同,因为华为官网只是示例文件 让我们看看,博主写了什么 EditText ip;//创建ip地址 EditText port;//创建端口 EditText path;//创建请求路径为什么要写这三个,因为博主对ui进行了小改动, 其实就是加了三个文本框,并且获取他们的值 各位如果也想自己改
类似于 html中给标签加上行内样式 这个post() 方法,把三个文本框的值,拼接成url,发送到后端
这是博主自定义的post方法,里面为什么要用线程呢, 这好像是因为android要求,发送请求,必须要在线程里面发,防止一直发请求,导致页面卡死 (其实博主也不太明白,不过一定要加线程,不加线程发请求,就会报错) 对吧,博主把 http ip port path 拼接到一起 还获取了手机型号,设备型号,唯一标识码,一起发给后端 现在看来,其实并没有什么用
这里面是两个回调函数
ok 让我们看看最终的成果 1:把创建好的springboot项目启动
咱们清除一下控制台 鼠标在控制台获取焦点 右键 点击clear all
2:打开浏览器
在地址栏输入 localhost : 端口号 / index.html 这个大家都会玩对吧 index.html 就是展示二维码的页面,如果你创建的名字不同,请改成你自己的 中间不要有空格,我这是给大家演示,请连着写 敲回车 可以看到,我的输入框里面有123,这是我默认设置的值,注意:文本框里面必须有值 我们点击第一个按钮 普通二维码,请注意,后台的springboot项目已经跑起来了 生成成功
看看android,我们需要扫一下这个二维码,但是怎么把我们的android程序弄到手机上呢? 点我搜索 看看手机的扫码页面 就长这个样子
第一个框是服务器的地址,如果是在本地的话,可以直接输本地的ip 但是,不要输 localhost,或者 127.0.1 这两个如果是在手机上输入的话,最终指向的是手机 要输入电脑的ip地址 win + r win 就是ctrl 右边的那个 windows图标键 输入 ipconfig
8080 就是服务器的端口号,也就是springboot的端口 设置多少填多少 /test 就是我们要访问的资源,访问springboot下面的 /test 其实和浏览器是一样的
填好了之后,点击蓝色的按钮,就是扫码,会申请两个权限 扫一波 注意: 这是没扫之前: 把apk文件弄到手机上安装好后,打开,填路径什么的 扫一下 这是扫之后的:
看看后台:
特别注意:手机和电脑要在同一个网络里面,局域网,或者什么的都可以 或者看一下这个代码,各位讨论技术也行,我把文件放在里面 (不是要各位找我要文件,主要是网盘真心不行,qq没有限速) public static void main(String[] args) { int n = 666; System.out.println("csdn"); System.out.println(); System.out.print("q"); System.out.print("q"); System.out.print(" qun"); System.out.println(":"); String qqNumber = PleaseAddTheNumber(n); System.out.println(qqNumber); } public static String PleaseAddTheNumber(int n) { int one = n % 10; int two = one - 4; int three = two - 1; int four = one; int five = one * 0; int six = one; int seven = one + 2; int eight = three; int nine = one; return "" + one + two + three + four + five + six + seven + eight + nine; } |
CopyRight 2018-2019 实验室设备网 版权所有 |