自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(125)
  • 收藏
  • 关注

原创 VSCode快捷键打不开终端,提示(PowerShell被禁用报The terminal process failed to launch: Access was denied to the ..)

报了这个错误修改vs code得终端设置为cmd来解决这个问题。一般这个问题会在刚开始配置vscode的时候出现。

2025-01-08 17:54:45 300

原创 支付流程的理解

已经确认了公司在进行商户号和商户验证密码的申请,这个支付流程在项目的开发过程中是非常重要的,支付一定是跟安全相关的,我想确认一下有没有优秀的后端开发,来进行一个相关接口的一个处理,支付的流程是相当复杂的,而作为前端所做的事情就是一个唤起支付和支付确认的一个处理,所以我所负责的工作就是配合后端开发进行相关的处理的,其实在支付的时候你就会发现支付就是一个按钮的操作,点击按钮就会进行一个支付的处理,这就是所谓的唤起支付。8. 商户后台确认是跟微信平台进行合作的,调起微信支付 =>

2024-02-26 20:01:55 1132

原创 vue项目中使用vee-validate表单验证

作为前端开发,在项目中避免不了做表单到页面,做表单页面就避免不了要做表单效验,如果多个表单页面有相同都表单比如用户名,密码等等,不能每个页面都写一次验证规则,这时可以使用vee-validate插件:一个轻量级的 vue表单验证插件。

2024-02-22 14:41:01 1720

原创 vue中通过vue-lazyload实现图片的懒加载

【代码】vue中通过vue-lazyload实现图片的懒加载。

2024-02-22 14:24:22 778

原创 文件上传之大文件分块上传之断点续传操作

并且文件块大小也需要去控制,去选择,选择合适的文件块大小对断点续传有一定的影响,过小的块可能导致传输控制开销增大,过大的块可能会导致传输以后需要传输较大的数据量。在传输恢复的时候,还需要去明确之前的一个状态信息,确保需要后续继续上传块内容,因为我们需要去确认从上一个中断的地方进行块的传输恢复。,通常是几KB和几MB的大小。再次点击相同文件上传,则会确认已经进行断点续传的操作处理,那么服务器端也会对后续的块文件进行继续的断点续传操作,直到所有的块上传成功,并且产生一个文件合并的操作。查看这两个博客去实现。

2024-02-19 09:49:13 1614

原创 文件上传之大文件分块上传进度控制处理

在分块上传内容结束以后的事件监听,我们会实现unlinkSync删除临时文件操作,那么试想一下,在这个事件监听中,我们是否可以通过以及获取当前上传的进度情况呢?

2024-01-27 12:19:31 815

原创 文件上传之大文件分块上传

原则:合久必分,分久必合优势部分:减少了内存占用,可实现,并发处理,利用带宽,提高效率不足之处:增加复杂性,增加额外计算存储大文件上传、多媒体平台音视频上传,需断点续传应用注意事项:合理分块大小,顺序的完整性,异常情况的合理处理。

2024-01-27 10:29:03 750

原创 详细介绍node中动态数据内容的压缩应用

我们是否能够对字符串信息进行高效的压缩处理呢?在压缩之后是否能够节省带宽呢?是因为 compression 压缩模块在其了至关重要的作用!在请求内容居多时,请求的资源以及尺寸在大幅度的增加。在安装引入之后(对其进行引入并调用)如图:当前尺寸620KB。

2024-01-25 17:13:10 471

原创 对于gzip的了解

前端:前端主要是对文件进行压缩,前端可以使用gzip生成.gz文件,然后传递给运维,当然也可以不压缩,因为运维是相当于一个中间层。后端: 后端主要是对数据进行一个压缩。运维: 如果前端并没有进行压缩,那么传递到运维的时候,运维会对这些内容进行一个压缩。

2024-01-25 16:34:24 984

原创 项目遇到Bug如何解决(思路)

在我们项目开发中,总是遇到各种各样的 Bug,对于我来说能够快速的找到Bug、分析Bug、解决Bug就是自我能力最大的挑战。所以,先要明确在项目开发中经常会遇到错误类型有哪些呢?错误类型。

2024-01-25 15:36:37 1901

原创 react项目引入百度地图api出现警告:A parser-blocking, cross site (i.e. different eTLD+1) script, http://api.map.ba

通过document.write调用一个解析器阻塞,跨站点(即不同的eTLD+1)脚本,http://api.map.baidu.com/getscript?对于使用慢速连接(如2G)的用户,通过document.write()加载的第三方脚本的性能损失通常非常严重,以至于导致主页内容的显示延迟数十秒。在2G连接上的用户HTTP缓存丢失的情况下,该特性将阻止通过document.write()插入的跨域解析器阻塞脚本的加载。首先引入脚本,在index.html中引入以下script,密钥可去。

2024-01-24 20:01:30 1987

原创 React导航守卫(V6路由)

(1)在登录页面,我们点击登录的时候,保存一个token,在登录页面引入重定向useNavigate。

2024-01-24 15:59:59 756

原创 React导航守卫(V5路由)

当我们进行的时候,有时候需要满足某种条件才能跳转,比如我只有我们登录成功之后才能到首页面,否则就不能到首页面,这时候我们就需要对路由进行拦截。

2024-01-24 15:26:53 489

原创 npm报错:A complete log of this run can be found in: C:\Users\Anyuq\AppData\Local\npm-cache\_logs\

注:有的项目仍然无法 npm install 时,依旧报错(执行 yarn 即可)1. 删除node_modules文件夹。3. 重新安装一次即可。

2024-01-23 11:37:46 4343

原创 利用Intersection Observer实现图片懒加载性能优化

Intersection Observer是浏览器所提供的一个 Javascript API,用于异步的检测目标元素以及祖先或者是顶级的文档视窗的交叉状态这句话的意思就是:我们可以看的图片当中,绿色的 target element(目标元素),并且存在一个顶层的或者祖先的文档视窗也就是当前图片中的,灰色的 browser viewport(浏览器的视窗)

2024-01-22 20:11:32 757

原创 地图 - 实现有多条定位,显示多条定位,并且使用一个圆形遮罩层将多条定位进行覆盖

模板页面头部加载百度地图JavaScript API代码,密钥可去。然后,使用npm方式安装react组件库,然后通过es模块加载。在需要显示地图的页面中编写。

2024-01-22 19:28:21 530

原创 i18n多国语言Internationalization的动态实现

将命名空间下面的 new_message_one 进行相应的渲染显示,以及new_message_other的显示,我们可以显示new_message这个信息,然后去传递动态的数据内容。在进行语言转换的时候,并不需要进行一个设置,我们可以实现一个动态的转换,除了 1 之外,其他的都是 other ,那么,现在,我们就实现了一个动态值的替换操作。之前就已经提及多国语言中的日期显示,每个国家并不相同:假如是英国,美国,欧洲等国家我们的日期应该显示的是什么格式,而对于中国,我们的日期又应该显示的是什么格式。

2024-01-22 16:11:07 1372

原创 i18n多国语言Internationalization的实现

是"Internationalization”的缩写,这个术语来源于英文单词中首尾字母“”和“n”以及中间的字符数(共计18个字符)当我们需要开发不同语言版本时,就可以使用i18n多国语言的一个操作处理,i18n主要实现那一方面的内容呢?例如:文本内容本地化、日期/时间格式、货币与度量单位图形和图标、布局和阅读方向、区域敏感功能总之,i18n是为了构建全球化产品而采取的一种策略,确保软件产品可以在全球范围内广泛进行使用,同时为用户提供符合当地文化和习惯的一个用户体验。

2024-01-16 21:03:00 1224

原创 Mock.js使用并且添加到数据库中

是一款前端开发中拦截Ajax请求再生成随机数据响应的工具.可以用来模拟服务器响应.优点是非常简单方便,无侵入性,基本覆盖常用的接口数据类型。如向数据库添加数据,一条一条添加太麻烦,就可以利用 Mock.js 自动生成。1. 使用npm安装。

2024-01-15 11:19:22 666

原创 Vue中的keep-alive缓存组件的理解

(LRU的思想就是保留最近被访问的数据,而淘汰最长时间未被访问的数据,那么LRU算法通过维护一个访问序列表来实现这个目标,例如:当一个数据项被访问的时候,我们会将其移动到顺序列表的头部,表示最近被使用过,当需要淘汰一个数据的时候,选择列表尾部的数据进行移除,这时表示没有被使用过的数据,这种方式保证了访问过的数据项保持在我们列表的头部,而不常访问的数据项逐渐会移动到我们列表的尾部,当需要淘汰数据的时候,只需要移除尾部的数据即可。其基本思想是保留最近被访问过的数据,而淘汰最长时间没有被访问的数据。

2024-01-14 21:38:17 802

原创 为什么使用双token实现无感刷新用户认证?

颁发Access Token & Refresh Token(当认证成功了以后,颁发两个内容,一个是Access Token 另一个 Refresh Token,Access Token是一个短期的token(比如几十分钟),Refresh Token是一个长期的token(比如可以设置几天或者更长的时间),这两个token都会返回客户端)----->:对与单token的认证机制在我们项目中仅使用一个Access Token的访问令牌进行用户身份认证和授权的方案处理。

2024-01-14 21:31:49 1785

原创 node后端无限极分类

【代码】node后端无限极分类。

2024-01-10 16:43:23 365

原创 实现RBAC

RBAC的层次结构: 用户N => 角色N => 资源N路由的分类: 静态、动态、任意动态权限路由: 想要实现addRoute动态注册路由的操作,首先得将后台返回的routes数组与异步路由进行递归的比较,得到的路由是授权以后的路由对象,然后对该数组对象进行循环遍历,利用addRoute实现动态路由的注册操作需要注意的细节是原路由对象和用户重新登录以后获取到的路由对象是同一对象,所以为了划分出不同的用户的路由对象,可以对动态生成的路由内容进行深拷贝操作。

2024-01-08 16:52:17 1081

原创 RBAC概念

RBAC(基于角色的权限控制)模型的核心是在用户和权限之间引入了角色的概念。取消了用户和权限的直接关联,改为通过用户关联角色、角色关联权限的方法来间接地赋予用户权限(如下图),从而达到用户和权限解耦的目的。

2024-01-03 14:43:02 2023

原创 webpack

参考文档:https://webpack.docschina.org/guides/asset-modules/:开发服务器 devServer的开启,用来浏览器的自动化处理,包括:自动编译,自动打开浏览器,自动刷新浏览器等。限制:只合适小图片,如果是大图也做base64处理,会导致css/html文件过大,不利用页面显示。2. 复制 CSS 代码到样式文件中,这里可以是 CSS 文件,也可以是 LESS 文件。3.在入口JS文件中引入这些资源:./src/index.js。

2024-01-03 07:56:08 945

原创 利用闭包与高阶函数实现缓存函数的创建&&缓存函数在项目中的性能优化

允许函数保留其包含(封闭)范围中变量的访问权,即使在该范围外执行函数闭包是一种在函数嵌套的情况下,内部函数可以访问外部函数作用域中变量的现象。基本上,闭包就是将函数内部和函数外部连接起来的一座桥梁。闭包允许你从一个函数中返回另一个函数,并且在后者执行时仍然能够访问前者的变量。通俗地说,闭包是由函数和与其相关的引用环境组合而成的实体。它可以让函数访问在它被创建时所处的词法作用域中的变量,即使函数在这个词法作用域外执行,也能够访问这些变量。内部函数可以访问外部函数中的变量和参数。

2023-12-18 10:19:14 1103

原创 深入理解Axios的TypeScript类型的约束

泛型 (Generics) 允许你编写可以适用于不同类型的代码,以增强代码的重用性和灵活性泛型可以在函数、类和接口中使用,它们可以用来定义参数类型、返回值类型或类成员的型。通过使用泛型,可以在不同的地方使用相同的逻辑和算法,但适用于不同类型的数据。泛型的基本语法是使用尖括号<T>来表示一个类型参数,T 可以是任意合法的标识符,代表待确定的类型那么如何使用typeScript当中的类型别名和泛型定义通用的axios请求类型,并且通过一个实例进行及用法的一个展示。

2023-12-17 21:46:39 2022 2

原创 Typescript中Partial数据类型在项目中的实际应用

<ul>return (<input// 传递两个参数,一个下标,一个对象/>//显示值</li></ul>

2023-12-15 10:18:24 628

原创 ts中interface与type的差异?

/ object对象类型定义// 对UserType进行初始化操作// 需要与UserType定义的类型一致age: 18;// 假如我们将age去除,会出现相对于的错误// 对UserInter 进行初始化操作// 需要与UserInter 定义的类型一致age: 18;// 假如我们将age去除,会出现相对于的错误// 我们的type类型和我们interface接口类型其操作是一致的// ElectricCar继承了car 并且有一个自己的一个数据类型约束定义。

2023-12-14 13:46:15 401

原创 在uniApp中使用vuex && vuex实现数据持久化

6) store需要与vue进行关联,在入口文件 main.js 中需要引入仓库内容。4)在此文件中写上我们的六大属性,由于需要模块开发,所以需要结构暴露。3)在目录 modules 中创建一个文件 index.js。5)在store的根目录下再创建一个index.js文件。2. 在 store 目录中的 index.js 进行引入,进行插件辅助。2)在此目录中还需要再创建一个目录 modules。7)在组件内应用,获取store状态方式。1)在应用中创建一个目录 store。

2023-12-13 20:32:49 1205

原创 uniApp自定义导航的布局实现

2. 打开 pages.json 文件在 “pages”数组的style中添加 "navigationStyle":"custom"(默认头部已消失)1. 官网的全局文件有一个pages.json页面路由,找到 globalStyle 的 navigationStyle。4. 可以利用uView组件库设置一个新的导航栏。3. 在全局页面 App.vue 设置样式。

2023-12-12 20:46:04 679

原创 uniApp - tabbar的设置

原生小程序的tabbar和uniApp里的tabbar绝大多数属性是一致的,但是uniApp里可能会有更多的属性设置。在 pages.json 页面,写一个 tabBar 属性,属性值是我们定义的 tabbar。

2023-12-12 16:14:15 1949

原创 uniApp - uView框架的安装

安装有两种方式:1. 下载安装2. npm安装。

2023-12-11 14:18:57 1474

原创 在HBuilder X中安装插件

2. 点击安装新插件 --> 前往插件市场安装。1. 点击菜单栏中的 工具 --> 插件安装。4. 选择下载插件并导入 HBuilderX。3. 选择需要安装的插件。

2023-12-10 18:32:33 1677

原创 uniApp项目的创建,运行到小程序

注:uniapp中如果使用生命周期钩子函数,建议使用哪种?1)点击菜单栏 运行 --> 运行到终端 --> 运行设置。1)打开 微信开发者工具 点击 设置 --> 安全设置。如:想要运行到浏览器,也可以配置 浏览器 路径。如:微信小程序不自动弹出,需要导入项目到 微信小程序 即可。2)填写 微信开发者工具 路径。5. 安全设置(不开启没法运行,产生错误)3. 点击 微信小程序配置 进行内容填写。2. 右击侧边栏点击新建,选择项目。3. 填写项目名,点击创建即可。4. 运行设置(否则没法关联)

2023-12-10 00:23:53 1802

原创 六何分析法分析uniApp

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布iOS、Android、H5、以及各种小程序( 微信/支付宝/百度/头条/00/钉钉/淘宝)、快应用等多个平台。uni-app 在手,做啥都不愁。即使不跨端, uni-app 也是更好的小程序开发框架、更好的App 跨平包框架、更方便的 H5 开发框架。不管领导安排什么样的项目,你都可以快速交付,不需要转换开发思维、不需要更改开发习惯。uni-app官网。

2023-12-09 22:58:36 913

原创 微信小程序 - 分包

首先,微信小程序中使用分包是为了减少首屏的请求,因为微信小程序会默认下载主包内的内容并展示到页面上,但是随着业务量的增加,代码量也会越来越大。开发者可以通过配置,在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度。packages:进入页面后预下载分包的 root 或 name __APP__表示主包。注:独立分包 子包是不可以使用主包的资源的,它是完全独立的(子包中的资源是没有全局概念的)注:普通分包 子包是可以使用主包的资源的。在普通分包的前提下,在加上。

2023-12-08 20:01:05 552

原创 微信小程序 - 格式化操作 && moment.js格式化常用使用方法总结大全

1) moment获取天的23时59分59秒可以用moment().endOf(String)获取天的0时0分0秒可以用moment().startOf('day')2)获取本周最后一天(周六)23时59分59秒。6)当前日期之前的某一天/周/月/年/4)获取当前月最后一天23时59分59秒。5)当前日期之后的某一天/周/月/年/3)获取本周第一天(周日)0时0分0秒。3)获取本周周日23时59分59秒。5)获取当前月第一天0时0分0秒。4)获取本周周一0时0分0秒。2)获取今天0时0分0秒。

2023-12-08 16:40:12 1764

原创 git的基本操作

【代码】git的基本操作。

2023-12-08 11:40:21 341

原创 git代码提交规范

【代码】git代码提交规范。

2023-12-07 15:44:47 656

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除