Capacitor js 使用体验
前端现状众所周知,当下前端现状就是“打包 Android、打包 iOS、打包 Electron”。前端已死,大家都往端上靠 今天谈谈最近工作中用到的,入坑两个月的前端框架 Capacitor js Capacitor jsCapacitor js 是一个跨平台框架,可以打包基于前端的 Android、iOS、Electron 应用 这个框架的逻辑很简单,它可以通过 npx cap add android 等命令生成其他平台的项目模板,通过 npx cap sync 命令把打包好的前端代码移动到其他平台项目下。最后再用对应平台的 IDE 打包,比如 Android Studio、Xcode 插件插件的概念就是通讯工具。因为前端无法操作设备的很多功能,比如你想打开摄像头,就需要通过前端插件发送一个指令到平台端的插件,收到指令后执行对应的逻辑 官方提供的插件基本覆盖了设备常用功能,同时还有社区插件,再不济可以自己开发插件,官方也提供了很好的例子 起初插件是放在本地的,项目中引入走的 file: 协议,这导致新电脑拉取项目后必须先在每个插件目录下 install、build...
网络游戏防沉迷实名认证系统 1007 错误记录
前言最近在接 网络游戏防沉迷实名认证系统,它得要你跑通所有测试接口才给你用正式接口 所以我直接投降,用了个开源包,chinawilon/fcm_game 奈何是 composer 的,现学现卖终于跑起来了,但这才是刚开始 直奔主题遇到了个报错怎么调也调不通,接口返回报错内容 1{"errcode":1007,"errmsg":"SYS REQ EXPIRE ERROR"} 根据文档说明是:接口请求过期 最开始没仔细想,以为是参数问题,就把各种参数打印了个遍,发现没啥问题 后面仔细一想,过期 那不就是时间的问题吗 调试使用命令打印服务器日期 1date "+%Y-%m-%d %H:%M:%S" 发现果然罪魁祸首就是服务器日期慢了几分钟! 解决使用 ntp、ntpdate 让服务器自己去时间同步服务器同步时间 首先安装这两个软件 1yum -y install ntp ntpdate 设置同步服务器 1ntpdate...
搭建自己的在线 vscode
一张图 code-servercode-server 是一个在线版的 vscode,跟其他在线编辑器不同的是,它包含服务端,通过 WebSockets 与主机通讯,这使得你可以搭建后端环境来编译、运行你的程序 跟本地 vscode 基本一致,可以非常方便的进行项目演示、合作开发等 启动这里使用的是 Docker 部署 只需要下载 docker-compose.yaml,配置相应的环境变量,然后执行 docker-compose up -d 即可 持续集成参考 monlor/docker-code-server 做了持续集成 使用 Github Actions 根据 Dockerfile 进行构建、发布镜像,根据自己需要进行了以下配置 给 zsh 装了个可可爱爱的主题 安装了 nvm、nodejs、yarn、pnpm、vue-cli 等前端环境 安装了一些常用插件 自定义 vscode 用户配置 参考的项目里还带...
Bitwarden 登录失败问题记录
错误Bitwarden 是一个密码管理工具,服务端支持自己部署,所以用 Docker 搭了一个,稳定运行了一年多 直到几个月前,突然出现了问题,所有客户端(浏览器插件、手机 app)都不能登录了 不过服务端自带的 Web 界面还能用,再加上懒就一直没折腾,但确实也挺困扰的,总不能一直登 Web 界面获取密码 于是今天想着解决解决 原因像这种所有客户端同时报错的情况,理所应当就会想到肯定是服务端更新了什么 搜了一下问题,发现 贴吧 有讨论,果然官方早就发布过 《11月弃用通知》 解决像我这种怕麻烦的人,换浏览器插件版本这种解决方案我是直接放弃的,因为多台设备换一遍也是挺麻烦的 也是同篇帖子提到把镜像换成 vaultwarden/server,于是我选择按这个方案进行 首先肯定要把原来的密码全部导出,然后再 因为我是用了宝塔,所以直接打开 Docker 管理器,拉取镜像,创建容器 按以上配置,其中 WEBSOCKET_ENABLED=true 是 WebSocket 通知端口,不需要的可以不加,并且也不需要映射 3012...
Vue 自定义指令生成 placeholder
需求产生在使用表单时,表单的输入框、选择器会设置 placeholder 属性来进行提示 不设置感觉空荡荡的,但如果自己一条条的写又感觉非常麻烦 那我们为何不封装个指令,让它自己加呢 思路因为我用的是 element-plus,组件都有固定的样式、模板 比如 123<el-form-item label="姓名"> <el-input></el-input></el-form-item> 最后的代码就是 12345678<div class="el-form-item"> <label for="title" class="el-form-item__label">姓名</label> <div class="el-form-item__content"> <div class="el-input"> <input...
2022 年度总结
今年的状态依然是 间歇性踌躇满志,持续性混吃等死。 去年的 Flag 日语 JLPT N1,报了也成功抢到位置了,但最后几天被通知考点取消了 系统学习数据结构和设计模式,完全没看 ¯\_(ツ)_/¯ 我就不适合立 flag 工作今年一整年在做前端,从小白到入土 Vue2、Vue3 全家桶,WebPack、Vite 以及 PC 端、移动端的 UI 框架、常见的几个后台管理框架也都摸了个遍 下半年新项目是完全从零开始做了一套管理后台,封装了一些不错的组件,至少自己用起来很爽 生活依旧...
Github Actions Hexo 自动部署
来龙去脉最近重装了电脑,近几年内每次重装也好,装备新电脑也好,越来越觉得这个博客是令我比较头疼的事 因为前几年从 WordPress 迁移到了 Hexo,虽然变成了纯静态,访问速度上提高了。但本地文件的维护、文章的发布就变得很繁琐 比如 重装必须备份 多台电脑必须同步最新的 发布文章需要在本地跑三条命令 多台电脑同步的问题,我在家里树莓派上建了个 git 仓库,专门同步文章。不过大部分时间都会忘记,并且配置文件、主题的配置文件都不在文章目录,所以没法同步 觉醒最近一次重装我依然是手动备份,重装后看着这个备份,觉得这样下去不行,得赶紧拿出个更完美(懒)的方案 想起之前在一个浏览器插件的仓库看到了自动发布脚本,我有个浏览器插件每次发布都很繁琐,因此早就想研究一下自动化 所以这次第一个念头也是自动化:Github Actions 旧流程按照之前手动挡的流程是这样的 清除缓存 hexo clean 生成静态文件 hexo g 部署 hexo d(执行一次 git 推送) 远程仓库 hooks 被触发,自动去网站根目录,git...
前端自动打包上传推送钉钉工具
介绍在一部分公司中,上线时前端需要打包后发给后端或运维同学,他们再放到服务器上 但每次打包、压缩、发给别人这个过程太麻烦了,于是就有了这个小工具 我们就可以简单配置一下,在打包结束后自动执行这个程序 并且可以直接下载压缩包 好了,现在只要把后端骗进群,压力一下子就来到了后端这边 除了自动展示版本、压缩包大小、打包日期之外 它还可以自动维护本地及线上的压缩包,每次执行时会检查非今天的文件,自动删除 使用方法安装1pnpm i -D simple-zip-upload 导入1import ZipUpload from 'simple-zip-upload' 配置12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061const ZipUpload = require('simple-zip-upload')const path =...
红十字救护员考证见闻
先整个图显摆显摆 实际上初级没啥可显摆的 为啥考因为去年参加了蓝天救援队,红十字救护员是蓝天的必备证,队里会统一组织培训和考试 虽然并不是必须的,但学习一下简单的急救方法也是对自己的提升嘛 考试流程 看视频:在考前的一段时间看,需要达到一定的学习时长,视频中还会有选择题让你做 理论考试:我们是先到考场进行笔试,在手机上做选择题 实操培训:现场有两位红会工作人员给我们做实操培训,学员互相练习 实操考试:包扎部分是工作人员出题,学员互相做。心肺复苏是用假人 笔记记个笔记,有空自己也要翻一翻。因为考完之后有红会工作人员会电话回访,而且还会出题,上次回访有几道题答的不是很好 1. 心肺复苏(CPR) 评估现场环境安全,任何救援先要保证自己不会受伤 判断意识,跪姿,双腿分开。双手拍肩,同时大声在耳边重复喊“喂!醒醒!你怎么了”,无反应 检查呼吸,耳朵贴近患者鼻部,听呼吸声;眼睛看向患者胸部,看是否有起伏。观察 5-10秒,观察时急救读秒,1001、1002、1003...
Nest JS 入门笔记
使用契机前段时间打算做一个系统,涉及前后端 前端分为用户端和后台管理,后台发布任务,用户端签到、签退 选后端框架时挑挑拣拣,最后感觉 Nest JS 的装饰器写法令我非常满意,于是就决定下来了 学到的东西Typeorm使用 typeorm 维护数据库字段 1234567891011121314/** * 用户ID 主键 */@PrimaryGeneratedColumn({ type: 'int', comment: '用户ID' }) id: number/** * 用户名 */@Column({ type: 'varchar', length: 20, comment: '用户名' }) username: string/** * 密码 */@Column({ type: 'varchar', length: 50, comment: '密码' }) password:...