
前端开发
文章平均质量分 74
oliver.chau
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
JWT与传统鉴权机制对比及免登录方案
JWT鉴权技术解析 本文对比JWT与传统鉴权机制,详细剖析JWT的三段式结构(Header/Payload/Signature)及其加密原理。重点阐述:1)JWT通过签名防篡改机制保障安全性;2)无需后端存储的性能优势;3)浏览器切换时的同步问题及解决方案(云端同步/扫码登录)。指出默认情况下跨浏览器需重新登录,但通过主动同步机制可实现无感切换。最后给出实施方案建议,包括优先采用服务端存储映射和扫码授权等安全策略。全文系统性地呈现了JWT的技术实现与典型应用场景。原创 2025-07-04 10:44:56 · 942 阅读 · 0 评论 -
【精华】双向心跳交互革命:AG-UI协议重塑AI Agent前端开发范式
AG-UI协议是一种标准化AI Agent与前端应用实时通信的新协议,旨在解决现有生态中用户界面与AI交互缺乏统一标准的痛点。该协议采用轻量级设计,支持多传输协议,实现双向同步交互,并能与主流AI框架无缝对接。通过定义16种标准事件流,AG-UI实现了前端与AI后端的解耦,简化了集成开发。作为AI Agent协议栈的重要补充,它与A2A(Agent间通信)和MCP(工具调用)协议共同构成完整生态。协议已开源并提供多语言SDK,显著降低了构建智能交互界面的开发门槛。原创 2025-06-12 14:11:01 · 1499 阅读 · 0 评论 -
`document.domain` API 的废弃与现代 Web 开发的转型
摘要:document.domain API曾用于跨子域通信,但因破坏同源策略的安全风险被主流浏览器逐步废弃(Chrome106、Firefox91、Safari15起)。建议迁移至更安全的替代方案:跨窗口通信使用postMessage或Channel Messaging API,跨域请求采用CORS配置。尽管当前90%系统仍在使用该API,但迁移到现代方案是必然趋势,可避免未来兼容性问题。开发者应尽快重构历史代码,确保应用安全性和稳定性。(149字) 注:宣传内容已按摘要要求省略,如需可补充说明插件功能。原创 2025-06-11 18:59:24 · 772 阅读 · 0 评论 -
后端代码中静态文案这样做国际化.NET & Java
本文介绍了多语言支持方案的实施步骤:1)通过脚本工具扫描项目中文案并人工筛选需国际化的内容;2)使用大模型自动生成中英文JSON语言包,key保持中文;3)提供.NET和Java两套实现方案,包括语言加载工具类(I18nHelper)和字符串扩展方法,支持按语言获取翻译文本并具备中文回退机制。方案采用JSON格式存储翻译数据,结构清晰,实现了代码与国际化的解耦。原创 2025-05-30 16:59:50 · 290 阅读 · 0 评论 -
后端项目中静态文案国际化语言包构建选型
不同语言包格式的选择需权衡开发语言、工具链和需求特点:.resx适合.NET静态资源管理,.properties是Java生态主流选择,而JSON因其跨平台、支持动态加载和嵌套结构,成为现代多语言项目的通用推荐方案。建议根据团队技术栈选择,对于前后端分离项目优先采用JSON格式,既统一语言包管理,又便于自动化处理。关键考量因素包括:是否需要运行时修改、是否涉及多平台协作以及团队的维护习惯。原创 2025-05-30 16:52:47 · 561 阅读 · 0 评论 -
通义灵码和腾讯云代码助手代码评审工具比较
阿里云和腾讯云推出AI代码评审工具:通义灵码与腾讯云代码助手(CodeBuddy)全面对比。两者均支持多语言和主流IDE插件,提供代码评审、优化建议等功能。通义灵码更适合大型企业,具备多文件批量修改和企业级部署能力;CodeBuddy则强调开发效率和灵活部署,适合中小团队。费用方面,通义灵码企业版起价79元/月,CodeBuddy专享版158元/月(100人起购)。用户可根据企业规模和安全需求选择合适工具。原创 2025-05-29 18:52:51 · 1724 阅读 · 0 评论 -
Web 系统验证码与登录安全防护全攻略(附实现方案)
本文针对验证码爆破和用户枚举等常见网络攻击,提出了一系列防护措施和实现方案。验证码类防护包括提升复杂度、错误限制、绑定设备信息等措施;登录防护则建议统一错误提示、动态账户锁定、二次验证等方法。后端实现方面提供了验证码频控、弱密码检测的代码示例(Node.js/Java/.NET),并推荐了弱密码库等资源。文章强调验证码需一次有效且绑定上下文,登录流程应统一提示并拦截弱密码,通过综合防护手段可大幅提升系统在关键接口的抗攻击能力。原创 2025-05-29 13:57:06 · 934 阅读 · 0 评论 -
【实战】使用这种方式解决前端本地缓存无法更新的问题!一次代码,永久躺平
摘要: 本文介绍如何通过Webpack自动生成带时间戳和Git哈希的版本号,并在浏览器启动时对比旧版本号,自动清理本地缓存(如localStorage、indexedDB等)。实现步骤包括:1) 构建阶段生成版本号并注入全局变量;2) 运行时检查版本号差异并清理缓存;3) 提供完整示例代码。此方案可避免用户因缓存加载过期资源,确保应用始终使用最新版本。适用于前端项目,支持Webpack 5,无需后端改动。原创 2025-05-28 11:09:11 · 1411 阅读 · 0 评论 -
查看webpack版本的三种方式
摘要:可通过三种方式查看Webpack版本:(1)命令行输入npx webpack --version或npx webpack -v;(2)检查package.json文件中的webpack字段;(3)运行npm list webpack命令。这些方法均可确认项目使用的Webpack版本号。(94字)原创 2025-05-28 09:46:10 · 862 阅读 · 0 评论 -
【实战】网站国际化这样做:自动识别用户使用的语言 + 手动自选语言
摘要:本文介绍了前端国际化实现方案,通过JavaScript检测浏览器语言并支持中英文切换。方案包含语言资源库、自动检测浏览器语言、用户偏好保存到localStorage、动态更新页面内容等功能。实现代码展示了完整的国际化示例,支持一键切换中英文并记住用户选择。文末推荐了作者开发的免费书签插件Pocket Bookmarks,具备跨设备同步和AI智能分类功能。该国际化方案可扩展支持更多语言,适用于需要多语言支持的Web应用。原创 2025-05-27 09:18:22 · 639 阅读 · 0 评论 -
浏览器书签管理神器来了!「Pocket Bookmarks」正式登陆微软商店
Edge浏览器用户现在可以通过微软应用商店下载全新的AI书签管理插件【Pocket Bookmarks】,享受智能化的书签管理体验。该插件提供极简操作界面,支持跨设备同步,利用AI技术自动分类和推荐书签,并提供可视化数据看板。功能包括多维度分类、智能排序、团队协作和多种视图展示,适用于设计师、程序员、学生和电商运营等多种场景。安装后用户可享受永久免费的基础功能、无广告体验和独家AI整理技巧指南。立即获取,提升你的书签管理效率。原创 2025-05-23 09:11:30 · 869 阅读 · 0 评论 -
iframe嵌套网站的安全机制实现
为了将内网系统A暴露到公网并提高嵌套的B网站的安全性,建议通过Nginx代理层设置一个中间域名C(如proxy.b.com),代理访问B网站,并在C层进行验签逻辑,仅允许来自A网站的请求访问。该方案具有隐藏真实B网站地址、可插入多种验证逻辑、控制粒度细、防止浏览器直接访问等优势。实现步骤包括:前端A网站iframe使用C域名、A后端生成一次性token、Nginx中实现验签逻辑、隐藏真实B网站地址。关键防绕过策略包括禁止直连B、Token有时效、Token防伪造、限Referer、iframe校验。该方案可原创 2025-05-12 17:22:39 · 533 阅读 · 0 评论 -
使用AES-CBC + HMAC-SHA256实现前后端请求安全验证
AES-CBC + HMAC-SHA256 加密验证方案,下面是该方案二等与表格,适用于文档、评审或技术选型说明。原创 2025-05-09 15:46:13 · 936 阅读 · 0 评论 -
Webpack 打包配置演进:运行时代码的分离与缓存优化
在前端工程中,打包工具(如 Webpack)的配置直接影响最终产物的性能和可维护性。近年来,一个显著的优化趋势是将运行时代码(Runtime Code)从业务代码中分离,生成独立的 文件。本文将深入探讨这一变化的核心原理、新旧配置的差异,以及开发者应如何选择。运行时代码是打包工具自动生成的一段“基础设施”代码,负责:特征:缺点:特征:优点:2. 产物结构五、何时保留内联运行时?尽管独立运行时是更优解,但以下场景可考虑内联:独立打包运行时代码通过解耦业务逻辑与基础设施,实现了:建议开发者:通过这一原创 2025-04-24 14:15:53 · 481 阅读 · 0 评论 -
【实战】使用js实现移动端侧边栏滑动收起的功能
在移动端,打开侧边栏菜单的时候,如果总是点击某个按钮收起,虽然功能上没有问题,但是从用户使用的角度,还是不太方便,尤其是按钮的位置不方便用户点击的时候。所以,向左滑动收起菜单的方案显得更加友好,也符合用户在移动端的使用习惯。原创 2025-04-23 09:48:58 · 224 阅读 · 0 评论 -
【实战】oninput 文本框输入实时查询防抖机制实现
oninput="searchSites()” 文本框输入时,实时调用后端接口查询。输入过程中,会触发多次查询。最后一次的查询被前面的查询覆盖了。可以使用防抖机制解决这个问题。原创 2025-04-22 16:44:10 · 971 阅读 · 0 评论 -
【推荐】一个超级简约方便使用的跨浏览器书签
你创建的每一个分类,系统都可以自动为你写一个简介。不用绞尽脑汁想文案了,系统帮你总结亮点!它不只是一个书签工具,而是一个你专属的「资源聚合站 + AI 整理助手 + 分享平台」。想体验下这款聪明又好用的书签系统?现在就来试试吧!👇👇👇🔗。原创 2025-04-10 18:42:20 · 490 阅读 · 0 评论 -
【实战】解决图片 Hover 抖动问题的完整指南
问题解决方案hover 时图片抖动使用图片加载后闪烁避免重新追加 DOMDOM 操作导致性能下降用替代后端接口频繁调用加缓存,避免重复加载。原创 2025-03-27 10:55:24 · 616 阅读 · 0 评论 -
使用rdl.ink接入页面信息加载不全问题解决方案
表示延迟 2000 毫秒(=2秒)后再截图,适合处理动态加载的网页。原创 2025-03-26 09:55:25 · 309 阅读 · 0 评论 -
rdl.ink 全面使用教程:网页截图、渲染与应用场景解析
rdl.ink网站预览图生成分享社交媒体缩略图自动化网页截图服务用于博客/文章引用API 接口集成截图功能它完全基于 URL 构造,不需要注册账号,也不需要安装插件,开箱即用、完全免费。功能说明网页截图输入网址即可生成高清截图裁剪模式(mode)可控制截图是全屏、裁剪、填充等输出格式支持 PNG、JPEG、WebP 等主流图片格式尺寸控制可设置截图宽度和设备像素比(DPR)背景色控制设置截图背景为透明或纯色响应式显示自动适配网页的移动/PC端布局可嵌入。原创 2025-03-26 09:53:35 · 955 阅读 · 0 评论 -
口袋书签功能上新,免费使用
丰富主页面的菜单,操作更加便捷。快来构建你的门户站点吧。原创 2025-03-19 18:42:23 · 141 阅读 · 0 评论 -
解决从deepseek接口获取的流式响应输出到前端都是undefined的问题
你的 AI 可能逐字符返回内容,需要在后端。代码遇到了 undefined。原创 2025-03-17 09:35:19 · 733 阅读 · 0 评论 -
我开发的口袋书签系统终于上线了!我使用了这些技术栈~
总的来说,这个书签系统很大程度上解决了我们公司内部系统繁多、信息分散的问题,也满足了个人在不同浏览器间同步书签的需求。做这个项目的过程中,我印象最深的就是要从实际应用场景出发,反复和用户(同事、朋友)沟通,让他们多提意见。别怕功能少,先把核心功能完善起来,后续再一点点扩展。毕竟,一个小而美、稳定易用的系统,远比功能堆砌但用不起来的“巨无霸”更值得投入。如果你也有类似痛点,不妨也尝试一下自己动手开发,或者可以借鉴这个思路把资源统一管理起来。技术往往是手段,真正为大家带来效率和便利才是目标。原创 2025-03-14 22:17:23 · 1294 阅读 · 0 评论 -
终结浏览器孤岛:NavFinder书签协同系统诞生
📌 直达链接:https://navfinder.cn/你是否厌倦了在无数书签和标签页中来回切换?是否希望一键直达高频工具与优质资源?试试——你的智能网络地图,让效率翻倍,让时间更有价值!原创 2025-03-14 14:08:48 · 287 阅读 · 0 评论 -
【实战-解决方案】Webpack 打包后很多js方法报错:not defined
更简单在不打包的情况下,方法(如等)可以正常运行,而经过 Webpack 打包后报 is not definedwindowHTMLproductionscriptwindow如果你希望这些方法依然可以全局调用,需要将方法挂载到window,确保在window作用域下能找到。exports如果你已经在使用 Webpack 的方式组织代码,则需要在main.js如果是然后require如果 Webpack 误认为某些方法未使用,可以在里关闭。原创 2025-03-12 10:21:50 · 1368 阅读 · 0 评论 -
Webpack 打包详细教程
Webpack 是一个现代 JavaScript 应用的,它可以处理 JavaScript、CSS、图片等资源,并优化它们以提高性能。以下是 Webpack 从基础到进阶的详细教程。原创 2025-03-11 17:24:11 · 847 阅读 · 0 评论 -
在 Flask 项目中访问其他页面
在 Flask 项目的。原创 2025-03-10 15:41:44 · 455 阅读 · 0 评论 -
Flask框架中局部刷新页面
在 Flask 里,我们需要一个专门的 API 来返回。原创 2025-03-08 21:45:34 · 498 阅读 · 0 评论 -
前端文件加载耗时过长解决方案
这样 **JS 加载速度会大幅提升!原创 2025-03-06 20:31:59 · 1159 阅读 · 0 评论 -
解决变量重复定义的问题 has already been declared
如果你希望 Django 前端代码更清晰,建议。已经存在,就不会再次声明,避免报错。如果你的项目支持 ES6,可以使用。需要全局唯一,建议方案 3。可能会被重复声明,可以用。原创 2025-03-03 17:43:33 · 1218 阅读 · 0 评论 -
如何实现前端“小手向右指”的效果
如果不想引入图标库,直接使用 Unicode。:☞(样式可能取决于你使用的 FA 版本)Font Awesome 提供了。如果你想要更灵活的设计,可以用。图标库中,没有专门的。如果你项目中已经引入了。原创 2025-03-03 16:46:23 · 353 阅读 · 0 评论 -
JavaScript异步处理确保排序不乱的方案
异步并行 + 保持顺序等待所有完成后,一次性按原数组顺序处理。若想“谁先返回先显示”,但仍“顺序不乱”,可用占位符或索引映射来填充对应位置。并不是真正 0ms,实际是把回调放到下一轮事件循环(宏任务)中执行。典型用途:让某段逻辑在当前调用栈/宏任务完成后再执行,不阻塞前面流程。若需要在同一轮任务末尾执行,可考虑或(微任务)。避免“乱序”或“堵塞”乱序:由于异步返回先后不同,数据可能顺序错乱;但用、占位符或索引映射都能保持原始顺序。原创 2025-03-02 19:21:28 · 750 阅读 · 0 评论 -
JavaScript 并行处理
JavaScript 并发 I/O主要通过Promise来实现,直接并发发起多个请求或操作,大幅提升效率。一定要避免不必要的串行await(一个结束才发下一个),否则浪费时间。真正的多线程并行JS 主线程是单线程,如果要做 CPU 密集运算,可以用Web Worker(浏览器)或(Node.js)开子线程,避免主线程卡死。子线程与主线程通过消息传递来交互。用法并非“立即执行”,而是“推到事件循环的下一次宏任务”执行,浏览器通常有最小延时 4ms 左右。原创 2025-03-02 19:19:29 · 1168 阅读 · 0 评论