Knowledge Base | 知识库

Explanation | 图例说明

• :white_check_mark: : finished | 已完成

• :construction: : ongoing | 进行中

• :memo: : to do | 待完成

• :fire: : cancelled | 已放弃或已取消

Front-end | 前端

:construction: 美化 PDF 浏览页面

:construction: 前端代码混淆

:construction: 利用 fingerprintjs2 区分用户设备

:fire: 前端页面文本搜索及高亮

:white_check_mark: 浏览器控制台 get favicon.ico 404 提示

CSS

:white_check_mark: 旧 iPhone 上图片被纵向拉得很长

:white_check_mark: 响应式设计的屏幕尺寸断点

:white_check_mark: 解决页面加载图片时的抖动问题

:construction: 通过 CSS 区分桌面端和移动端

:white_check_mark: 图片保持比例并最大化显示

:white_check_mark: 为列表元素的前 N 项设置自定义样式

:white_check_mark: 网页加载完毕再显示页面

:memo: 让 flexbox 适配低端设备

:white_check_mark: 安卓点击表单元素页面变形

:white_check_mark: CSS 强制惯性滚动

:white_check_mark: iOS 页面滚动光标不跟随

WeChat & QQ | 微信 & QQ

:white_check_mark: 自定义微信/QQ分享链接给好友/朋友圈/QQ空间的卡片样式

:memo: 隐藏微信内页面底部导航栏

:memo: 微信内网页标题变成“全文翻译”按钮

:white_check_mark: 网页字号不随微信 APP 设置而变化

:white_check_mark: 微信内网页授权获取用户信息

:white_check_mark: 微信内网页静默获取 OpenID

:memo: 公司接入微信支付功能

:white_check_mark: 禁止 X5 浏览器（手Q/微信）播放完视频后推荐相关内容

:memo: 手机QQ/TIM页面title为空时的问题

:construction: 手Q微信点击左上角返回上一页

:white_check_mark: 手Q内置浏览器中点击链接加群

:construction: 跳过微信内置浏览器缓存

:construction: 旧手机/平板安装旧版微信

:white_check_mark: 测试微信中网页跳转是否有提示

:white_check_mark: 微信 JS-SDK 接口调用

:fire: 微信公众号文章展示 HTML 页面

微信小程序

:construction: 微信小程序开发资料汇总

Online Reading | 在线阅读

:construction: 调研微信读书相关资料

Browser | 浏览器

:white_check_mark: HTTPS 页面无法加载 HTTP iframe

:white_check_mark: IE 和 Edge 浏览器的生命周期

:white_check_mark: 检查浏览器是否为 IE

:white_check_mark: 让 360 浏览器用极速内核渲染页面

:construction: 通过代码清空浏览器缓存

:white_check_mark: 强制浏览器下载文件而不是查看文件内容

:white_check_mark: session cookie 在浏览器软件关闭后未被删除

:white_check_mark: 浏览器的 Referrer-Policy 设置

:white_check_mark: 在域名 A 中设置域名 B 的 cookie

Domain | 域名

:white_check_mark: 几种常用的 DNS 解析记录类型

:white_check_mark: 用户访问一级域名时自动重定向至 www 二级域名

Scaffold-ETH

:white_check_mark: Scaffold-ETH 脚手架运行时报错：Can't resolve 'react-refresh/runtime' in Error from chokidar (C:): Error: EBUSY: resource busy or locked, lstat 'C:\DumpStack.log.tmp

:white_check_mark: Scaffold-ETH 脚手架运行前端部分时报错：'react-scripts' 不是内部或外部命令，也不是可运行的程序或批处理文件

JavaScript

:white_check_mark: 将 Base64 格式的图片转换为 Blob

:construction: JS 区分鼠标和触摸板

:white_check_mark: JS 判断用户在触摸屏上的滑动方向

:white_check_mark: 在控制台完整地、格式化输出变量

:white_check_mark: 调用压缩后的 JS 库的 API

:white_check_mark: ExcelJS 在前端浏览器中读取 Excel 文件内容

:white_check_mark: 统一代码及数据中的时区

:white_check_mark: 在回调函数中访问“正确”的 this

:white_check_mark: 遍历DOM节点的正确方法

:white_check_mark: 烟花特效

:white_check_mark: JS 实现文本复制功能

:white_check_mark: 网页导出数据至 Excel

:white_check_mark: 生成不重复的随机字符串

:white_check_mark: 编写 CNZZ 工具函数

:white_check_mark: 简写 document.querySelector()

Vue

:white_check_mark: Vue.js 动态加载组件并动态传参

:white_check_mark: Vue-Cli / Ant Design Vue 项目打包体积优化

:white_check_mark: Vue 中的样式无法应用到 v-html 渲染的 DOM 中

:white_check_mark: 向 Vue 中的 img 元素动态传入 src 值

:white_check_mark: 嵌套路由与 router-view

:white_check_mark: Vue click 事件绑定函数中播放音频的代码失效

:white_check_mark: 只在指定的 Vue 组件中加载外部 JS 文件

:white_check_mark: Vue-Cli 项目将本地环境模拟为线上环境

:white_check_mark: 将 Vue-Cli 项目配置在网站的子路径下

:memo: 一个 vue-cli 项目编译生成多个子项目

:memo: vue-js-modal 生成的对话框中元素不能立即使用

:memo: Vue 组件修改网页标题

:white_check_mark: vue-cli 项目为开发/生产环境引用不同的外部 JS 库

:white_check_mark: vue-cli 项目中引用 CDN 上的 JS/CSS 库

:white_check_mark: vue-cli 引入外部 JS 库的两种方式

:white_check_mark: vue-cli 引用 CSS 库

:white_check_mark: vue-cli CSS 背景图片路径设置

:white_check_mark: vue-cli 的 index.html 中不能用字符串模板

:white_check_mark: vue-js-modal 正确用法

React

:white_check_mark: Create React App 配置静态资源文件相对路径

Qrcode | 二维码

:white_check_mark: 前端生成二维码并检查

:white_check_mark: Puppeteer 批量自动生成并保存二维码

:white_check_mark: 草料二维码之活码原理分析

Back-end | 后端

:white_check_mark: 修改 Node.js 控制台输出结果

:white_check_mark: 解决后端接口的 PayloadTooLargeError: request entity too large 错误

:white_check_mark: Postman + Charles 检查后端服务迁移结果

:white_check_mark: 重复设置 CORS headers（跨域头）

:memo: 网站开启QQ登录功能

:white_check_mark: Node.js + Babel 7 搞定 ES6

:white_check_mark: Windows 下 tusd 编译安装全流程

:white_check_mark: 限制 IP 访问指定路径

Express.js

:white_check_mark: Express.js 中间件向下一个函数传递值

:white_check_mark: 确保 Express.js res.redirect 不会被改回后端项目所在域名

:white_check_mark: 解决 res.redirect 部分失败的问题：根本问题已被上面的方法所解决

Go

:white_check_mark: 解决 go get 太慢的问题

Audio & Video | 音视频

:white_check_mark: 手写一个音频播放器

:white_check_mark: 微信内网页自动播放音频

:white_check_mark: 加载音频时各事件触发顺序

:white_check_mark: 各款手机的流媒体兼容性记录

:white_check_mark: 检查页面中视频是否处于播放状态

:white_check_mark: 前端页面播放流媒体

:white_check_mark: iOS 视频自动播放

:memo: 常规视频处理成流媒体

Database | 数据库

:construction: 数据库选型：MySQL vs MongoDB

MongoDB

:white_check_mark: MongoDB 查找指定字段值的字符串长度大于某个值的文档

:white_check_mark: MongoDB 对指定字段执行 trim 方法

:white_check_mark: MongoDB 批量修改某一时刻之后创建的文档

:white_check_mark: MongoDB 从数组型字段中选出符合要求的元素

:white_check_mark: Mongoose unique 属性不生效

:white_check_mark: Mongoose 异步执行

Docker

:white_check_mark: 在 Windows Docker 中下载基于 Linux 的镜像

:white_check_mark: 修改 Windows Server 自带 Docker 的 registry

Test | 测试

:memo: 测试相关

Debug | 调试

:white_check_mark: 用 Charles 将外网服务重写至 localhost

:white_check_mark: 某网站 CPU 占用过高原因排查

:white_check_mark: 让 Charles 监听 localhost 的 HTTP 请求

:white_check_mark: 让 Charles 解析 HTTPS 请求

Web Resource Protection | 网站资源保护

:memo: 禁用浏览器开发者工具

:memo: 网页正常显示图片的同时禁止下载

Full Stack | 全栈

:construction: nw.js 开发笔记

Code Style | 代码风格/规范

:white_check_mark: ESLint 根据操作系统决定合理的换行符样式

Git

:white_check_mark: Git 只追踪指定目录下的变更

:white_check_mark: 命令行方式将 fork 项目与上游项目同步

:white_check_mark: Git 将 local branch 与 remote branch 关联

:white_check_mark: GIT 获取文件最初创建及最新修改日期

:memo: Git hook 实现自动部署

:white_check_mark: 各版本 Git 安装程序的区别

Server | 服务器

:memo: 网站压力测试

Nginx

:white_check_mark: Nginx 可视化配置工具

:white_check_mark: HTTP 请求头中的 Authorization 字段未被允许

:white_check_mark: Nginx 不允许跨域请求

:white_check_mark: Nginx OPTIONS 请求 405 错误

:memo: Nginx 保护网站资源

:white_check_mark: Windows 下 Nginx 的安装、配置、持久化运行

PowerShell

:white_check_mark: 用 PowerShell 给 Windows 系统安装补丁并自动重启

:white_check_mark: PowerShell 调用阿里云 Cli 创建手动快照并重启实例

:white_check_mark: 一个文件夹中最多能存放多少个文件？

Linux

:white_check_mark: Linux 中对 tail -f 命令应用 grep

:white_check_mark: History 命令显示执行时间

:white_check_mark: CentOS 测试网速

:white_check_mark: CentOS 内核版本辨析

:white_check_mark: CentOS 的生命周期

远程桌面连接

:white_check_mark: Windows 通过远程桌面连接 CentOS GUI

:white_check_mark: Windows 远程桌面连接客户端无法记住账户

PM2

PM2 日志自动切割

IIS

:white_check_mark: IIS 合理配置缓存

:white_check_mark: IIS 日志统计分析

:memo: IIS URL重写至http(s)全部404，其余情况正常

:memo: IIS 管理跨域请求

:white_check_mark: IIS 中针对单个网站限速无效

:white_check_mark: IIS URL 重定向将 https 定向至 http

:white_check_mark: IIS URL 重写规则表现为重定向

:white_check_mark: IIS 网站 HTTP 访问正常，HTTPS 无法访问

:construction: Windows 服务器 IIS 网站设置硬件资源配额

:white_check_mark: IIS 中将网站下的 HTTP 请求全部重定向到 HTTPS

:white_check_mark: IIS 服务器上的 mp4 在 iOS 上无法播放

:white_check_mark: IIS 代理的 vue-cli 页面无法稳定访问

:memo: 理解 IIS 的 URL 重写

Security | 安全

:white_check_mark: SSL 双向认证以限制用户访问

Topics | 专题

:memo: JS/JavaScript/Node.js 前端/后端文件上传

Software | 软件

:white_check_mark: 用 iCloud Photos Downloader 备份数据至本地

:white_check_mark: ImageMagick 使用笔记

:white_check_mark: 用 Prettier 格式化项目代码

:memo: Windows 下静默安装 Node.js

:memo: PDF 另存为/转换为 JPEG

:white_check_mark: FastCopy 使用笔记

:white_check_mark: 微软产品的生命周期(Lifecycle of Microsoft Products)

:white_check_mark: Windows 下安装配置 OpenSSH 并通过 VSCode SSH 连接

:white_check_mark: 通过 Mac 输出 iPhone 的画面和声音

:white_check_mark: 鼠须管输入法设置 - Mac 版

:white_check_mark: GitHub 项目用代理推送至服务器

:white_check_mark: 跨平台开发源码文件换行问题

:white_check_mark: Windows 系统 Node 开发环境重置

:white_check_mark: 让 macOS 终端也能用上 SSR

:white_check_mark: 全局安装的 npm 包无法使用

:white_check_mark: Windows 下使用 Node.js 的注意事项

:white_check_mark: Ngrok

PDF

:white_check_mark: Adobe Acrobat Pro 批量删除 PDF 元数据

:fire: PDF 图书内容转换

Total Commander

:white_check_mark: 批量重命名 → 编辑名称时不使用 ANSI 编码

:white_check_mark: 让文件/夹按数字大小升序排列