From 65563f5b75003527322d48d261f4284494728d87 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E5=91=98=E5=B0=8F=E5=A2=A8?= <2291200076@qq.com> Date: Tue, 25 Apr 2023 01:41:23 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E6=89=AB=E7=A0=81?= =?UTF-8?q?=E9=97=A8=E7=A6=81=E7=AB=AF=E6=98=BE=E7=A4=BA=E8=AF=A6=E6=83=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- TODOs.md | 3 ++ .../src/main/resources/application.yml | 6 +-- .../static/guard/assets/css/scan-result.css | 20 ++++++++++ .../static/guard/assets/css/setting-panel.css | 2 +- .../assets/js/websocket-message-panel.js | 39 +++++++++++++++++++ .../static/guard/assets/js/websocket.js | 26 +++++++++++-- .../static/guard/assets/svg/enter-gate.svg | 33 ++++++++++++++++ .../static/guard/assets/svg/scan-success.svg | 33 ++++++++++++++++ .../main/resources/static/guard/index.html | 11 +++++- .../main/resources/static/guard/renderer.js | 14 ++++++- .../controller/AccessLogController.java | 7 ++++ .../epp/access/controller/GateController.java | 8 ++++ .../project.private.config.json | 2 +- 13 files changed, 192 insertions(+), 12 deletions(-) create mode 100644 backend/microservice-gateway/src/main/resources/static/guard/assets/css/scan-result.css create mode 100644 backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket-message-panel.js create mode 100644 backend/microservice-gateway/src/main/resources/static/guard/assets/svg/enter-gate.svg create mode 100644 backend/microservice-gateway/src/main/resources/static/guard/assets/svg/scan-success.svg diff --git a/TODOs.md b/TODOs.md index 9cd0332..6287344 100644 --- a/TODOs.md +++ b/TODOs.md @@ -42,6 +42,9 @@ Java代码中小程序AppID、密钥处理，小程序代码中小程序AppID处理 +# TODO 全部域名配置的地方添加 FIXME 环境配置 + + # host 文件地址 C:\Windows\System32\drivers\etc diff --git a/backend/microservice-gateway/src/main/resources/application.yml b/backend/microservice-gateway/src/main/resources/application.yml index 91c43f9..60c5f09 100644 --- a/backend/microservice-gateway/src/main/resources/application.yml +++ b/backend/microservice-gateway/src/main/resources/application.yml @@ -43,7 +43,7 @@ spring: filters: # 路由过滤器，使用自定义的限流过滤器工厂 - name: RateLimitByIp # 设置每秒允许5个请求，每次请求需要1个令牌 args: - rate: 5.0 + rate: 10.0 permits: 1 - id: access @@ -54,7 +54,7 @@ spring: filters: # 路由过滤器，使用自定义的限流过滤器工厂 - name: RateLimitByIp # 设置每秒允许5个请求，每次请求需要1个令牌 args: - rate: 5.0 + rate: 10.0 permits: 1 - id: access-websocket @@ -70,7 +70,7 @@ spring: filters: # 路由过滤器，使用自定义的限流过滤器工厂 - name: RateLimitByIp # 设置每秒允许5个请求，每次请求需要1个令牌 args: - rate: 5.0 + rate: 10.0 permits: 1 - id: test1 diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/css/scan-result.css b/backend/microservice-gateway/src/main/resources/static/guard/assets/css/scan-result.css new file mode 100644 index 0000000..2e03f75 --- /dev/null +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/css/scan-result.css @@ -0,0 +1,20 @@ +.scan-result-container { + position: fixed; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 20; + display: grid; + place-items: center; +} + +.scan-result-image { + width: min(55vw, 55vh); + transition: 0.3s; + transform: scale(0.001); +} + +.scan-result-image-show { + transform: scale(1); +} diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/css/setting-panel.css b/backend/microservice-gateway/src/main/resources/static/guard/assets/css/setting-panel.css index cd23e65..c174905 100644 --- a/backend/microservice-gateway/src/main/resources/static/guard/assets/css/setting-panel.css +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/css/setting-panel.css @@ -62,7 +62,7 @@ } .hidden { - display: none; + display: none !important; } /* 弹窗列表样式 */ diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket-message-panel.js b/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket-message-panel.js new file mode 100644 index 0000000..54bd053 --- /dev/null +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket-message-panel.js @@ -0,0 +1,39 @@ +const URLScanSuccessImage = "./assets/svg/scan-success.svg" +const URLEnterGateImage = "./assets/svg/enter-gate.svg" +const DOMFullScreenMask = document.getElementById("full-screen-mask") +const DOMScanResultContainer = document.getElementById("scan-result-container") +const DOMQRCodeScanSuccessImage = document.getElementById("qrcode-scan-success") + +var isShowing = false + +function showResult(imageType) { + console.log("showResult") + if (isShowing) { + // console.log("showResult() skipped coz showing.") + // 等待 0.1s 重试 + setTimeout(() => showResult(imageType), 100) + return + } + isShowing = true + DOMQRCodeScanSuccessImage.src = imageType === "onscan" ? URLScanSuccessImage : URLEnterGateImage + DOMFullScreenMask.classList.remove("hidden") + DOMScanResultContainer.classList.remove("hidden") + // + setTimeout(() => { + DOMQRCodeScanSuccessImage.classList.add("scan-result-image-show") + }, 100) + + setTimeout(function hideResult() { + console.log("hideResult") + DOMQRCodeScanSuccessImage.classList.remove("scan-result-image-show") + setTimeout(() => { + DOMQRCodeScanSuccessImage.src = "" + DOMFullScreenMask.classList.add("hidden") + DOMScanResultContainer.classList.add("hidden") + isShowing = false + }, 300) + }, 3000) +} + +// setTimeout(showResult, 100) +window.showResult = showResult diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket.js b/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket.js index 92625c9..e3a2de9 100644 --- a/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket.js +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/js/websocket.js @@ -1,6 +1,11 @@ -window.wsUrl = 'wss://epp.only4.work/access/websocket/1'; -// window.wsUrl = 'ws://127.0.0.1:80/access/websocket/1'; -// window.wsUrl = 'ws://127.0.0.1:8002/access/websocket/1'; +/** + * FIXME 环境配置 + * + * window.wsUrl + * - 线上环境：'wss://epp.only4.work/access/websocket/1' + * - 开发环境：'ws://127.0.0.1:80/access/websocket/1'; 'ws://127.0.0.1:8002/access/websocket/1'; + */ +window.wsUrl = 'ws://127.0.0.1:80/access/websocket/1'; window.ws = null; // WebSocket 实例对象 @@ -34,9 +39,21 @@ window.ws = null; // WebSocket 实例对象 ws.onmessage = ({data}) => { console.log('onmessage readyState', ws.readyState) // 注意此时的data是json格式的 需要转化下 - console.log('onmessage 有新消息啦=======>', JSON.parse(data)) + let result = JSON.parse(data) + console.log('onmessage 有新消息啦=======>', result) // 实例对象的send方法给服务器发送消息 ws.send('客户端发送的消息') + + switch (result.action) { + case 'onscan': + case 'onopen': + console.log(result.action) + window.showResult(result.action) + break; + default: + console.log("switch=>default", result.action) + break; + } } // 实例对象的onclose属性，用于连接关闭后的回调 函数 @@ -58,5 +75,6 @@ window.ws = null; // WebSocket 实例对象 } return ws } + window.ws = createConn() })() diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/enter-gate.svg b/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/enter-gate.svg new file mode 100644 index 0000000..5cd2dba --- /dev/null +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/enter-gate.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + 大门 + 已开启 + + + diff --git a/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/scan-success.svg b/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/scan-success.svg new file mode 100644 index 0000000..1dc7e10 --- /dev/null +++ b/backend/microservice-gateway/src/main/resources/static/guard/assets/svg/scan-success.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + 扫码 + 成功 + + + diff --git a/backend/microservice-gateway/src/main/resources/static/guard/index.html b/backend/microservice-gateway/src/main/resources/static/guard/index.html index 79aedfa..36b867d 100644 --- a/backend/microservice-gateway/src/main/resources/static/guard/index.html +++ b/backend/microservice-gateway/src/main/resources/static/guard/index.html @@ -10,6 +10,7 @@ 社区疫情防控系统 - 门禁端 + @@ -36,11 +37,12 @@

请选择大门

- +

+ + + + + + diff --git a/backend/microservice-gateway/src/main/resources/static/guard/renderer.js b/backend/microservice-gateway/src/main/resources/static/guard/renderer.js index c88563e..f8d6a3f 100644 --- a/backend/microservice-gateway/src/main/resources/static/guard/renderer.js +++ b/backend/microservice-gateway/src/main/resources/static/guard/renderer.js @@ -1,8 +1,18 @@ +/** + * FIXME 环境配置 + * + * baseUrl + * - 线上环境："https://epp.only4.work/" + * - 开发环境："/" + * envVersion + * - 线上环境："release" + * - 开发环境："develop" + */ // 定义常量 -const baseUrl = "/" // "https://epp.only4.work/" +const baseUrl = "/" const url = baseUrl + "access/wechat/getUnlimitedQRCode" const page = "pages/index/index" // "pages/scan/entrance" -const envVersion = "develop" // 正式版为 "release"，体验版为 "trial"，开发版为 "develop" +const envVersion = "release" // 正式版为 "release"，体验版为 "trial"，开发版为 "develop" const autoColor = true const isHyaline = false const width = 500 diff --git a/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/AccessLogController.java b/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/AccessLogController.java index db3a9be..e2161ff 100644 --- a/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/AccessLogController.java +++ b/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/AccessLogController.java @@ -61,6 +61,13 @@ public class AccessLogController { return Res.error("参数错误"); } + // 推送到门禁端 + JSONObject websocketData = new JSONObject(); + websocketData.put("gateId", gateId); + websocketData.put("action", "onopen"); + String websocketJSON = websocketData.toString(); + WebSocketServer.sendAllMessage(websocketJSON); + AccessLog accessLog = new AccessLog(); accessLog.setId(null); accessLog.setType(type); diff --git a/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/GateController.java b/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/GateController.java index 2c1fa88..9e8db39 100644 --- a/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/GateController.java +++ b/backend/microservice-provider-access-8002/src/main/java/com/cxyxiaomo/epp/access/controller/GateController.java @@ -58,6 +58,14 @@ public class GateController { Long gateId = Long.valueOf(id); Gate gate = gateService.getGateById(gateId); GateVO gateVO = GateVO.convertFrom(gate); + + // 推送到门禁端 + JSONObject websocketData = new JSONObject(); + websocketData.put("gateId", id); + websocketData.put("action", "onscan"); + String websocketJSON = websocketData.toString(); + WebSocketServer.sendAllMessage(websocketJSON); + return Res.success(gateVO); } diff --git a/weixin-miniprogram/project.private.config.json b/weixin-miniprogram/project.private.config.json index b4ae0ed..3d19405 100644 --- a/weixin-miniprogram/project.private.config.json +++ b/weixin-miniprogram/project.private.config.json @@ -3,7 +3,7 @@ "projectname": "weixin-miniprogram", "setting": { "compileHotReLoad": true, - "urlCheck": true, + "urlCheck": false, "bigPackageSizeSupport": true } } \ No newline at end of file