- 博客(30)
- 收藏
- 关注
原创 uniapp开发微信小程序通过高德Api获取城市信息和天气信息
获取当前的地理位置、速度。在微信小程序中只能获取到当前的经纬度,无法获取到当前所在的城市信息。接下来我们通过使用高德地图提供的逆地理编码,通过经纬度拿到当前的城市信息。我们发现只能返回经纬度信息,并不会返回城市信息。这样我们就通过逆地理编码拿到了我们的城市信息。我们发现有只有app才支持geocode。接下来我们通过拿到的城市信息去获取天气信息。首先,我们先在控制台申请一个key。我们就可以获取当前的天气了。然后下载微信小程序插件。下载完成之后放入到项目中。通过uniapp提供的。看一下我们拿到的信息。
2024-11-25 09:49:15
420
1
原创 SPA和SSR
SPA应用程序只需要在第一次请求时加载页面,页面切换不需要重新加载,而传统的Web应用程序必须在每次请求时都得加载页面,需要花费更多时间,因此,SPA页面加载速度要比传统Web应用程序更快。
2024-10-28 11:31:43
968
原创 前端性能优化
路由懒加载:通过动态导入(如使用import())来延迟加载那些非初始页面的组件,直到用户访问这些路由时才加载相应的组件代码,减少首屏加载时间。
2024-07-05 14:15:50
941
原创 Nest使用multer实现文件上传,并实现大文件分片上传(下)
当文件很大的时候,上传就会变得比较慢。假设传一个 100M 的文件需要 3 分钟,那传一个 1G 的文件就需要 30 分钟。这样是能完成功能,但是产品的体验会很不好。所以大文件上传的场景,需要做专门的优化。把 1G 的大文件分割成 10 个 100M 的小文件,然后这些文件并行上传,不就快了?然后等 10 个小文件都传完之后,再发一个请求把这 10 个小文件合并成原来的大文件。这就是大文件分片上传的方案。
2024-06-28 10:04:15
901
原创 Nest使用multer实现文件上传,并实现大文件分片上传(上)
Nest 的文件上传是基于 Express 的中间件 multer 实现的,所以在学习 Nest 文件上传之前,我们先学习下 multer 包的使用。
2024-06-20 09:55:47
1082
原创 了解Nest.js
项目开发离不开工程化的部分,比如创建项目、编译构建、开发时 watch 文件变动自动构建等。Nest 项目自然也是这样,所以它在 @nestjs/cli 这个包里提供了 nest 命令
2024-06-18 20:59:15
815
原创 谈谈前端开发中的防抖和节流
防抖和节流是前端开发中常用的函数优化手段,它们可以限制函数的执行频率,提升性能和用户体验。主要用于处理高频触发的事件,例如:用户的滚动、输入、点击和表单的重复提交等。在实际的前端开发中,防抖和节流的使用场景非常广泛。例如:搜索框的实时搜索建议可以使用防抖来减少服务器请求;滚动加载更多数据可以使用节流来防止在短时间内发送过多的请求。通过使用这两种技术,我们可以有效地优化前端的性能,提升用户体验。
2024-05-16 17:14:42
387
原创 2024最新版Vue3+Ts+Vite初始化项目框架(保姆级)
一句话总结:使用vite构建项目,启动的速度要比使用webpack构建更快。
2024-05-16 16:58:29
7111
3
原创 跨域及三种常见解决方案
跨域是浏览器受同源(协议、域名、端口)策略的限制,不允许不同源的站点之间进行某些操作(如发送ajax请求,操作dom,读取cookie),如果不进行特殊配置是不能操作成功的,并且控制台会报如下跨域错误:两个常见的例子:前后端分离的项目联调时,客户端和服务端ip不一致一般前端本地服务启动在localhost:8080上,服务端接口部署在联调服务器上,此时向联调服务器发送请求的话就会发生跨域大型项目中可能需要多个服务,不同职责的服务部署在不同的端口上,甚至多个服务器上在当前网站页面上请求其他服务器或者其他端口
2024-05-09 18:18:26
533
原创 vue-router 详细讲解 !!!
keep-alive 组件监听 include 及 exclude 的缓存规则,若发生变化则执行 pruneCache (遍历cache 的name判断是否需要缓存,否则将其剔除) 且 keep-alive 中没有 template,而是用了 render,在组件渲染的时候会自动执行 render 函数,对于使用历史路由模式的单页应用(SPA),通常会在服务器配置中添加一个通配符路由,将所有非静态资源的请求都重定向到主页或一个自定义的 404 页面,以保证在前端处理路由时不会出现真正的 404 错误页面。
2024-02-23 11:45:44
927
原创 闭包在实际开发中的运用
闭包(Closure)是指在函数内部创建的函数,它可以访问外部函数的变量和参数,即使外部函数已经执行完毕,闭包仍然可以访问这些变量和参数。
2024-02-02 17:38:58
1068
原创 看完这篇,吃透Cookie和Session
Session被称为服务端存储数据技术,他依赖的仅仅是返回给前端的Cookie:SessionId,因此在服务端需要存储一些额外的数据,例如用户的个人信息。
2024-02-02 16:53:16
907
原创 一次性弄清前端上线和生产环境地址
前端项目打包后,我打包过的静态资源是如何访问后端服务的?访问后端服务的时候难道不存在跨域的问题吗?如何解决的?假如我想自己简单修改下部署后的目录该如何去做?
2024-02-01 17:55:11
1050
原创 十分钟学会WebSocket
WebSocket是一种在客户端和服务器之间实现双向通信的网络协议。它通过在单个TCP连接上提供全双工通信功能,使得服务器可以主动向客户端推送数据,而不需要客户端发起请求。WebSocket 协议是一种基于 TCP 的应用层协议,它提供了在客户端和服务器之间进行双向通信的能力。相比传统的 HTTP 协议,它具有更低的延迟和更高的实时性。WebSocket 协议通过建立一条持久化的连接来实现双向通信,从而避免了 HTTP 协议中频繁建立和断开连接的过程,减少了网络开销和服务器的负担。
2024-02-01 17:38:57
1331
原创 JS特效:跟随鼠标移动的小飞机
由代码中即可知道实现逻辑。如果想独自享用此功能,不想让他人知道原理、不想被他人修改,可以将核心JS代码进行混淆加密。实现的原理是:当鼠标在网页中移动时,获取鼠标位置,同时设置飞机指向、并移动飞机位置,直至飞机到达鼠标位置。重点代码是mousemove事件接管函数和移动飞机位置函数draw。前端网页中,用JS实现鼠标移动时,页面中的小飞机向着鼠标移动。加密后的代码,会成为以下形式,使用起来还跟加密前一样。劳逸结合,写代码久了,休息休息。一个小小的JS特效,但效果挺不错。对上述JS代码加密。
2023-12-26 11:39:25
476
原创 Sass(Scss)、Less的区别与选择 + 基本使用
Sass(英文全称:Syntactically Awesome Stylesheets)是一个最初由 Hampton Catlin 设计并由 Natalie Weizenbaum 开发的层叠样式表语言。是一种动态样式语言,Sass 语法属于缩排语法,比 CSS 多出变量、嵌套、运算、混入(Mixin)、继承、颜色处理、函数等功能,更容易阅读。在开发最初版本之后,Weizenbaum 和 Chris Eppstein 继续通过 SassScript 来继续扩充 Sass 的功能。
2023-12-26 11:22:51
550
原创 WebSocket的11个面试常见知识点
WebSocket 作为一种基于 TCP 协议的实时通信协议,为前端应用提供了强大的双向通信能力。本文将深入探讨前端 WebSocket 的相关问题,包括协议区别、用法、关键技术点等。
2023-12-26 11:10:52
319
原创 详解async/await —— 从入门到实现原理
通过前后对比,我们可以发现,在需要异步任务按照顺序严格执行的情况下,async/await可以避免嵌套过多的情况,取而代之的是简单易懂的同步形式代码。
2023-12-22 17:44:17
850
原创 你和我一样纠结过vue3的 ref() 和 reactive()吗?
官方文档建议:因为reactive()的局限性,所以建议使用ref()作为声明响应式状态的主要 API.
2023-12-18 16:28:17
208
原创 基于Node.js+Vue3+MongoDB 实现企业门户管理后台
企业门户后台管理系统采用nodejs技术,基于mongodb开发,前端使用vue3框架,实现了个人中心,用户管理,产品管理,权限管理等内容
2023-09-04 14:14:12
1059
1
原创 VUE中常用的4种高级方法
除了生成普通的组件,render 方法还可以生成函数式组件。函数式组件没有状态,只接收 props 作为输入,并返回一个 VNode。因为函数式组件没有状态,所以它们的性能比普通组件更高
2023-08-29 16:48:09
73
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人