html网页设计、web前后端网站制作、大学生网页设计作业、jQuery网站设计、uniapp小程序、vue网站设计、网页成品模板、期末大作业，各种源码应有尽有，持续更新中...

原创 【Vue实战】手把手教你在 Vue 项目中开启 Gzip 压缩，打包体积瞬间减少 70%！

本文详细介绍了在Vue2/3项目中实现Gzip压缩的两种方案：构建时预压缩（推荐）和服务器实时压缩。通过配置Webpack/Vite插件生成.gz文件，结合Nginx的gzip_static指令，可显著减小资源体积（60%-80%），提升首屏加载速度。文章包含具体配置步骤、Nginx优化指南、验证方法及常见问题解答，建议生产环境同时保留原文件作为兜底。该优化手段能有效节省带宽成本，提升用户体验。

原创 LangChain框架 环境搭建 申请框架 安装使用

LangChain：记忆体、智能体、提示词、LLM、组件链。4.将秘钥设置环境变量DASHSCOPE_API_KEY。1.安装Anaconda Navigator。2.执行上面命令安装框架。3.千问申请API服务。

原创 告别 AI 乱写 Vue！用 vue-skills 构建前端智能编码标准

如果你是 Vue 开发者，尤其是负责架构或工程效能的同学，现在就是关注并尝试 vue-skills 的最佳时机。因为从今天起，写代码不再是单打独斗，而是你与 AI 共同遵循一套智能契约的过程。📜 开源协议：MIT（可免费用于商业项目）

原创 为什么你的 Token 不该由前端存储？—— 深入理解 HttpOnly Cookie 与前端 Cookie 的安全差异

HttpOnly Cookie是防范XSS攻击窃取Token的关键方案，通过禁止JavaScript访问敏感Cookie，有效提升前端安全性。相比前端直接存储Token（如localStorage或document.cookie），HttpOnly Cookie由后端通过Set-Cookie头设置，浏览器自动携带但禁止JS读取，彻底阻断XSS窃取路径。实现时需前后端协作：后端配置httpOnly、Secure等属性，前端启用withCredentials跨域携带。

原创 使用 retire.js 自动检测前端 JavaScript 库漏洞

retire.js是一个开源的 JavaScript 库漏洞扫描工具，由扫描本地 JS 文件、HTML、Node.js 项目自动识别框架版本（即使被压缩/混淆）对接 CVE/NVD 官方漏洞数据库输出详细风险报告（含 CVE 编号、修复建议）等打包文件可能隐藏高危漏洞；retire.js 能自动识别压缩后的库版本并匹配 CVE；建议将 retire.js纳入 DevSecOps 流程，实现“左移安全”；内网系统也需修复，防止横向渗透。🔗延伸阅读。

原创 解决使用jsPDF实现表格数据导出pdf功能时中文乱码问题

在制作日志的导出功能时，使用jspdf插件导出，虽成功导出但是发现表头和中文内容全是乱码。经查阅资料发现jsPDF是对中文支持非常差的PDF库，所以需要外部引入中文库注册使用。

原创 uni-app 沉浸式导航完美适配方案：刘海屏 & 手机“下巴”安全区域全端兼容实践

本文介绍了一套在uni-app中实现沉浸式布局的全端兼容方案，重点解决安全区域适配问题。通过JavaScript动态获取设备状态栏高度和底部安全区域尺寸，并转换为rpx单位实现精准布局。方案包含健壮的工具函数封装，提供异常兜底处理，支持灵活偏移调整，无需硬编码或依赖特定CSS特性。已在多个上线项目中验证，能适配刘海屏、全面屏和折叠屏等各类设备，实现"让布局适应设备"的设计理念。

原创 基于 Three.js + MediaPipe 实现手势操控的 3D 圣诞树 —— 用代码点亮节日氛围！

摘要：本文介绍了一个基于浏览器的3D交互式圣诞树项目，使用Three.js构建粒子系统，通过MediaPipe实现手势控制。用户可通过手势切换三种模式：经典圣诞树造型、装饰物散开成星空状、聚焦照片展示。项目采用WebGL渲染、光晕特效等技术，完全运行在浏览器端，无需后端支持。文章详细解析了粒子系统、手势识别、用户交互等核心功能，并提供了完整的HTML代码实现，适合作为节日贺卡、教学案例或创意前端项目参考。

原创 微信小程序实现语音播报功能：基于「同声传译」插件 + WebSocket 实时导航提醒

通过微信官方「同声传译」插件，我们可以在小程序中轻松实现高质量的中文语音播报，结合 WebSocket 实现实时导航提醒，适用于港口调度、物流跟踪、智能出行等场景。💡提示：该插件免费，但有调用频率限制（通常足够日常使用）。如需更高并发，可考虑自建 TTS 服务 + 返回音频 URL。

原创 微信小程序沉浸式页面开发：全面适配 iPhone 刘海屏与安卓全面屏安全区域

iPhone X 及以上机型：顶部有“刘海”（状态栏+传感器区域），底部有“Home Indicator”手势条。安卓全面屏：可能有挖孔、水滴、曲面屏圆角，或系统级手势导航栏（占用底部空间）。若页面内容延伸到这些区域，文字/按钮可能被遮挡，交互区域过小，严重影响体验。✅ 解决方案：使用CSS 环境变量获取安全边距。关键点说明✅ 配置开启沉浸式✅ 使用自动适配 iOS/安卓安全区✅ 结合max()或默认 padding保障老旧设备兼容性✅ 背景设在page，内容加安全区 padding。

原创 微信小程序与web-view页面双向通信

网页和小程序之间即时传参无法实现，不过小程序可以通过web-view的src属性来切换网页，网页也可以通过wx.miniProgram.navigateTo()来切换小程序的页面。1、miniProgram --> webviewH5 官网没有提供发送的接口，只能通过修改web-view的src属性，使用&来附加参数，并在网页中解析参数。在网页中引入jweixin-x.x.x.js，然后通过js调用微信JSSDK的wx.miniProgram.postMessage()来向小程序发送数据。

原创 Web 项目地图选型指南：从 Leaflet 到 MapTalks，如何选择合适的地图引擎？

没有“最好”的地图引擎，只有“最合适”的选择。追求简单快速？→ 高德/百度。需要极致性能与可控性？→ MapTalks。打造国际化炫酷体验？→ Mapbox。构建专业 GIS 系统？MapTalks 作为国产开源力量的代表，在高性能、3D、私有化部署等场景展现出独特优势，值得国内开发者重点关注。📌项目启动前，不妨用 1 天时间分别跑通 Leaflet、高德、MapTalks 的 Demo —— 实践出真知。

原创 nvm快速安装

我这边默认位置安装为D:\app\nvm。

原创 uniapp高性能ui框架uni-ui

目前为止，在小程序和混合app领域，暂时还没有比uni-ui更高性能的框架。虽然uni-app支持小程序自定义组件，所有小程序的ui库都可以用。但小程序自定义组件的ui库都需要使用setData手动更新数据，在大数据量时、或高频更新数据时，很容易产生性能问题。而uni-ui属于vue组件，uni-app引擎底层自动diff更新数据。当然其实插件市场里众多vue组件都具备这个特点。非H5，不管是小程序还是App，不管是app的webview渲染还是原生渲染，全都是逻辑层和视图层分离的。

原创 在线预览docx、ppt、excel、doc、pdf等文档解决方案

要实现文档的在线预览方案有很多，汇总如下：一、将文档转换为图片来预览二、将文档转换为PDF来浏览1.PDF.js三、将文档转换为HTML来浏览四、搭建Office Online Server服务五、使用第三方付费SAAS服务1.简介-WebOffice 知识库2.腾讯文档-官方网站-支持多人在线编辑Word、Excel和PPT文档3.文档转换_API 文档_智能多媒体服务 - 七牛开发者中心六、开源方案。

原创 css透明背景物体发光代码

【代码】css透明背景物体发光代码。

原创 Flutter在Windows平台下的安装配置

安装Android Studio时，会默认下载安装Android SDK，所以下一步直接安装Android Studio.其中带X的表示需要安装的东西， 如我这里需要再安装Android toolchain 与 Android Studio.), 解压到指定目录, 双击运行flutter_console.bat, 完成sdk安装, 如图.选择 Flutter, 安装, 弹出 Dart 插件安装时, 选择是.第一次接触移动开发, 纯小白一枚, 慢慢摸索, 记录安装.全程 Next, 直到 Finish.

原创 vue3 自动导入导出同级别目录下所有的.vue组件

【代码】vue3 自动导入导出同级别目录下所有的.vue组件。

原创 前端接入海康威视摄像头的三种方案

2. 避免在前端硬编码密码（推荐通过后端接口鉴权）2. Vue组件（使用JSMpeg播放）1. 使用HTTPS加密通信。3. 设置摄像头IP白名单。2. 封装Vue组件。

原创 vue-json-viewer 页面展示json数据

【代码】vue-json-viewer 页面展示json数据。

原创 requestAnimationFrame高性能动画循环接口

（简称 ​）是浏览器提供的专门用于优化动画性能的 API，它会在每次屏幕刷新前执行回调函数，从而实现流畅的动画效果。

原创 微信小程序跳转传参方式

在微信小程序中使用。

原创 若依框架修改器(RuoYi-MT) - 快速开发利器

选中下载的压缩包。

原创 uniapp微信小程序视频实时流+pc端预览方案

​完全零成本​：​轻度付费​：​企业级推荐​： 该方案是 ​Uniapp微信小程序 + PC端视频实时预览​ 的一种 ​低成本、纯前端实现​ 的技术方案，适用于 ​低帧率、非严格实时​ 的场景。​小程序端​：​PC端​：uniapp微信小程序端：

原创 网站url设置不显示.html

<a href="./index">首页</a>

原创 阿里OSS服务AccessKey环境变量配置教程

在终端中执行以下命令，查看默认Shell类型。1.在PowerShell中运行以下命令。1.执行以下命令来将环境变量设置追加到。1.执行以下命令来将环境变量设置追加到。3.执行以下命令检查环境变量是否生效。2.运行以下命令，检查环境变量是否生效。2.运行以下命令，检查环境变量是否生效。3.执行以下命令检查环境变量是否生效。执行以下命令检查环境变量是否生效。根据默认Shell类型进行操作。2.执行以下命令使变更生效。2.执行以下命令使变更生效。1.在CMD中运行以下命令。执行以下命令使变更生效。

原创 WebRTC 方案全面介绍

WebRTC（Web Real-Time Communication）是一种支持浏览器和移动端实时音视频通信的技术。

原创 uniapp小程序获取手机设备安全距离

【代码】uniapp小程序获取手机设备安全距离。

原创 maven安装步骤

以后链接中央仓库下载jar包都会保存在这里。解压成功后新建文件夹 本地仓库地址。

原创 MySQL安装步骤

1.去mysql官网下载稳定版，下载完毕后在无中文、空格的文件夹解压。mysql -uroot -p回车手动输入密码。将admin管理员账户密码改为root。3.初始化mysql数据。5.启动 mysql服务。exit 退出mysql。6.修改默认账号密码。

原创 Linux安装JDK

原创 CentOS 中安装 vim

按照上述步骤操作，通常可以成功安装。

原创 nginx.conf反向代理 负载均衡

【代码】nginx.conf反向代理。

原创 CentOS下载网站

清华大学开源镜像站：https://mirrors.tuna.tsinghua.edu.cn/阿里开源镜像站：https://developer.aliyun.com/mirror/腾讯开源镜像站：https://mirrors.cloud.tencent.com/CentOS可以到下面的网站下载。

原创 Element Plus 表格拖拽排序方案

​​优先选 el-table​​：若项目已稳定使用 Element Plus，且拖拽需求简单，通过 Sortable.js 实现更轻量。​​优先选 Vxe Table​​：若项目允许引入新组件库，或需要行列拖拽、树形拖拽等高级功能，Vxe 的开发效率更高。​​数据唯一性​​：确保row-key或useKey配置唯一标识​​样式优化​​：通过 CSS 调整拖拽占位符（如​​异步提交​​：拖拽完成后可调用接口更新后端数据。

原创 用《易经》《圣经》来理解宇宙

易经》与《圣经》虽根植于不同文明土壤，却共同回应了人类对宇宙本质的追问。《易经》以自然为本，揭示内在规律；《圣经》以神为本，赋予终极目的。二者在科学语境下的重新解读，或可为跨文化对话提供新维度——正如《易经》的“变易”与《圣经》的“永恒”共同构成宇宙的一体两面58。

原创 Tree Shaking（摇树优化）详解

Tree Shaking 是现代 JavaScript 打包工具（如 Webpack、Rollup、Vite等）中的一项重要优化技术，它的名字形象地比喻为"摇动一棵树，让没用的叶子掉下来"。

原创 lodash-es 详解

是使用 ​​ 语法从lodash-es包中按需导入cloneDeep函数。

原创 VueDOMPurifyHTML 防止 ​​XSS（跨站脚本攻击）​​ 风险

是一个 ​​，用于在v-html指令中安全地渲染 HTML 内容，防止 ​​ 风险。

原创 Vue3 + Vite 打包后外部文件路径问题解决方案

在 Vue3 + Vite 项目中，当你在index.html中引入外部文件（如 jQuery）并在打包后遇到路径错误时，这是因为 Vite 的打包机制与开发环境的处理方式不同。