- 博客(120)
- 收藏
- 关注
RSS订阅原创 【年度进化挑战汇报】计算机科学速成课（ Computer Science）学习笔记
《计算机科学速成课》学习分享：这套B站课程以通俗易懂的方式系统讲解计算机科学核心内容，包括硬件、软件、网络等模块。作者通过学习不仅建立了完整知识体系，还将碎片知识有机整合。文中附有精心整理的硬件、软件和计算机网络知识导图，为初学者提供清晰的学习路径。（98字）
2025-10-17 10:32:42
263
原创 年度进化挑战：从“前端实现者”到“智能体协作者”与“复杂问题定义者”
接下来一年的时间我将按照这份学习计划提升自己，每个月进行一次学习汇报。让我们看看一年后会发生什么吧。这条路充满挑战，但非常适合愿意深耕技术的你。一年后，你将不再是一个担心被淘汰的“前端开发”，而是一个。：整合全年所学，完成一个具有亮点的个人项目，并系统化输出，建立个人技术品牌。：从前端“开发”走向“架构”，并开始动手实践，构建初级AI智能体应用。：补齐后端知识，形成全栈视角，并能设计和实现更复杂的全栈智能体应用。：将AI深度集成到日常工作流，并开始系统性弥补计算机基础。，在市场上的竞争力将不可同日而语。
2025-10-10 11:05:06
929
原创 Vue项目中如何实现表格选中数据的 Excel 导出
本文介绍了如何使用xlsx和xlsx-js-style库实现Vue表格数据的Excel导出功能。主要内容包括：1）安装xlsx和xlsx-js-style库；2）核心代码实现表格数据选择和导出功能；3）通过xlsx-js-style设置表头样式（字体、背景色、边框等）和列宽自适应；4）最终效果展示。代码演示了如何将选中的表格数据转换为Excel文件，并提供了完整的样式设置示例，包括表头美化、单元格对齐和自适应列宽等功能。
2025-10-08 13:42:40
266
原创 解决wap2app中XGPlayer在部分安卓手机不显示的问题
本文分析了wap2app项目中XGPlayer播放m3u8视频的兼容性问题，主要源于WebView内核差异、安全上下文限制和播放器初始化逻辑缺陷。解决方案包括：启用腾讯X5内核替代系统WebView、确保HTTPS安全环境、优化播放器按需加载逻辑，并添加兼容性检测与错误提示。实施建议按优先级依次为启用X5内核、代码优化、用户体验改进和监控维护。这些措施可显著提升视频播放的兼容性和稳定性，建议建立完善的检测和监控体系以持续优化用户体验。
2025-09-23 14:17:38
979
原创 【uniapp/vue3】H5项目 调起摄像头扫描二维码并获取二维码信息
摘要 本文介绍了H5环境下的二维码扫描功能实现方案。核心内容包含：1) 通过环境检测区分H5和App平台，分别调用不同扫码方法；2) H5端采用jsQR库解析视频流中的二维码，通过创建video和canvas元素实现实时扫描；3) 详细处理了摄像头权限获取、错误处理及用户引导流程；4) 实现扫码弹窗UI组件，包含视频预览区和操作按钮。该方案解决了H5环境下无法直接调用原生扫码接口的问题，通过纯前端技术实现了跨浏览器的二维码扫描功能。
2025-09-19 10:47:03
308
原创 【Vue3+TypeScript+canvas+QRCode】实现背景图与动态二维码融合，并下载融合的最终图片
本文介绍了如何通过JavaScript实现海报生成功能，包含二维码生成和图片合成。代码展示了使用Canvas绘制背景图、通过QRCode库生成二维码，并将两者合成最终海报的过程。功能实现包括：1）加载背景图片；2）设置二维码参数（尺寸、颜色、边距）；3）定位二维码在背景图上的位置；4）将合成图片转为DataURL显示；5）提供图片下载功能，支持自定义文件名（含日期）。关键点涉及异步加载图片处理、Canvas绘图操作以及二维码生成配置。
2025-09-05 15:18:15
329
原创 【Vue3+TypeScript】H5项目集成企业微信JS-SDK实现获取客户信息功能、分享消息到当前会话
企业微信JS-SDK是企业微信提供给网页开发者的工具包，允许开发者在网页中使用企业微信的原生功能，如获取外部联系人信息、分享内容到会话等。
2025-09-05 15:02:42
940
原创 【Vue3+TypeScript】H5项目实现企业微信OAuth2.0授权登录完整指南
本文介绍了在Vue3+TypeScript项目中实现企业微信OAuth2.0授权登录的完整方案。核心流程包括：前端引导用户授权、获取授权code、与后端交互换取token、管理用户状态等。文章详细解析了路由守卫配置、状态管理、API接口设计等关键实现，并提供了核心代码示例。通过白名单机制、进度条控制和错误处理等细节，确保授权流程的安全性和用户体验。该方案可为企业内部应用提供便捷安全的登录功能，开发者可根据实际需求进行适当调整优化。
2025-09-05 14:06:45
646
原创 【Vue3+TypeScript】H5项目实现微信OAuth2.0授权登录完整指南
本文介绍了在Vue3+TypeScript项目中实现微信OAuth2.0授权登录的全过程。主要内容包括微信授权流程概述、核心代码实现（通过路由守卫处理授权逻辑）、部署注意事项（域名备案、HTTPS等）以及常见问题解决方案（重定向地址、跨域问题等）。文章提供了完整的代码示例和配置说明，帮助开发者快速集成微信登录功能，同时强调了生产环境的安全要求和用户体验优化要点。该方案适合需要为H5应用添加社交登录功能的开发者参考。
2025-09-05 13:38:21
598
原创 Vue3/xgplayer 西瓜播放器禁用拖拽进度条
本文介绍了三种禁用XGPlayer进度条的方法：1) 使用CSS隐藏进度条及相关元素；2) 通过Player配置排除进度条组件；3) 监听seeking事件防止拖拽进度条。配置方式包括新版controlPlugins数组和旧版controls对象两种形式，同时提供了禁用进度预览和限制拖拽范围的实现代码。这些方法可根据实际需求单独或组合使用，适用于需要严格控制视频播放进度的场景。
2025-09-03 15:57:05
450
原创 UniApp Vue3 TypeScript项目中使用xgplayer播放m3u8视频的显示问题
摘要： 在UniApp+Vue3+TS项目中，使用xgplayer播放m3u8视频时出现画面下移问题，仅全屏可正常显示。经排查，发现是动态创建的<video>元素定位异常脱离父容器。通过强制样式注入方案解决： 使用setTimeout延迟操作DOM，直接设置position:absolute和top:0等高优先级样式 优化建议采用MutationObserver精准监听DOM变化 根本原因为xgplayer动态渲染机制与Vue scoped样式冲突 提供H5/小程序环境下的差异化方案，推荐封装复
2025-08-08 16:10:46
1206
原创 AI大模型如何重塑前端开发流程？
AI大模型正深刻改变前端开发流程，通过代码生成、智能调试、自动化测试等提升效率。其优势包括降低开发门槛、加速知识获取，但也面临代码质量风险和数据隐私等挑战。未来，AI将与低代码平台深度融合，提供个性化编程助手，甚至实现全栈开发。开发者需合理利用AI，平衡效率与质量控制，迎接智能化开发的未来。AI时代已至，前端开发迎来全新变革。
2025-07-02 15:47:45
1071
原创 Vue3+TypeScript移动端H5播放器选型指南：M3U8与主流播放器深度解析
版权安全需求：优先TCPlayer私有加密方案包体积敏感：XGPlayer为最优解定制化程度：Video.js插件生态占优云端集成度：腾讯云用户直接选择TCPlayer未来趋势：WebCodecs API将逐步替代传统播放器架构，实现更低延迟的裸流解码。当前阶段，结合业务场景选择成熟方案仍是稳妥之道。
2025-06-24 16:59:55
1704
原创 高并发场景下前端性能优化手册：资源压缩、CDN配置与Web Workers实战
《高并发场景下的前端性能优化实战》摘要：面对百万级并发访问，前端性能优化成为业务存亡的关键。文章深入探讨了高并发前端面临的三大挑战（流量洪峰、资源瓶颈、线程阻塞），并提出系统化解决方案：通过Webpack资源压缩、WebP图像优化和字体子集化减少传输体积；利用CDN智能缓存策略提升命中率至98%；优化DOM操作与事件委托避免卡顿；使用Web Worker处理计算密集型任务。结合微信抢红包和电商秒杀等实战案例，展示分层防御、请求分时等优化策略，并强调性能监控五大核心指标（LCP、CLS等）。本文为企业构建高并
2025-06-16 09:48:54
1160
原创 【Vue3/Typescript】从零开始搭建H5移动端项目
本文介绍了Vue项目开发中的几个关键配置：1）集成ESLint进行代码规范检查，包括安装相关插件和配置eslint.config.mjs文件；2）使用unplugin-auto-import实现Vue相关函数的自动导入；3）推荐使用Vant作为移动端UI框架；4）通过postcss-pxtorem实现rem布局适配；5）针对iPhone X等机型进行底部安全区适配，在Vant组件中设置safe-area-inset属性。这些配置优化了开发体验并解决了移动端适配问题。
2025-06-12 13:42:08
681
原创 Vue3项目无法在IE浏览器运行
在安装并配置了babel、core-js等polyfill后，E浏览器（包括IE11）运行Vue3项目时出现“Unhandled promise rejection ReferenceError: ‘Proxy’未定义”错误。这是因为IE浏览器完全不支持ES6的Proxy对象，而Vue3的响应式系统底层大量依赖Proxy实现，因此Vue3项目无法在IE浏览器运行。即使使用了babel、core-js等polyfill，Proxy也无法被polyfill，这是浏览器本身的硬性限制。解决方案包括：1. 放弃IE
2025-05-22 14:05:27
543
原创 【Vue3/Typescript】合并多个pdf并预览打印，兼容低版本浏览器
最开始使用的方案是pdf-lib + printJs ,直接弹出打印窗口。但是在360浏览器中有时不会弹出打印窗口。经过排查发现pdf已经拼接并渲染完成，问题处在window.print()上。360有时会把非用户自发行为触发的打印行为当作广告屏蔽掉。window.print()不行便尝试了window.open()。在新窗口中打开拼接pdf，让用户手动触发打印行为。window.open()也会被拦截。最终决定的方案：弹出iframe弹窗，让用户触发打印。
2025-04-29 09:19:49
648
原创 【Vue3 / TypeScript】 项目兼容低版本浏览器的全面指南
兼容 IE11 等低版本浏览器保持现代开发体验实现渐进式增强维持良好的性能表现记住，兼容性是一个系统工程，需要从工具配置、代码编写到构建优化的全流程关注。随着浏览器市场的演变，建议定期评估和调整兼容性策略。本文方案已在多个企业级项目中验证，可支持千万级PV的稳定运行。实际应用中请根据项目具体情况调整配置参数。
2025-04-22 15:21:41
2149
2
原创 【Vue3/Typescript】根据图片路径下载图片并修改图片名称
【代码】【Vue3/Typescript】根据图片路径下载图片并修改图片名称。
2025-04-19 10:59:33
282
原创 解决 Vue3 项目中使用 pdfjs-dist 在旧版浏览器中的兼容性问题
实施上述任一解决方案后，在目标浏览器中重新加载应用，错误应该不再出现。如果问题仍然存在，可能需要检查是否有其他不兼容的 ES 新特性被使用。对于 Vue3 项目，推荐组合使用方案1和方案4，这样可以确保不仅解决当前问题，还能为其他可能的 ES 新特性提供兼容支持。如果可能，也可以考虑提示用户升级浏览器，因为 Chrome 86 已经是较旧的版本，许多现代 Web 特性可能无法支持。360极速浏览器13.5打不开网站，控制台报错。表明在浏览器内核版本 86.0.420.198 中，在项目的入口文件（如。
2025-04-19 10:44:00
1773
原创 使用 iframe 实现浏览器打印兼容性优化，控制页眉页脚
规则进行打印控制，但低版本浏览器（如 IE9-11、旧版 Firefox/Safari）可能无法正确应用这些样式。在前端开发中，打印功能是一个常见的需求，但不同浏览器对打印样式的支持差异较大，尤其是页眉页脚的控制。的方法，分析其原理、兼容性优势，并提供完整的实现方案。如果你的项目需要兼容 IE9+ 或旧版移动端浏览器，
2025-04-19 10:21:34
1286
1
原创 Uniapp Vue3 小程序接入实时音视频TUICallKit遇到的问题
将 TUICallKit 使用分包集成之后，主包中的 vendor,js 会变得非常大，这也是目前遇到的痛点问题。这是因为 uniapp 打包小程序在 Vue2 和 Vue3 上打包机制存在差异。Vue2 使用 webpack 打包，独立分包中都会有单独的 vendor,js 不存在包体积问题。Vue3 使用 vite。没有找到解决方案，改用vue2了。vue2分包不占用主包体积。打包，分包中的依赖会被打入主包中，造成主包体积过大问题。操作后主包的vendor.js依旧很大。
2025-04-03 11:28:49
959
1
原创 《Postcss - pxtorem在Vue3中实现自适应原理与实践》
Postcss - pxtorem是一个PostCSS插件，它的主要作用是将CSS中的px单位转换为rem单位。在网页开发中，rem是一个相对单位，它是相对于根元素（html元素）的字体大小来计算的。通过将px转换为rem，我们可以方便地实现页面在不同设备屏幕尺寸下的自适应。
2024-12-04 15:09:23
1602
1
原创 浏览器数据存储方法深度剖析：LocalStorage、IndexedDB、Cookies、OPFS 与 WASM - SQLite
1994 年由网景公司引入的 Cookies，主要用于存储小型键值数据，在会话管理、个性化和跟踪等方面发挥着重要作用。它不仅存储在客户端，还会随每个 HTTP 请求发送到服务器，因此其存储容量有限，通常每个 Cookie 不超过 4KB（RFC - 6265 规定）。虽然其存储的数据量小，但由于是 Web 的重要基础特性，在性能优化方面一直备受关注，如 Chromium 的共享内存版本控制和异步 CookieStore API。
2024-12-03 14:18:58
1728
原创 深入理解 Viewport Meta 标记及其基本属性的使用场景
Viewport（视口）是用户在网页上能够看到的区域。而viewport meta标记则是HTML中用于控制视口的设置。它位于标签内部，通过它我们可以告诉浏览器如何对页面进行缩放和布局，从而适配不同的设备屏幕。
2024-11-28 08:38:13
1007
原创 Ajax、Fetch、Axios、XMLHttpRequest 的关系与区别
XMLHttpRequest 是一种用于在 Web 浏览器和服务器之间进行异步数据传输的 API。它算得上是早期实现浏览器端异步请求的核心技术，通过它可以在不刷新整个页面的情况下，向服务器发送 HTTP 请求并获取响应数据，然后借助 JavaScript 来对获取到的数据进行操作，进而更新页面的部分内容。例如，早期的网页中实现简单的动态加载更多内容的功能，很多就是依靠 XMLHttpRequest 来发送请求获取新数据并展示的。
2024-11-27 11:48:01
1905
原创 Vue3 Typescript 前端页面5min后无操作自动退出至登录页面
前端页面5min无操作，弹出弹窗提示用户系统将在30s后退出，30s后系统自动退出至登录页面。
2024-09-30 09:35:57
1005
1
原创 实现语音合成的三种方法：HTML5 Web Speech 、speak-tts、百度语音合成
在前端开发中，文字转语音（Text-to-Speech, TTS）技术是一种非常实用的功能，广泛应用于教育、商业、娱乐以及无障碍辅助等多个领域。和speak-tts，并对比它们的优缺点及适用场景。
2024-09-27 10:44:38
6878
3
原创 用CSS 方式设置 table 样式
在现代Web开发中，使用CSS来设置table的样式是一种常见且强大的方法，它能让你的表格数据既美观又易于阅读。下面我将通过一个示例来展示如何使用现代CSS技巧来美化表格。
2024-09-09 09:01:46
2347
原创 解决苹果手机通过getUserMedia唤起摄像头出现黑屏问题
在iOS设备上，用户必须明确授权网站或应用访问摄像头。如果用户在首次请求时没有授权，或者之后更改了权限设置，那么摄像头将无法正常工作。API 要求在安全的上下文中使用，即你的网页必须通过HTTPS协议提供。如果你的网站还在使用HTTP，那么你需要将其升级到HTTPS。虽然大多数现代浏览器（包括Safari）都支持这一API，但最好还是在。之前，用户已经授权了摄像头访问权限。首先，确保你正在使用的浏览器支持。上检查最新的兼容性信息。
2024-09-06 17:19:00
1376
原创 揭秘开发者效率飞升的秘密武器：选择合适的编程工具
选择合适的编程工具是提升开发者工作效率的关键。无论是智能的代码编辑器、强大的版本控制工具，还是那些让我们事半功倍的自动化脚本，它们都在各自的领域发挥着不可替代的作用。通过不断学习和尝试新的工具和技术，我们可以不断优化自己的工作流程，实现效率的飞升。希望每位开发者都能找到适合自己的秘密武器，在软件开发的道路上越走越远。
2024-09-06 11:45:00
1266
原创 navigator.mediaDevices.getUserMedia检查用户的摄像头是否可用，虚拟摄像头问题
API 提供了这一功能，它允许你请求访问用户的媒体设备，如摄像头和麦克风。虽然这个API本身主要用于获取媒体流，但你可以通过尝试获取摄像头流来间接检查摄像头是否可用。通过stream.getVideoTracks()，获取当前设备，发现是虚拟摄像头的问题。如果成功，我们会在控制台中打印一条消息，并可以将视频流绑定到一个。在Web开发中，检查用户的摄像头是否可用是一个常见的需求，尤其是在需要视频聊天或录制视频的应用程序中。如果失败，我们会捕获错误并根据错误的类型显示相应的消息给用户。
2024-09-06 11:23:34
1027
原创 React、Vue.js 和 Angular主流前端框架介绍与选择指南
在当今的前端开发领域，选择合适的框架对于项目的成功至关重要。本文将介绍几个主流的前端框架——React、Vue.js 和Angular，探讨它们各自的特点、开发场景、优缺点，并提供选择框架的建议。
2024-09-04 15:52:14
1590
原创 Vue3 + TypeScript 实现防抖（Debounce）和节流（Throttle）
在Vue3项目中结合TypeScript使用防抖（Debounce）和节流（Throttle）技术，可以有效提升应用的性能和用户体验，尤其是在处理频繁触发的事件（如滚动、窗口大小调整、输入框内容变化等）时。下面将详细介绍这两种技术的原理、使用方法以及适用场景。
2024-09-04 13:47:25
2104
原创 前端之路，与大师同行：不容错过的技术大牛博客精选
前端程序员在不断提升自己的过程中，需要关注多个方面，包括技术能力的提升、职业素养的增强以及持续学习的态度。以下是一些具体的建议：深入学习基础技术：关注新技术和趋势：实战项目经验：代码质量和性能优化：团队合作和沟通能力：持续学习和自我提升：解决问题的能力：设定学习目标：制定学习计划：实践和应用：反思和总结：《CSS世界三部曲》（包括《CSS世界》、《CSS选择器世界》、《CSS新世界》）《JavaScript高级程序设计（第4版）》《JavaScript权威指南（犀牛书）》《ES6标准入门（第三版）》《高性能
2024-09-03 14:31:38
1454
1
原创 ES6 reduce方法详解：示例、应用场景与实用技巧
在JavaScript中，reduce方法是一个非常强大的数组方法，它允许你将数组中的元素归并（reduce）为单个值。reduce方法执行一个由你提供的reducer函数（归并函数），将其结果汇总为单一的返回值。
2024-09-03 11:07:48
2199
原创 ES6中新增的Set方法详解
在ES6（ECMAScript 2015）中，Set是一种新的数据结构，它提供了一种存储任何类型唯一值的方式，无论是原始值还是对象引用。本文将详细介绍Set的特点、解决的问题、使用场景以及使用方法。
2024-08-30 08:52:01
541
原创 Promise：JavaScript 中的异步编程解决方案
在JavaScript中，Promise是一种用于异步编程的对象，它提供了一种更优雅的方式来处理异步操作的成功和失败，相比传统的回调函数方法，Promise让代码更加简洁、易读、易维护。本文将详细介绍Promise的特点、用法以及它解决的问题。
2024-08-29 17:54:20
553
《信息系统项目管理师教程第4版》第1章至第5章信息化发展、信息技术发展、信息系统治理、信息系统管理信息系统工程思维导图xmind
2023-09-22
《信息系统项目管理师教程（第4版）》第3章 信息系统治理知识点整理 xmind思维导图
2023-09-22
《信息系统项目管理师教程（第4版）》第2章信息技术发展知识点、考点、xmind思维导图
2023-09-21
《信息系统项目管理师教程（第4版）》第1章 信息化发展 知识点整理 xmind思维导图
2023-09-21
《信息系统项目管理师教程（第4版）》第19章 配置与变更管理 知识点整理 xmind思维导图
2023-09-11
《信息系统项目管理师教程（第4版）》第18章 干系人管理 知识点整理 xmind思维导图
2023-09-04
《信息系统项目管理师教程（第4版）》第17章 采购管理、合同管理 知识点整理，xmind知识导图
2023-09-01
《信息系统项目管理师教程（第4版）》软考高级 第九章 项目范围管理 知识点、思维导图整理
2023-08-15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人