- 博客(66)
- 收藏
- 关注
RSS订阅原创 百度地图打印地点经纬度信息
摘要：本文介绍了使用百度地图API实现地址解析功能的HTML代码示例。通过创建BMapGL.Map实例和Geocoder地址解析器，可将输入的详细地址转换为经纬度坐标并在地图上标记显示。解析结果包含经纬度信息(point.lng和point.lat)。
2026-04-07 17:44:29
16
原创 网页上的猫猫，L2Dwidget看板娘
本文介绍如何在网页中添加一只可爱的猫猫动画。只需将资源文件解压到网站目录，调整JS路径后，在页面中引入l2dwidget.min.js脚本，并运行提供的初始化代码即可。代码可配置猫猫模型的位置（默认右下角）、大小（宽110px高150px）以及移动端显示效果等参数。实现简单，只需几行代码就能为网站增添趣味性互动元素。
2026-03-27 15:42:17
15
原创 vue 组件中的data 是函数的原因
Vue实例中data可以是对象或函数，但组件中的data必须是函数。这是因为函数返回的对象引用地址不同，能避免不同组件间数据污染。同理，mixin混入data属性时也必须使用函数形式。这种设计确保了组件数据的独立性。
2026-03-24 15:48:24
18
原创 Vue.mixin({})的使用场景和原理
Vue的mixin机制允许将可复用功能混入组件，实现代码复用。混入对象可包含任意组件选项，与组件选项合并时：数据对象递归合并（组件优先）、同名钩子合并为数组（混入先执行）、方法等对象属性合并（组件优先）。虽然方便，但存在命名冲突风险。
2026-03-24 15:45:53
13
原创 虚拟DOM
摘要：虚拟DOM是用JavaScript模拟的DOM树结构，通过tag、props和children属性描述节点关系。相比直接操作真实DOM，虚拟DOM先在内存中计算最小变更，再映射到真实DOM，显著减少渲染次数和性能消耗。真实DOM渲染需经过构建DOM树、CSSOM树、生成渲染树等复杂流程，频繁操作会降低性能。虚拟DOM通过JS对象快速计算变更，最终批量更新真实DOM，有效解决了传统DOM操作性能低下的问题。
2026-03-24 15:41:28
16
原创 签名验证，防止请求参数被篡改
本文介绍了前后端请求签名验证的实现机制，通过参数排序、密钥组合和MD5加密确保数据交互安全。前端对请求参数进行排序后，与密钥组合生成MD5签名，随请求一起提交。后端使用相同密钥验证签名。示例代码展示了前端签名生成过程：对参数键名排序后拼接密钥，进行MD5加密，并将签名加入请求数据。这种机制能有效防止数据篡改，提升接口安全性。
2026-03-20 14:51:42
16
原创 SaaS、PaaS和私有化部署的区别
云计算服务主要分为PaaS、SaaS和私有化部署三种模式。PaaS提供基础平台服务，SaaS通过互联网提供软件服务，适合中小企业节省成本。私有化部署将系统和数据完全放在企业自有服务器，适合对数据安全要求高的大型企业，但需要专业技术支持。三种模式各有优劣，企业应根据自身规模、技术能力和安全需求进行选择。
2026-03-20 14:50:45
29
原创 区分Unicode、GB2312、UTF-8
摘要：编码是计算机识别文本的协议标准。ASCII用1字节编码英文字符，但无法满足多语言需求，因此中国制定了GB2312双字节汉字编码。为解决各国编码冲突，Unicode统一了全球字符标准。UTF-8是Unicode的优化实现，采用1-3字节可变长度，兼容ASCII的同时高效存储多语言字符。（149字）
2026-03-20 14:48:55
13
原创 浏览器上拍摄网页或其中一部分的“屏幕截图”——html2canvas
JavaScript HTML渲染器html2canvas是一个客户端脚本，能在浏览器中将网页或部分元素转换为canvas图像。它通过读取DOM元素及其样式信息来构建图像，无需服务器支持。该工具兼容主流浏览器（Firefox 3.5+、Chrome、IE9+等），需Promise支持，建议搭配polyfill使用。目前仍处于试验阶段，不支持跨域内容且存在CSS属性限制。调用方式简单：html2canvas(element).then(canvas=>{...})即可获取渲染结果。注意：不适用于Node
2026-03-20 14:47:11
27
原创 前端js节流
节流是一种限制函数调用频率的技术，通过设置时间间隔确保函数在短时间内只执行一次。示例展示了搜索框输入事件优化：当用户连续输入时，使用节流函数(throttle)控制异步请求频率。实现原理是利用定时器和状态位(valid)，在指定延迟(delay)后才允许再次触发函数。代码中，300ms内重复的keyup事件会被忽略，从而降低请求频率，优化性能。这种方法既保证了实时性，又避免了高频触发带来的资源浪费。
2026-03-20 14:45:15
17
原创 前端js防抖
前端防抖技术用于优化高频触发事件的性能。当短时间内多次触发同一事件时，防抖能确保只执行一次函数。例如浏览器滚动事件监听，使用防抖函数可以避免高频执行。具体实现是通过setTimeout延迟执行，若在延迟期间再次触发则重置计时器。代码示例展示了如何将防抖应用于滚动事件，设置1秒延迟后输出滚动位置，有效减少不必要的函数调用，提升页面性能。
2026-03-19 16:12:13
14
原创 CSRF攻击
CSRF（跨站请求伪造）是一种网络攻击方式，攻击者诱导用户访问恶意网站后，利用用户已登录目标网站的凭证，伪造请求执行非法操作。攻击流程包括：用户登录目标网站保留凭证→访问恶意网站→恶意网站伪造请求→目标网站误认合法请求执行操作。常见攻击方式包括自动加载图片URL、诱导点击链接、自动提交表单等。防护措施包括同源检测和使用CSRF Token验证请求来源。该攻击特点在于利用而非窃取凭证，通常跨域实施，但本域漏洞更危险。
2026-03-19 16:10:09
43
原创 XSS攻击简介
XSS（跨站脚本攻击）是一种通过注入恶意脚本危害用户数据安全的网络攻击方式。攻击者将恶意代码混入网站正常代码中，利用浏览器无法区分的特点窃取用户信息或发起攻击。XSS分为三种类型：存储型（恶意代码存储在数据库中）、反射型（通过URL传递恶意代码）和DOM型（由前端JavaScript执行恶意代码）。防范XSS需要全面转义用户输入数据，同时避免过度转义导致正常内容显示异常。这种攻击对网站安全构成严重威胁，需采取严格防护措施。
2026-03-19 16:09:20
215
原创 前后端渲染之争
客户端渲染是未来的主要方向，服务端则会专注于在数据和业务处理上的优势。但由于日趋复杂的软硬件环境和用户体验更高的追求，也不能只拘泥于完全的客户端渲染。同构渲染看似美好，但以目前的发展程度来看，在大型项目中还不具有足够的应用价值，但不妨碍部分使用来优化首屏性能。做同构之前 ，一定要考虑到浏览器和服务器的环境差异，站在更高层面考虑。当然如果Google百度等主流搜索引擎支持spa的seo的话，那这些都不摆了！也不用再考虑discuzQ的seo不友好之类的问题。
2026-03-19 16:01:54
348
原创 route和router
this.$route : 路由信息对象，只读对象，表示当前的路由信息，包含了当前url解析得到的信息，包含当前的路径、参数、query对象等。this.$route为当前route跳转对象，里面可以获取到name、path、query、params等。this.$router : 是路由操作对象，只写对象，是VueRouter的实例，包含了一些路由的跳转方法，钩子函数等.。ps：this.router中的currentRoute就是组件路由中的this.$route。
2023-10-23 17:10:43
190
原创 摸鱼神器！VS Code 变身小霸王游戏机！
今天，要给大家介绍一款摸鱼神器，把 VS Code 变身小霸王游戏机！1、下载安装直接访问下列链接：https://marketplace.visualstudio.com/items?itemName=gamedilong.anes或者在VS Code插件市场搜索“小霸王”，然后安装即可。2、开始摸鱼在安装好“小霸王”插件后，在左侧活动栏可以看到一个小霸王游戏机的图标，点击就能显示出小霸王的游戏列表。在 Remote 列表中，就可以把游戏下载到本地了！在 Local 列表中
2020-11-08 16:46:14
4754
原创 异步返回的tree展开节点不生效，解决办法原来如此这么简单
用了ant-design-vue的tree，单个控件设置defaultExpandAll为true即可展开所有节点。在小demo里测试一点问题也没有。<template> <a-tree :defaultExpandAll="true" :tree-data="treeData" :replace-fields="{ children: 'children', title: 'title', key: 'id',
2020-10-24 22:53:56
7055
5
原创 ant-design-vue的select二级联动，联动文本不更新的解决办法
前言有了需要改动祖传代码项目需求：把之前的select改成二级联动。项目使用了ant-design-vue，数据为[{"id":1,"name":"前端开发"}]问题描述<a-form :form="form" @submit="handleCreateMenuSubmit"> <a-select style="width:50%" placeholder="请选择技术领域" @change="handleNoteCategoryChange">
2020-10-20 10:51:02
3916
3
转载 在HarmonyOS工程中添加Module
Module是HarmonyOS应用的基本功能单元，包含了源代码、资源文件、第三方库及应用清单文件，每一个Module都可以独立进行编译和运行。一个HarmonyOS应用通常会包含一个或多个Module，因此，可以在工程中，创建多个Module，每个Module分为Ability和Library（HarmonyOS Library和Java Library）两种类型。如上篇HarmonyOS工程介绍，在一个APP中，对于同一类型设备有且只有一个Entry Module，其余Module的类型均为Feat
2020-09-18 17:00:59
3952
1
转载 创建一个新的HarmonyOS工程
当开始开发一个HarmonyOS应用时，首先需要根据工程创建向导，创建一个新的工程，工具会自动生成对应的代码和资源模板。如果创建的工程包含JS语言，请确保已经下载了JS SDK包，具体可参考下载HarmonyOS SDK。说明：在运行DevEco Studio工程时，建议每一个运行窗口有2GB以上的可用内存空间。创建和配置新工程通过如下两种方式，打开工程创建向导界面。 如果当前未打开任何工程，可以在DevEco Studio的欢迎页，选择Create HarmonyOS Project开始
2020-09-18 17:00:05
3313
原创 HarmonyOS工程介绍
HarmonyOS APP工程结构在进行HarmonyOS应用开发前，您应该掌握HarmonyOS应用的逻辑结构。HarmonyOS应用发布形态为APP Pack（Application Package，简称APP），它是由一个或多个HAP（HarmonyOS Ability Package）包以及描述APP Pack属性的pack.info文件组成。一个HAP在工程目录中对应一个Module，它是由代码、资源、第三方库及应用清单文件组成，可以分为Entry和Feature两种类型。Entr
2020-09-18 16:59:25
3241
1
转载 vuex简述
vuex通过辅助函数将store的属性与方法，绑定到component中。componet监听用户行为，commit / dispatch 一个行为给 mutation / action。action 内部也是通过commit去执行 mutation，mutation相当于一个操作 state的列表。import Vue from 'vue';import Vuex from 'vuex';const store = new Vuex.Store({ //...})new.
2020-09-17 17:43:30
165
转载 vuex的基本规则
Vuex 并不限制你的代码结构。但是，它规定了一些需要遵守的规则：应用层级的状态应该集中到单个 store 对象中。提交 mutation 是更改状态的唯一方法，并且这个过程是同步的。异步逻辑都应该封装到 action 里面。state [type: Object]const store = new Vuex.Store({ state: { count: 1 } mutations: ...})modulesconst module
2020-09-17 17:42:43
403
手机百度app访问网页，部分超链接的字体被加粗了，还加上了背景色
2025-07-21
TA创建的收藏夹 TA关注的收藏夹
TA关注的人