- 博客(109)
- 收藏
- 关注
RSS订阅原创 浏览器播放 WebRTC 视频流
该代码实现了一个基于 Vue 和 WebRTC 的视频播放器。在 Vue 组件中，通过 JSWebrtc.Player 初始化一个 WebRTC 播放器，并将视频流绑定到 <video> 元素上。onMounted 钩子中创建播放器实例，指定视频流地址，并处理播放和错误事件。onBeforeUnmount 钩子中销毁播放器实例，确保资源释放。jswebrtc.min.js 提供了 WebRTC 播放器的核心功能，包括 URL 解析、HTTP 请求、视频元素创建等。整体代码结构清晰，实现了视频流的实时播放与管
2025-05-20 11:52:21
390
原创 Threejs实现天空盒效果
在3D场景开发中，创建逼真的环境光照和背景是提升场景真实感的关键因素。传统6面立方体贴图天空盒虽然可用，但存在接缝明显、高动态范围(HDR)支持不足等问题。Three.js提供了更现代的解决方案——使用HDR等格式的等距柱状投影(Equirectangular)贴图来实现高质量的天空盒效果。
2025-04-07 16:17:09
999
原创 Python：序列化
在Python中，序列化是指将对象的状态转换为可以存储或传输的形式的过程。反序列化则是将这些形式的数据恢复成原始对象的过程。Python提供了多种序列化和反序列化的工具，其中最常用的是pickle和json模块。
2024-11-25 16:02:39
409
原创 Python：列表生成式
列表生成式（List Comprehensions）是一种简洁的方式来创建列表的方法。它允许在一行代码中构建列表，通常比传统的循环结构更加紧凑和易读。
2024-11-19 13:56:45
374
原创 NestJs：处理身份验证和授权
通过以上步骤，可以实现一个简单的用户登录和 JWT 身份验证系统。用户登录时会生成 token，而在需要保护的接口中，通过中间件校验 token 的有效性，以决定是否放行请求。建议把 secret key 存放在环境变量中，以增强安全性。
2024-10-16 15:26:21
493
原创 技术点：go使用gomail包进行邮件发送
如果邮件发送过程中出现错误，Gomail 会返回一个错误信息，我们可以通过简单的错误处理逻辑来捕捉和处理这些异常情况。在这个例子中，我们使用了网易的 SMTP 服务器。如果你使用其他服务商，比如 Gmail 或 QQ 邮箱，只需要根据各自的 SMTP 服务器地址和端口号进行修改即可。接下来，我们使用 gomail.NewDialer() 来设置邮件服务器的信息。SetBody() 则定义了邮件的内容，在这个例子中，我们使用 HTML 格式来定义邮件正文，但你也可以选择纯文本格式。让我们逐步解析这个示例。
2024-09-26 15:14:01
1029
原创 http: 浏览器中的响应头，代码里面无法获取
后端在返回时除了需要写入响应头“Content-Disposition”，还需要设置“Access-Control-Expose-Headers”来让浏览器暴露给script脚本对应的响应头字段。文件下载接口，后端返回一个文件流，并且将文件名携带在响应头"Content-Disposition"上，前端在浏览器中是能看到那个响应头的，但是代码中无法获取。，给js脚本，所以在浏览器调试中可以看到响应回来的所有响应头，却只能获取到几个常见的响应头。
2024-07-08 09:25:48
399
1
原创 GO: 随机数
crypto/rand包是一个可以应用在安全系统中的强伪随机数生成器，因为无法从过去的伪随机数序列中推测出下一个伪随机数，但执行效率没有math/rand高。
2024-05-11 14:36:12
2157
原创 Go: 操作kafka包sarama
sarama 是一个纯 Go 客户端库，用于处理 Apache Kafka（0.8 及更高版本）。它包括一个用于轻松生成和使用消息的高级 API，以及一个用于在高级 API 不足时控制线路上的字节的低级 API。在github上stars上比较多（推荐）。
2024-05-11 14:33:43
720
原创 Go: 中文和unicode字符之间转换
Unicode是为了解决传统的字符编码方案的局限而产生的，它为每种语言中的每个字符设定了统一并且唯一的二进制编码，以满足跨语言、跨平台进行文本转换、处理的要求。在实际应用有很多需要中文和unicode转换的场景，这里主要介绍通过golang实现中文和unicode互相转换。
2024-05-11 14:33:08
727
原创 GO: json 处理
1、用interface{}需要注意， JSON 里的数字默认都会转成 Golang 的 float64 类型，字符是string,使用方式为。如果不想用结构体，怎么办，如api接收过来的参数，不确定json串里面有什么数据类型，可通过interface{}实现。2、golang 里json不是字符串而是 []byte类型，如果想用字符串可以用string()转。需要引入"encoding/json"包。
2024-05-11 14:32:28
659
原创 Go: 语言sync.Map
sync.Map：底层通分离读写map和原子指令来实现读的近似无锁，并通过延迟更新的方式来保证读的无锁化。map+Mutex： 通过Mutex互斥锁来实现多个goroutine对map的串行化访问，读写都需要通过Mutex加锁和释放锁，适用于读写比接近的场景。map+RWMutex：通过RWMutex来实现对map的读写进行读写锁分离加锁，从而实现读的并发性能提高，同Mutex相比适用于读多写少的场景。Go语言中的 map 在并发情况下，只读是线程安全的，同时读写是线程不安全的。
2024-05-11 14:31:53
405
原创 GO: 定时器NewTimer、NewTicker 和time.After
这是因为Stop会停止Timer，停止后，Timer不会再被发送，但是Stop不会关闭通道，防止读取通道发生错误。Go语言的定时器实质是单向通道，time.Timer结构体类型中有一个time.Time类型的单向chan，源码（src/time/time.go）如下。通过源码我们发现它返回的是一个NewTimer(d).C，其底层是用NewTimer实现的，所以如果考虑到效率低，可以直接自己调用NewTimer。这里的defer t.Stop()和上面示例相似，也不会停止定时器，解决办法一样。
2024-05-11 14:28:09
943
原创 GO：流程控制
continue label：和break label 类似，跳转标签只能放在for前面，不会跳出for循环，只是跳过当前单次循环，继续下一次迭代。跟单独使用continue效果一样。这是 Go 特有的一种的迭代结构，您会发现它在许多情况下都非常有用。break label：跳转标签(label)必须放在循环语句for前面，并且在break label跳出循环不再进入for循环里的代码。goto label： 跳转标签(label)可以放在循环语句for前面，也可以放在后面，建议放在后面，避免出现死循环。
2024-05-11 14:27:31
337
原创 Go 之 interface接口理解
go语言并没有面向对象的相关概念，go语言提到的接口和java、c++等语言提到的接口不同，它不会显示的说明实现了接口，没有继承、子类、implements关键词。go语言通过隐性的方式实现了接口功能，相对比较灵活。下面是一些代码示例。
2024-05-11 14:22:29
413
原创 gin:01-框架安装
看下 Gin 框架的官方介绍：Gin 是一个用 Go (Golang) 编写的 web 框架。它是一个类似于 martini 但拥有更好性能的 API 框架, 由于 httprouter，速度提高了近 40 倍。如果你是性能和高效的追求者, 你会爱上 Gin。是的，就是用 Gin 来写 API 接口。
2024-05-11 14:21:27
486
原创 go项目 打包部署流程
点击宝塔左侧网站，点击添加 go 项目，然后将打包好的 main 文件进行选中。官网下载 go 的 linux 版本，然后上传到服务器。在服务器安全组里对 go 项目暴露的端口进行放行。将本地 go 项目放到服务器某个文件夹。对 go 进行解压(注意版本号)配置nginx进行端口代理。
2024-04-10 18:02:45
769
原创 使用Echarts绘制中国七大区地图
先上效果图（文字是否显示，显示什么字，各种颜色之类的，都能随便改）直接上完整代码地图是需要输入数据初始化的以下是地图 json 文件
2024-03-07 09:59:56
995
原创 技术点：实现大文件上传
作为切片 Hash，这样做文件名一旦修改就失去了效果，而事实上只要文件内容不变，Hash 就不应该变化，所以正确的做法是根据文件内容生成 hash，所以我们修改一下 Hash 的生成规则。控制的，目的是能够并发合并多个可读流到可写流中，这样即使流的顺序不同也能传输到正确的位置，所以这里还需要让前端在请求的时候多提供一个。由于前端在发送合并请求时会携带文件名，服务端根据文件名可以找到上一步创建的切片文件夹。无论是前端还是服务端，都必须要生成文件和切片的 Hash，之前我们使用。文件名 + 切片下标。
2023-12-15 10:23:30
711
原创 微信小程序搜索局域网设备
最终目的：在微信小程序内搜索到同局域网内的其他设备实现步骤：小程序开启 mDNS（多播 DNS） 搜索 + 其他设备配置对应的 mDNS 模块。
2023-10-18 09:42:00
1373
原创 使用 AntV X6 + vue 实现单线流程图
X6 是 AntV 旗下的图编辑引擎，提供了一系列开箱即用的交互组件和简单易用的节点定制能力，方便我们快速搭建 DAG 图、ER 图、流程图等应用。
2023-08-01 10:47:36
5917
1
原创 笔记：无界微前端入门
wujie(无界)是腾讯在 2022 年 7 月推出的微前端框架，下面是腾讯前端团队的原话无界微前端方案基于 webcomponent 容器 + iframe 沙箱，能够完善的解决适配成本、样式隔离、运行性能、页面白屏、子应用通信、子应用保活、多应用激活、vite 框架支持、应用共享等用户的核心诉求。
2023-04-18 14:50:47
4452
2
原创 技术掉：PDF显示，使用pdf.js
其实直接显示 pdf 可以用 iframe 标签，但产品觉得浏览器自带的 pdf 预览太丑了，而且无法去除那些操作栏。然后将下载好的文件放进项目的静态文件夹，我用的是 vite 项目，所以是 public。filte 是你的 pdf 的路径，本地路径和 url 路径都是可以的。直接去修改 viewer.html 里面的代码就行了。首先此插件跨域的话会报错，需要注释掉部分代码。下载稳定版的 pdf.js 文件。设置好之后就可以预览了。注释掉之后就可以解决了。
2023-03-17 17:29:48
1707
原创 技术点：前端缓存分类及使用
和浏览器缓存：比如,localStorage,sessionStorage,cookie 等等。这些功能主要用于缓存一些必要的数据，比如用户信息。比如需要携带到后端的参数。亦或者是一些列表数据等等。比较基础，不做过多赘述。
2023-02-06 13:44:03
455
原创 技术点：weekMap和Map的区别
当使用 map 时，由于对键值是强引用，map 的 obj 属性被赋值为空时，obj 所对应的 'xxxx’值其实还是存在的，并没有被回收，所以真正去清空应该使用 delete 方法，然后再清空 obj 的引用。解析：WeakMap 的键是对象的时候，如果该对象被赋值为空时，垃圾回收机制会对那个对象所对应的值也进行垃圾回收。而使用 WeakMap 的时候，想处理属性，直接清空 obj 的引用就行了，obj 所对应的值也会直接被回收。答案： WeakMap 是弱引用。
2023-02-01 15:30:52
623
原创 技术点：sequelize基础入门
对于 UUID,使用 DataTypes.UUID. 对于 PostgreSQL 和 SQLite,它会是 UUID 数据类型;
2023-01-31 13:46:51
614
原创 TypeScript 入门知识点记录
可以使用对象索引签名声明、Record 工具类两种方法。默认 circle 为真时，radius 一定存在。用于构造一个含有 Type 函数的返回值的类型。左侧为可选择的属性，右侧为需过滤掉的属性。左侧为可选择的属性，右侧为选择好的属性。含义是取 T 和 K 未共有的字段。含义是取 T 和 K 共有的字段。左侧为属性类型，右侧为值。
2023-01-10 16:39:28
168
原创 技术点：JavaScript的几种常用高阶函数及其应用场景
维基百科中对偏函数 (Partial application) 的定义为：翻译成中文：在计算机科学中，局部应用是指固定一个函数的一些参数，然后产生另一个更小元的函数。什么是元？元是指函数参数的个数，比如一个带有两个参数的函数被称为二元函数。return a + b } // 执行 add 函数，一次传入两个参数即可 add(1 , 2) // 3 // 假设有一个 partial 函数可以做到局部应用 let addOne = partial(add , 1) addOne(2) // 3。
2023-01-05 14:52:09
471
原创 技术点：vue3 使用 ref 绑定 router-view，想调取某个子路由中的方法来重载数据
当前有一个页面为父路由页面(/system)他的子页面是他的两个下级(/system/user /system/auth)由于搜索框及添加按钮都在父级母版中，现在需要在点击添加按钮或者搜索框搜索时都触发子路由页面对应的方法，如：在tab选中用户列表时，触发子页面内的添加用户方法，tab选中角色权限时，触发子页面的添加角色方法在 /system 中在 /system/user ， /system/auth中
2022-12-07 10:28:45
2009
原创 monaco-editor（code编辑器插件）使用及常用配置与方法
2.在 vite.config.js 中配置3.新建组件code-editor.vue4.使用常用方法// 常用设置// 监听事件editor.getValue()editor.setValue(‘77777’)editor.dispose() //销毁实例monaco.editor.setModelLanguage(editor.getModel(), ‘javascript’) //语言设置editor.getAction(‘editor.action.formatDocument’).r
2022-12-06 15:01:39
6848
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人