检查点是否在任意立方体内
立方体由 p0,p1,p2,p3 定义
1234567891011121314151617181920212223242526272829303132333435class Vector3 { constructor(x = 0, y = 0, z = 0) { this.x = x; this.y = y; this.z = z; } sub(v) { this.x -= v.x; this.y -= v.y; this.z -= v.z; return this; } dot(v) { return this.x * v.x + this.y * v.y + this.z * v.z; }}function boxTest(p0, p1, p2, p3, pv) { const i = p1.sub(p0); const j = p2.sub(p0); const k = p3.sub(p0); const v = pv. ...
检查点是否在任意圆柱体内
https://www.flipcode.com/archives/Fast_Point-In-Cylinder_Test.shtml
123456789101112131415161718192021222324252627282930313233343536373839404142434445function cylTest(pt1, pt2, radius, testpt) { let dx, dy, dz; // vector d from line segment point 1 to point 2 let pdx, pdy, pdz; // vector pd from point 1 to test point let dot, dsq; let length_sq = Math.pow(pt1.x - pt2.x, 2) + Math.pow(pt1.y - pt2.y, 2) + Math.pow(pt1.z - pt2.z, 2); let radius_sq = Math.pow(radius, 2); dx = pt2.x - pt ...
解决浏览器在后台时定时器降频问题
https://github.com/myonov/momentum
引入 momentum.js,正常使用 setInterval, clearInterval, setTimeout, clearTimeout 方法
密钥传输和签名加密流程(国密)
密钥传输流程
系统内置一套公钥和私钥
打开前端时自动获取其中公钥(公钥不需要加密)
前端随机生成一个 sm4 的 key 和 iv,使用公钥对 key 和 iv 进行加密,传到后台 (已加密),后台使用私钥解密能拿到原始 key 和 iv,然后在生成一套公私钥,key、iv 和公钥存到 redis 中。每个用户的 key、iv 和公私钥都是不一样的,重新打开页面也会重新生成 key、iv 和公私钥。私钥使用 sm4 的 cbc 模式加密后传给前端已加密。
前端再使用刚才随机生成的 key 和 iv 解密拿到私钥。前端使用这个私钥对请求进行签名。
前端向后端加密传输
前端拦截请求,对请求中 body 使用 sm2 的公钥加密或使用 sm4 cbc 模式加密(目前使用的 sm2 加密)
后端收到请求后,在验签之前使用私钥把 body 数据解密,然后再验签。
前端拦截请求,对请求中 body 先使用 sm3 计算哈希,然后把哈希值和明文数据拼接后,使用 sm2 公钥加密或使用 sm4 cbc 模式加密(目前使用的 sm2 加密)
后端收到请求后,在验签之前使用私钥把 bo ...
Vuetify 自定义SVG图标
Vuetify 自定义 SVG 图标
Vite
Vuetify
vite-plugin-svg-icons
首先配置 svg 插件https://github.com/vbenjs/vite-plugin-svg-icons/blob/main/README.zh_CN.md
12345678910111213141516171819202122232425262728293031323334353637383940414243// vite.config.jsimport { defineConfig, loadEnv } from "vite";import legacy from "@vitejs/plugin-legacy";import { createVuePlugin } from "vite-plugin-vue2";import viteCompression from "vite-plugin-compression";import path ...
使用PopClip调起uTools
在我这里 PopClip 和 uTools 都是重要的生产工具,把两者关联到一起可以进一步提高效率
前提PopClip 更新到 2021.11 版本或以上,支持快速安装扩展
扩展如下
1234567# popclip jsname: Utoolsrequirements: [text]actions: - title: 用Utools打开 icon: circle filled U javascript: popclip.pressKey(util.constant.KEY_SPACE, util.constant.MODIFIER_OPTION);popclip.pasteText(popclip.input.text)
选择上边文字,然后点击install Extension "Utools"如果没有弹出 popclip 菜单,就把上边内容复制到其他位置再试。
如果打开 uTools 的快捷键不是 opt+空格,需要替换 popclip.pressKey 的内容具体查看https://pilotmoon.github.io/PopClip-Ext ...
rsa前端加密、node后端解密
对用户敏感数据进行加密处理,后端再解密。比如登录时的密码
由后端生成公钥node 使用node-rsa
123456import NodeRSA = require('node-rsa');const RSA = new NodeRSA({ b: 512 });RSA.setOptions({ encryptionScheme: 'pkcs1' });const pubkey = RSA.exportKey('pkcs8-public-pem'); // 生成公钥,发给前端用于数据加密,不导出私钥信息this.app.pubkey = pubkey;this.app.RSA = RSA;// 把RSA对象保存在程序内存,随时调用
前端加密前端使用jsencrypt
1234import JSEncrypt from "jsencrypt";const encryptor = new JSEncrypt();encryptor.setPublicKey(this. ...
API接口签名设计,防止重放
为了保证 api 接口安全,防止数据被篡改,需要设计 api 签名机制。以下为签名过程
接口签名算法1. 获取参数 一共 4 部分的参数
path
query
body
时间戳 {timestamp}
随机字符串 {nocestr}
2. 合并参数,然后排序(body 中可能嵌套多层 json,需要递归对对象属性排序,数组的顺序不变)3. 对上一步对象转为字符串,然后 md5 加密4. 再用用户 token 为 key,对 md5 加密后的字符串用 hmacSHA512 加密得到 sign5. http 请求 header 中添加 sign、timestamp、nocestr前端签名实现如下12345678import hmacSHA512 from "crypto-js/hmac-sha512";import md5 from "crypto-js/md5";const timestamp = +new Date();const nocestr = generateNoceStr();const data = Object.assign( ...
emqx docker-compose 方式部署
docker-compose.yml
1234567891011121314151617version: "3"services: mqtt: image: emqx/emqx:4.2.14 container_name: mqtt restart: always ports: - "1883:1883" - "8083:8083" volumes: - /etc/timezone:/etc/timezone - /etc/localtime:/etc/localtime environment: - EMQX_LOADED_PLUGINS="emqx_recon,emqx_retainer,emqx_management,emqx_auth_username" - EMQX_ALLOW_ANONYMOUS=false - EMQX_AUTH__USER__1__USERNAME=${MQT ...
vue中动态绑定的文本中加入跳转链接处理方式
业务中有一块是通知中心,其中的通知文本中有的文字是可以点击跳转到其他页面的。但是又不想使用富文本渲染。遂采用以下实现方式
v-html 渲染
a 标签标识可跳转链接
dataset 设置参数
12345678910111213141516171819202122232425262728293031<template> <div> <div v-html="text" @click="click"></div> </div></template><script>export default { name: "About", data() { return { text: `你好,这是<a data-name='Preview' data-id='123' data-mode="preview">链接</ ...