- 博客(61)
- 收藏
- 关注
原创 Next 项目中 Prisma 的使用全解析
在schema.prisma文件中,我们可以定义数据模型。这里定义了一个User模型,包含id、name和email字段,其中id是唯一标识,email字段也是唯一的。
2025-02-24 10:50:55
409
原创 Next.js国际化:next-i18next
next-i18next 是一个专为 Next.js 应用程序打造的国际化解决方案,它建立在 i18next 和 react-i18next 这两个强大的库之上。i18next 是一个功能丰富的国际化框架,提供了全面的翻译功能,包括语言的切换、复数形式的处理、插值等;react-i18next 则是 i18next 在 React 应用中的桥梁,使得在 React 组件中使用 i18next 的功能变得更加便捷。next-i18next 集成了这两者的优势,为 Next.js 项目提供了一站式的国际化服务。
2025-02-12 18:15:49
1606
1
原创 解决网站http请求显示已屏蔽的问题
例如,篡改 HTTP 脚本内容,注入恶意代码,从而窃取用户信息(如登录凭证、个人数据等),或者进行钓鱼攻击,误导用户执行有害操作。而 HTTPS 通过 SSL/TLS 加密,能有效防止中间人攻击,若 HTTPS 页面包含 HTTP 资源,就如同在坚固的防线中打开了一个缺口,使整个页面的安全性大打折扣。浏览器通常会向用户发出警告,提示该页面存在不安全的部分。当引入 HTTP 资源时,由于 HTTP 本身不具备数据完整性校验机制,这些资源可能在传输过程中被篡改,这与 HTTPS 保证数据完整性的目标相悖。
2025-01-23 15:04:11
798
原创 服务器部署网站+域名修改
在这里,将旧域名替换为新域名。假如没有这个文件,那就创建一个。在终端进入 直接输入 tmux 进入 tmux命令行。注意:你的域名要指向你的服务器。:如果尚未安装,您需要先安装Certbot。:确保配置文件没有语法错误。
2025-01-08 16:40:42
322
原创 服务器上会话存储项目
至此,我们已经全面了解了 Tmux 的基本用法,从安装启动、会话管理,到窗格与窗口操作,每一个环节都能助力大家提升工作效率。Tmux 就像是一个强大的指挥中心,让你的命令行任务有条不紊地进行。希望大家多多实践,熟练掌握这些操作,将 Tmux 融入日常工作流程。随着对 Tmux 的深入使用,你还会发现更多高级用法,如自定义配置、脚本自动化等,进一步挖掘它的潜力。若在使用过程中遇到问题,可参考 Tmux 官方文档(
2024-12-31 14:00:27
1233
原创 大语言模型的token和向量
现在大语言模型火了,像 ChatGPT 什么的,能回答问题、写文章,。但它们为啥这么聪明呢?这就和向量、Token 有关系。那怎么通过向量、Token来理解我们的问题呢。看完这篇文章就知道了。
2024-12-27 09:39:51
1791
原创 promise输出
所以在这之后,同步代码部分执行完毕,开始处理异步任务队列。函数时,函数首先会执行同步代码部分,也就是立即执行。最后,因为所有的异步操作都已经完成,会执行最后链接的。,它会将传入的回调函数异步延迟执行。可以先自己写一下,答案等到最后在揭晓。并不会执行,而是直接跳到第一个。,所以会继续执行后面链接的第二个。同样由于异步特性,在这个新的。的异步特性,此时会先执行。方法内部又返回了一个新的。延迟时间到了之后,会执行。方法已经返回了这个新的。,所以控制台首先会输出。
2024-11-27 19:24:13
394
原创 react-rnd的使用(react使用拖拽,缩放组件)
看之前可以了解一下拖拽的原理(给自己博客打的广告,推广一下,想了解的可以看一下,不想了解的可以忽略)
2024-11-13 17:36:00
1206
原创 html5拖放
拖放,字面意思就是拖动,放置在编程里面也是如此,拖放是一种常见的特性,即抓取对象以后拖到另一个位置。在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放。
2024-11-07 17:40:13
524
原创 前端项目使用高德地图插件
编写 HTML 页面的基本的结构代码,需要一个<div>节点作为地图容器,同时为此<div>指定id属性。进入应用管理,创建新应用,新应用中添加 key,服务平台选择 Web端(JS API)。使用 JS API Loader 来加载,引入在控制台申请的 key 和安全密钥。创建成功后,可获取 key 和安全密钥。,如果没有开发者账号,请。
2024-11-01 14:16:09
806
原创 react小技巧--useState实现假深拷贝
钩子来初始化状态时,状态的初始值是被“冻结”在组件首次渲染时的。这意味着,如果你使用一个变量。的值也不会改变,因为它在组件首次渲染时已经被设置了初始值。所以是假深拷贝,并不是真的深拷贝。的值在组件的整个生命周期中都不会改变,即使。在 React 中,当你使用。本身在组件外部被修改了。在上面的代码中,即使。
2024-10-23 14:54:14
367
原创 项目打包不同环境
在项目的根目录下创建.env文件。你可以为不同的环境创建不同的文件,例如等。文件配置在.env文件中定义环境变量,变量名必须以VITE_为前缀才会暴露给客户端代码。例如在应用程序中,你可以通过对象来访问这些环境变量。这将输出定义在.env文件中的环境变量的值。项目会根据启动命令自动加载相对应的环境配置文件。vue,react是根据文件名进行加载的,所以说“不要乱起名,也无需专门控制加载哪个文件”可以通过 npm run 看有哪些可以运行项运行的时候主要还是看中xxxx属性的--mode。
2024-10-18 19:48:09
391
原创 Tailwind Css的使用
官网解释:Tailwind CSS 的工作原理是扫描所有 HTML 文件、JavaScript 组件以及任何 模板中的 CSS 类(class)名,然后生成相应的样式代码并写入 到一个静态 CSS 文件中。我的理解是利用Tailwind CSS 提供的特定的类名,它帮你来实现css。项目里面饮入Tailwind Css样式。在main.js全局引入对应的css文件。配置文件中添加所有模板文件的路径。下载好之后项目里面就会有。
2024-10-09 20:00:56
1191
原创 网站自动识别使用设备
当然还有一些别的方法,例如nginx上搞了一个detector,用于识别终端和设备类型。或者http协议的request headers中包含了user-agent这个key,获取这个key-value就可以判断是用什么访问了都可以实现,不过需要后端同学,帮一下忙了。现在有一个需求是,写了两组页面,进行渲染,一组是pc端,另外一组是移动端,要自动匹配当前设备进行渲染。通过判断来决定请求不同的资源,来实现在不同的设备显示不同的页面。2.通过检测屏幕宽度来判断。屏幕宽度: 1396。
2024-09-20 10:02:12
639
原创 NVM(node.js版本工具)的使用
NVM 是 Node Version Manager 的缩写,它是一个用于管理版本的命令行工具。通过NVM,你可以在同一台机器上安装和切换多个 Node.js 版本,对于开发和测试在不同 Node.js 版本上运行的应用程序非常有用。
2024-09-16 14:10:57
964
原创 css实现左右固定中间自适应三栏布局
在三栏布局中,如果使用固定定位,左右两栏会一直固定在视口的两侧,不会随着中间内容的滚动而调整位置,这可能会导致在页面较长时,左右栏与中间内容的关联性变得很弱,视觉上也可能会显得不协调。),然后将左右两栏设置为绝对定位,就可以使左右两栏相对于容器进行定位。在三栏布局中,中间自适应的部分可以根据内容的多少自动调整宽度,而左右两栏通过绝对定位可以固定在容器的两侧,不会受到中间内容宽度变化的影响。用绝对定位将左右两栏固定在两侧,中间栏通过设置左右边距来让出左右两栏的空间,实现自适应。
2024-08-24 21:17:20
614
原创 vue3实现video视频+弹幕评论
vue3实现视频加评论之前写了一篇博客使用了弹幕插件vue3 使用弹幕插件,今天对这个页面进行了升级变成了。
2024-08-10 15:37:15
1147
原创 vue3+ts封装Websocket
在中使用Websocket可以让我们轻松地实现实时数据传输。为了方便使用,我们可以封装一个好用的Websocket类。
2024-08-03 21:02:24
1236
2
原创 《这就是软件工程师》摘抄
软件工程师的四个阶段如果我们把软件工程师的金字塔分为四大台阶,那它们 分别是 新手阶段、进阶阶段、高手阶段和行业大神阶段 这四个阶段分别对应这样几种能力:执行力、设计能力、融会贯通的能力、沉淀方法论和开创新领域的能力新手阶段强调执行力。你刚刚进公司是新人的时候,会 被分配一些任务,上级会非常明确地告诉你任务是什么,用什么样的方法达成什么样的目标。你按照方法一步步去做, 保质保量完成,就可以了。 进阶阶段强调设计能力。这个时候,上级布置给你任务,部分 行业地图 23 但不会告诉你怎么做 相当于他给
2024-07-23 21:30:31
865
原创 优雅的软件工程师
感受:以前写项目什么的没意识到什么是优雅,反正就知道自己写的一般,有的地方写的还很繁琐,后面看书看到一句话,高级的程序员写的代码要么所有人都看的懂,要么所有人都看不懂,及今天又看到了这些脑洞,真是感觉人外有人,天外有天,真T-m优雅呀,太厉害了,希望自己也能努力写出优雅的代码。题目说了范围不超过100000,没超过size能发现空节点就是没有环, 超过了就是有环!今天写算法的时候、通过两道题深深意识到了,什么是优雅的代码(应该说不按套路出牌的代码)天才,真是天才,这三种都秀到我了,尤其是第一种,脑子发麻。
2024-07-19 15:33:57
412
原创 JS的隐式转换
JavaScript中的隐式转换是指在运行过程中,代码自动将一个数据类型转换为另一个数据类型,而无需显式地调用转换函数。JavaScript是弱类型语言,这意味着它不像Java,C++一样的强类型语言有预先确定的类型。并且变量的类型是由值的类型来决定的,这导致了一个问题,一个变量可能上一步骤操作中还是String,下一步操作可能立刻变为了Object,为了解决不同类型无法进行计算,JS底层会将不同类型转换为同一类型,由JS运行环境自动帮我们去做的类型转换。
2024-07-13 11:03:46
830
原创 uniapp使用数据持久化存储
持久化存储是指将数据存储在非易失性介质中,以保证数据在系统重启或断电后仍能保持不变。这种存储方式确保数据持久存储并且可靠地被读取和访问,简答来说:就是防止丢失,长期存储。
2024-06-02 10:36:13
1364
1
原创 uniapp开发微信小程序问题集锦(1)
看uniapp的官方文档,之前用的是uni.login会返回一个短code,后端是用不了的,后面通过询问才知道因该是使用button的方法@getphonenumber这样能够获取到手机号,并返回一个长code,这个后端才可以使用,用法如下。这次项目使用的是pinia存储token,使用pinia的时候使用错误了,刚开始一直存储不上,后面才发现是defineStore使用错误,刚开始直接复制另一个文件的definstore,只改了内容,后面发现是用不了,才知道是id重复了。等方法选择节点,并使用。
2024-05-26 15:32:34
526
原创 unaipp修改图片样式,微信小程序无效果
作者再使用uniapp 写微信小程序的项目时,使用image,为项目添加图片,发现浏览器显示正常,微信开发者工具里面显示不正常,怎么调样式发现微信开发者工具样式不变后面看官方文档。发现微信小程序里面设置的image组件默认宽度320px、高度240px。很离谱呀,不能自己改样式,要想改样式只能设置属性mode。通过mode来改变样式,mode就是图片缩放模式。mode的值,根据自己的需要设置。
2024-05-17 16:53:43
437
原创 关于默认浏览器的修改
电脑上之前自带的是Edge,用着很舒服,但是作为前端开发人员,为了方便开发还是使用Chrome浏览器比较舒服,于是决定修改默认浏览器。
2024-05-17 16:32:48
432
原创 Vue单页面应用和多页面应用的区别
概念:SPA单页面应用(SinglePage Web Application),指只有一个主页面的应用,一开始只需要加载一次js、css等相关资源。所有内容都包含在主页面,对每一个功能模块组件化。单页应用跳转,就是切换相关组件,仅仅刷新局部资源。 MPA多页面应用 (MultiPage Application),指有多个独立页面的应用,每个页面必须重复加载js、css等相关资源。多页应用跳转,需要整页资源刷新。
2024-05-04 15:52:14
460
原创 防抖和节流
函数是指在事件被触发 n 秒后再执行回调,如果在这 n 秒内事件又被触发,则重新计时。这可以使用在一些点击请求的事件上,避免因为用户的多次点击向后端发送多次请求。函数是指规定一个单位时间,在这个单位时间内,只能有一次触发事件的回调函数执行,如果在同一个单位时间内某事件被触发多次,只有一次能生效。节流可以使用在 scroll 函数的事件监听上,通过事件节流来降低事件调用的频率是,要使函数要在事件结束时调用,不应边使用边调用,防止浪费资源,不然会一直请求,对服务器造成压力。
2024-05-04 15:20:52
412
原创 浏览器的同源策略与解决跨域
根据同源策略,浏览器允许网页加载和执行来自同一源(即具有相同协议、域名和端口号)的资源,但限制了对不同源资源的访问。如果网页不满足同源策略的要求,就无法通过 JavaScript 访问对方的文档对象模型(Document Object Model,DOM),或者进行 XMLHttpRequest 请求获取对方的数据。然而,同源策略也存在一些例外情况,如通过使用跨域资源共享(Cross-Origin Resource Sharing,CORS)机制,服务器可以明确地授权其他源的网页访问资源。
2024-04-26 20:36:41
474
原创 null和undefined区别
undefined 在 JavaScript 中不是一个保留字,这意味着可以使用 undefined 来作为一个变量名,但是这样的做法是非常危险的,它会影响对 undefined 值的判断。当对这两种类型使用 typeof 进行判断时,Null 类型化会返回 “object”,这是一个历史遗留的问题。当使用双等号对两种类型的值进行比较时会返回 true,使用三个等号时会返回 false。一般变量声明了但还没有定义的时候会返回 undefined,null主要用于赋值给一些可能会返回对象的变量,作为初始化。
2024-04-16 16:15:51
421
1
原创 MVVM、MVC、MVP的区别
MVC 中的Controller 只知道 Model 的接口,因此它没有办法控制 View 层的更新,MVP 模式中,View 层的接口暴露给了 Presenter 因此可以在 Presenter 中将 Model 的变化和 View 的变化绑定在一起,以此来实现 View 和 Model 的同步更新。页面的渲染、数据的获取,对用户事件的响应所有的应用逻辑都混合在一起,这样在开发简单项目时,可能看不出什么问题,如果项目变得复杂,那么整个文件就会变得冗长、混乱,这样对项目开发和后期的项目维护是非常不利的。
2024-04-16 16:13:51
431
原创 uniapp项目问题及解决(前后端互联)
写表单的时候光注意样式了,复制的人家的源码,觉得上面的东西太多了,我就都删了,最后效果也能实现,但是没有检验了,后面能调用接口了,发现越来越别扭,因为没有校验,所以写啥都能过,果然不能省事,所以后面我还得再补,有点难受了,后面还得写reuls,还由页面结构也得在补包裹的对象。这次写的时候,调用总宁的接口,能调用上去,但是这边一直一直传数据传不过去,最后问了学长,是自己配代理服务器的时候用的两个的端口都用的同一个,导致出的问题,和后端连接我这边出了不少问题,一直有问题,一直改,还是太菜了。
2024-04-08 09:47:02
2070
原创 解决vue3+ts组件ref定义但是访问不到组件属性
语法糖组件中明确要暴露出去的属性,使用 defineExpose 编译器宏将需要暴露出去的变量与方法放入暴露出去就可以.语法糖的组件是默认关闭的,也即通过模板 ref 或者 $parent 链获取到的组件的公开实例,不会暴露任何在。难为死我了,一直访问不到,找了好久难受死了。为什么父组件访问不到属性呢。
2024-04-08 09:42:32
590
原创 前端代码规范-命名规范
业务组件:它不像基础组件只包含某个功能,而是在业务中被多个页面复用的(具有可复用性),它与基础组件的区别是,业务组件只在当前项目中会用到,不具有通用性,而且会包含一些业务,比如数据请求;基础组件:不包含业务,独立、具体功能的基础组件,比如日期选择器、模态框等。这类组件作为项目的基础控件,会被大量使用,因此组件的 API 进行过高强度的抽象,可以通过不同配置实现不同的功能。应用特定样式和约定的基础组件(也就是展示类的、无逻辑的或无状态、不掺杂业务逻辑的组件) 应该全部以一个特定的前缀开头 —— Base。
2024-04-01 16:14:59
1249
原创 Vue3的生命周期
Vue组件实例在创建时要经历一系列的初始化步骤,在此过程中Vue会在合适的时机,调用特定的函数,从而让开发者有机会在特定阶段运行自己的代码,这些特定的函数统称为:生命周期钩子。
2024-03-29 11:22:37
251
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人