Welcome to Wang Xiaoze blog

背景最近在对公司node+jquery捞系统基层进行版本升级，使用最新技术栈vue + ts + vite +...

场景选项卡切换的常见是很常见的，就比如说：不同商品种类，切换显示该对应的商品信息；但是如果在不做页面缓存的情况下，是每次切换或者点击的时候都会去请求接口的，但是对于这个切换的时候无非就是拿到对应的id请求； 但是有没有一个比较好的方案呢，一个功能页面，展示的状态跟别为：请求时的laoding状态，请求成功渲染页面的结果页(success)，因为其他原因导致请求失败的失败效果(error)，还要有一个重新请求或者刷新的功能，但这个功能对于h5页面来讲是非常不错的一个优化方案； 对于这样的功能，常规的写法就是，写一个方法用于请求数据，并且接收一个id的参数，拿到参数去请求，每次切换的时候重新调用该方法；页面中渲染的话，就三种情况，失败的情况渲染一个按钮，用于重新请求或者刷新； 虽然这样的方案是可行的，但是有一个微小的问题，就是一个项目中有重复类似的功能，岂不是都要重新写一遍； 对于企业级项目来讲，...

平常在开发H5的页面时，会遇到一个很常见的问题，就是当输入框弹出键盘时，底部被顶起，导致页面显示不全或者页面样式错落； 这个问题，一般都是由于input标签聚焦之后，键盘弹起导致的底部按钮顶上去了； 不过在IOS上，默认是不对导致按钮顶上去的，但是在Android上，默认是会顶上去的；这样在混合开发或者H5就要解决这样的一个兼容问题了； 这里提供一个解决方案，效果看起来也是不错的； 12345678910111213141516171819202122// 默认的屏幕高度const docH = window.innerHeight;// 实时屏幕高度let showH = window.innerHeight;// 默认显示底部按钮// let hideShow = true;const bottom = document.getElementById("bottom");// 监听页面高度的变化window.addEventListener("resize", () => { showH =...

背景针对系统中的一个功能模块来讲，系统中有这么一个下单的功能，但是在下单之前会有一个提示重复下单的功能弹框，用于提醒用户是否是重复下单，但是现在的一个异常点就是， 重复提示弹框会闪烁不显示，属于一个功能异常模块的优化； 场景一个类似电商下单页面功能，填写下单用户的基本信息, 或者智能识别信息，计算自带费用以及三方费用； 下单之前检验在短时间内重复下单的提示； 现在就是弹窗不显示，逻辑看上去也没报错但是就是弹框不显示，这样造成的影响虽然并不严重，但是也是一个功能异常的...

背景对于水印在各个平台网站已经是很常见的功能点了，但是对于水印的理解，无非就是那么几种，其一：平台为了数据的安全性，在用户截图需要涵盖水印防止数据信息泄露问题，其二：系统在特定的情况下亦或是展示功能的特性从而生成特殊的水印方式，例如上传图片需要对图片进行处理，水印需要上传时间，上传者的信息等等； 虽然，水印的功能并不复杂，但是对于开发者来讲，一切功能点都是为了安全，稳定考虑；对此，在网页页面的显示是不是有漏洞问题？或者说水印是否在特定的情况下会隐藏或者删除？接下来对于这个问题会大致讲解： 水印的安全？水印一般是为了保证数据的安全性，例如有这么一个场景：公司账户登录的平台系统，每个大大笑笑的页面都需要水印，但是水印添加了登录人的信息，登录时间等，如：张三...

命令备忘录对于brew安装的插件等需要特定的命令启动该服务，针对于mac而记录; 🪫 mongodb安装地址: https://www.mongodb.com/zh-cn/docs/v6.0/tutorial/install-mongodb-on-os-x/ 启动服务1brew services start mongodb/brew/mongodb-community 停止服务1brew services stop mongodb/brew/mongodb-community 🪫 nginx 安装 1brew install nginx 启动 1brew services start nginx 停止 1brew services stop nginx 重启 1brew services restart nginx 重新加载配置文件 1nginx -s reload 验证 nginx 配置文件是否正确 1nginx -t

背景最近在mac上重置了一下开发环境，像一些数据库，nginx之前是通过brew install下载安装的，如果你使用命令brew services start nginx启动它会一直在后台运行，如果用docker的话就可以不用brew services了，而且docker的nginx配置文件比brew的nginx配置文件要简单很多，而且docker的nginx配置文件可以很方便的映射到host的某个端口，这样host就可以直接访问nginx了。 总之，也算是另外的一种尝试了吧，就是吧所有的服务分小容器运行起来，然后通过docker-compose来管理这些容器。这样后期管理卸载安装更加方便。 安装docker的话就很简单了，可以直接安装桌面端版本，或者通过命令行安装。点击下载 安装成功之后，可以通过 1docker -v // 查看是否安装成功 拉取镜像镜像的拉取比较简单，只需要通过命令docker pull即可拉取镜像，比如拉取nginx镜像，命令如下： 12docker pull nginxdocker pull...

温馨提示基础git暂时这样整理完成，后期可继续整理; 配置 user 信息全局配置 user12git config --global user.name "username"git config --global user.email "username@example.com" config 的三个作用域缺省等同于 local； 12345678# local只对某个仓库有效git config --local# global对当前用户所有仓库有效git config --global# system 对系统所有登录的用户有效git config --system 显示 config 的配置，加--list 123git config --list --localgit config --list --globalgit config --list --system 创建一个仓库并配置 local 用户信息俩种场景 把已有的项目代码纳入 git 管理 12cd 项目代码所有的文件夹git init 新建的项目直接使用...

上篇文章说了一下如何使用宝塔在服务器部署前端的项目，但是这种做法虽然也是可以的，但是比较麻烦，每次迭代更新打包都需要手动上传dist文件到服务器下，那么接下来说一下使用jenkins在服务器上发布项目； 1panel需要使用docker环境安装，具体看官网 接下来具体说一下如何使用jenkins部署前端项目 安装 Jenkins首先在应用商店搜索jenkins，然后进行安装，接着傻瓜式安装，当然要勾选外部端口，这样才能访问http:xxxx:8080,等待其安装完成，安装成功之后，如下图: 找到图中的服务端口按钮，打开网页如图：这里需要输入密码，密码的存放地址在网页中已经标明，只需要在服务器上找到即可，但是这里我们在1panel中找到图一中的日志按钮，如图：接着在jenkins傻瓜式安装即可，如图： 然后等待jenkins安装完成自行配置用户名安装对应的插件, Nodejs, Git Parameter, Publish Over...

使用场景项目使用 node 开发, 开发过程中会遇到 node 一旦报错就会停止服务的问题，每次还要重新启动，比较麻烦，也是非常不方便的， 为了解决这样的问题，建议使用 pm2 去管理项目。 PM2 是什么？PM2（Process Manager 2 ）是具有内置负载均衡器的 Node.js 应用程序的生产运行时和进程管理器。 它允许您永久保持应用程序活跃，无需停机即可重新加载它们，并促进常见的 Devops 任务。 PM2 特性 日志管理：应用程序日志保存在服务器的硬盘中~/.pm2/logs/ 负载均衡：PM2 可以通过创建共享同一服务器端口的多个子进程来扩展您的应用程序。这样做还允许您以零秒停机时间重新启动应用程序。 终端监控：可以在终端中监控您的应用程序并检查应用程序运行状况（CPU 使用率，使用的内存，请求/分钟等）。 SSH 部署：自动部署，避免逐个在所有服务器中进行 ssh。 静态服务：支持静态服务器功能 多平台支持：适用于 Linux（稳定）和 macOS（稳定）和 Windows（稳定） 安装使用12345//...