HTML前端
文章平均质量分 57
1024小神
不会就去学,学习是永远不会亏的(wx:lanxingme)
展开
-
tauri开发中如果取消了默认的菜单项,复制黏贴撤销等功能也就没有了,解决办法
【代码】tauri开发中如果取消了默认的菜单项,复制黏贴撤销等功能也就没有了,解决办法。原创 2024-11-02 22:48:25 · 214 阅读 · 0 评论 -
清除tauri默认的菜单项,让顶部的菜单menu不显示
默认的tauri程序是有自带有这些菜单选项的,但是有时候我们就是想要一个干净的顶部,不需要这么多繁杂的菜单,就可以通过自定义配置菜单来实现。原创 2024-11-02 16:48:05 · 88 阅读 · 0 评论 -
vite和uniapp项目配置打包编译的静态文件夹目录名称
但是这个时候会有一个问题,就是src下面的静态资源目录,还是会单独复制到dist目录下,即便你配置了assetsDir,还是会使用原始的src下面的静态资源名称,所以要想改名称,还是要将静态资源的目录也修改掉,并且在项目中的引用路由都修改掉。中,确保对所有文件类型的输出配置进行适当设置。原创 2024-10-31 15:24:17 · 178 阅读 · 0 评论 -
uniapp和vite项目配置多环境编译,增加测试环境变量配置--mode test
自定义的环境模式只能通过uni cli 的选项 --mode {mode} 来实现,这也是为什么 使用HBuliderX cli 创建的项目不推荐使用.env,因为就算配置了.env文件,且确实在环境中可以拿到这些环境变量,但是只支持「运行」和「发行」对应的 .env.development 和.env.production ,如果我们想自定义一个test测试环境变量,是拿不到的,因为只能通过uni cli对应的mode选项标志去跑对应的环境,而HBuilderX无法配置mode。原创 2024-10-31 10:52:15 · 1004 阅读 · 0 评论 -
前端请求后端接口报错(blocked:mixed-content),以及解决办法
出现这个错误的原因是,您的前端应用可能正在尝试加载一个HTTP资源,而该资源应该通过HTTPS协议进行传输。由于HTTP协议是不安全的,它可能会被中间人攻击(Man-in-the-Middle Attack)拦截,导致数据泄露或恶意修改。因此,浏览器默认阻止了这种不安全的请求。混合内容是指在同一页面中同时包含安全(HTTPS)和非安全(HTTP)资源的情况。当浏览器试图加载非安全资源时,它会发出“混合内容”警告,阻止加载不安全的请求。为什么会出现“blocked:mixed-content”错误?原创 2024-10-29 16:27:35 · 571 阅读 · 0 评论 -
Vue/React单页面应用部署到nginx服务器时,错误解决以及刷新404
一般来说,SPA 通过前端路由来管理页面导航,而刷新页面时,Nginx 直接尝试加载当前 URL 的资源,却找不到对应的文件,从而导致 404 错误。将项目部署到var/www目录中,然后修改nginx里面的root路径地址为var/www中。这样,当用户在登录页面或其他页面刷新时,Nginx 会将请求重定向到。将 Nginx 配置修改为以下内容,以确保所有请求都可以重定向到。可能是没有将dist文件夹放置到var/www/目录中,因为。,让前端的路由逻辑来处理 URL。,即用户请求的资源。原创 2024-10-29 14:29:31 · 1130 阅读 · 0 评论 -
PakePlus将任何网页免费打包为mac/windows跨平台软件程序教程,只需要一个Github token就可以了
PakePlus是一个开源免费的软件,支持 Mac、Windows 和 Linux,很快也将支持 Android 和 iOS。无需在本地安装复杂的依赖环境,只需要一个Github Token就可以了。查看 README 以获取和信息。欢迎在分享你的建议。原创 2024-10-27 18:31:35 · 1070 阅读 · 0 评论 -
vue3使用i18n做国际化多语言,实现常量跟随语言切换翻译
因为我有一个常量的配置文件在项目中,而且有中文内容,我想在切换语言的时候,跟着这个翻译也实时切换,就可以使用computed计算属性实现。原创 2024-10-25 18:00:41 · 229 阅读 · 0 评论 -
tauri程序获取电脑使用的语言和主题查询
注意:使用os需要开启访问权限。原创 2024-10-24 16:03:39 · 186 阅读 · 0 评论 -
mac电脑设置chrome浏览器语言切换为日语英语等不生效问题
在chrome中设置了语言,并且已经置顶了,但是不生效,在windows上直接有设置当前语言为chrome显示语言,但是mac上没有。原创 2024-10-22 18:18:01 · 563 阅读 · 0 评论 -
多主题和多样式实现思路,多主题可以控制样式,多语言切换也可以控制样式的解决办法
默认已经做了多个主题的样式切换了,但是又要做多语言的功能,所以就遇到了问题:不同的语言同样的意思,但是长度就不一样,所以有时候就会超过Box的时候,这个时候就需要调整字体大小来做适配了,所以就要跟着不同的语言切换来做适配。但是已经有了多个主题配置了,语言和主题不是匹配的,是会交叉出现的,所以不能把字体大小的样式放到主题的样式下面。所以怎么解决这个问题呢?原创 2024-10-22 17:42:47 · 394 阅读 · 0 评论 -
tauri解决convertFileSrc转换文件为url后,更新文件内容但是页面没有更新
我这里之前的逻辑是将存储之后的图片文件,直接使用convertFileSrc转换为url的形式存储起来了,然后后面有页面展示的地方,直接加载就可以了。但是这样就遇到问题,更新了图片文件,但是页面上展示的图片还是没有变化。这是因为图片资源被缓存了。原创 2024-10-22 11:39:41 · 271 阅读 · 0 评论 -
tauri打包失败Error failed to bundle project: error running light.exe解决办法
在 Tauri 使用 GitHub Actions 打包 Windows MSI 时,如果遇到 error running light.exe 的错误,特别是在打包路径中包含非 ASCII 字符(如中文字符 抖音)时,问题可能与 WiX Toolset 不支持文件路径中的非 ASCII 字符有关。只需要配置成一个数组就可以了:["deb", "appimage", "nsis", "app", "dmg", "updater"]1.避免使用非ASCII 字符,只能使用英文和数字的组合形式。原创 2024-10-22 10:40:28 · 366 阅读 · 0 评论 -
tauri打包失败Error failed to bundle project: error running light.exe,是因为WiX Toolset不支持中文,
错误常见原因是路径中包含非 ASCII 字符,特别是中文字符时,可能无法正常处理。通过避免使用中文字符、明确指定 WiX 工具路径和调整 GitHub Actions 工作目录,你可以解决这个问题并成功打包 Tauri 应用。WiX Toolset 是一个开源项目,它的源码托管在 GitHub 上。WiX Toolset GitHub 仓库这是 WiX Toolset 的 3.x 版本仓库,它是目前最常用的稳定版本。如果你想了解更多关于 WiX 的文档、贡献信息以及相关工具的使用,可以在该仓库中找到。原创 2024-10-21 20:48:53 · 1294 阅读 · 0 评论 -
Vue图片裁剪组件推荐vue-cropper,功能丰富可拓展
【代码】Vue图片裁剪组件推荐vue-cropper,功能丰富可拓展。原创 2024-10-21 14:30:08 · 397 阅读 · 0 评论 -
前端页面使用google地图api实现导航功能,开发国外网站免费简单好用
@ & = + $ , #",这些在encodeURI()中不被编码的符号,在encodeURIComponent()中统统会被编码。,则系统会忽略所有参数,并将在浏览器或 Google 地图移动应用中启动默认的 Google 地图应用,具体取决于所使用的平台(例如。用于标识此网址所对应地图网址的版本。每个请求中都需要包含此参数。唯一的有效值为 1。它用于对URL的组成部分进行个别编码,而不用于对整个URL进行编码。原创 2024-10-18 16:46:02 · 462 阅读 · 0 评论 -
uview组件库web开发报错dayjs.min.js?v=2ae60938‘ does not provide an export named ‘default‘解决办法
重新启动服务就不会报错了。原创 2024-10-15 13:51:43 · 203 阅读 · 0 评论 -
tauri开发Mac电脑Safari浏览器一个很奇怪的问题:在 input 输入框输入的是全小写英文字母,会自动将首字母转换为大写解决办法
在 Mac 系统中默认使用Safari的内核WKWebView作为渲染引擎,而Safari浏览器的一些 “人性化” 机制:如果输入框中输入的是全小写英文,会自动将首字母转换为大写。原创 2024-10-09 08:49:22 · 523 阅读 · 0 评论 -
给普通的div或者view等元素添加onblur事件的方式
一般只有input元素有blur事件,但是如果想给普通的元素设置了blur事件之后,它是不会正常直行的。还需要再给元素添加tabindex属性,设置了tabindex属性之后,元素会带有一个下划线,还要去掉下划线,而且聚焦的时候会有样式,也要隐藏掉这个样式。因为我是在uniapp中使用的,所以用的是view标签,在网页端换成div标签即可。原创 2024-10-08 19:10:07 · 348 阅读 · 0 评论 -
vue3封装uniapp一个下拉选择组件select,支持自定义样式和操作
很多组件库里面的select都是沾满半个屏幕的那种,因为业务需求需要这种小巧的下拉选择,就需要自己封装一个,所以这里就分享一下。原创 2024-10-08 18:52:58 · 212 阅读 · 0 评论 -
tauri开发配置文件和文件夹访问路径问题
比如我这里配置的是:即便是APPDATA下面的所有,但是我访问的却是里面的/assets文件夹内容,所以还是会报错,还是需要配置上"$APPDATA/assets/*"在开发tauri软件的时候,如果有用到文件夹访问等,很有可能会遇到这种错误,这是因为你的tauri配置文件没有配置这个文件夹的访问权限导致的。正确配置的:protocol里面的assetScope要和scope一样。注意:访问的时候,可能会报没有此文件的错误。这个时候再去访问:就可以了。原创 2024-09-28 22:04:35 · 480 阅读 · 0 评论 -
tauri加载本地资源展示到前端页面报错because it appears in neither the directive nor the default-src direc
这个错误是因为你的 Tauri 应用的(Content Security Policy, CSP)限制了从加载本地资源,尤其是图片文件。要解决这个问题,你需要在 Tauri 的配置文件中更新 CSP,允许加载本地文件。原创 2024-09-27 10:21:10 · 991 阅读 · 0 评论 -
tauri中加载本地文件图片或者下载网络文件图片后存储到本地,然后通过前端页面展示
有一个需求是需要将本地上传的文件或者网络下载的文件存储到本地,并展示在前端页面上的。要想实现上述需求,需要三个步骤,配置相应的文件和文件夹访问权限,然后将文件存储到软件的相应目录中,再从目录中加载这个资源并展示。原创 2024-09-26 21:58:24 · 845 阅读 · 0 评论 -
tauri中$APPCONFIG, $APPDATA, $APPLOCALDATA, $APPCACHE, $APPLOG, $AUDIO, $CACHE, $CONFIG, $DATA等文件夹含义
为了安全考虑,不允许你直接访问电脑中的文件,可以通过配置访问哪些文件。该模块防止路径遍历,不允许绝对路径或父目录组件(即“/usr/path/to/file”或“。./path/to/file”路径是不允许的)。使用此 API 访问的路径必须相对于基本目录之一,因此如果需要访问任意文件系统路径,则必须在核心层上编写此类逻辑。配置的地方在tauri.config.json中:例如下面的示例,只允许你访问APPDATA中的内容那可以配置哪些文件夹呢?每个文件夹有哪些含义呢?原创 2024-09-26 19:40:57 · 1045 阅读 · 0 评论 -
tauri程序加载本地图片或者文件在前端页面展示
之前,但我却一直没有注意到它,一方面是因为,之前从没有想过要使用绝对路径来转换URL,因为纯前端是做不到这一点的;另一方面,由于思维惯性,前端打开本地文件往往都是用的input file,遇到这个问题我一直想的是如何从input事件着手,没有去仔细看文档……这就是所谓的灯下黑吗。原创 2024-09-26 17:59:23 · 441 阅读 · 0 评论 -
鼠标经过el-dropdown组件上会出现一个蓝色的小框
效果如上图,鼠标经过el-dropdown 组件上会出现一个蓝色的小框。原创 2024-09-26 08:32:48 · 293 阅读 · 0 评论 -
tauri开发软件中,使用tauri自带的api用浏览器打开指定的url链接
【代码】tauri开发软件中,使用tauri自带的api用浏览器打开指定的url链接。原创 2024-09-24 16:30:41 · 556 阅读 · 0 评论 -
tauri嵌入自定义目录/文件,并在代码中读取文件内容的操作流程
在绑定了文件之后,可以在js中访问嵌入的文件或者在rust中读取嵌入的文件内容,详细的配置操作如下。然后就可以在代码中读取这个文件了。原创 2024-09-21 16:43:40 · 447 阅读 · 0 评论 -
Cannot find module ‘./App.vue‘ or its corresponding type declarati....大概率是你编译的时候出错了,解决办法
出现这个错误的原因,是ts编译命令失败导致的,因为ts只认识ts文件,不认识vue文件,所以要想打包编译,就需要使用vue-ts。原创 2024-08-19 14:37:54 · 650 阅读 · 0 评论 -
使用plasmo开发浏览器插件,在页面中插入使用React语言自定义的UI元素
比如我在直播间添加了一个按钮,通过点击这个按钮,弹出来一个弹窗,这个使用的就是React语法和antdui实现的。具体实现的步骤就和你写React一样简单。原创 2024-08-10 09:45:22 · 516 阅读 · 0 评论 -
Vue3中实现自然滚动表格列表,可调整滚动快慢
最开始实现我是想用vue3-seamless-scroll这个插件的,但是使用起来发现,首先它不支持数据少的情况下自动停止滚动,需要传入step为0,感觉不是很方便(也可能是我没有很会用这个插件),所以感觉直接写了一个。这是基于react的滚动列表改造过来的,所以本身留了render口子,可以自定义表内的内容,不只是文字,但是对于vue3跟jsx的结合,我还是不是很熟,所以目前还没有用到render写法。实现效果如图所示,可以调整滚动的快慢,可以实现内容高度不够的时候停止滚动的效果。原创 2024-07-19 21:38:42 · 897 阅读 · 0 评论 -
浏览器跨tab页面通信方式总结
需求:浏览器不同 tab 标签页之间是独立的, 如果要通信必须通过特殊手段来实现跨标签页通信。原创 2024-07-19 18:23:06 · 1595 阅读 · 0 评论 -
6元/年英国Giffgaff卡申请和使用
我们来到页面最底部,选择“Pay as you go”这一项,由于我们只是用它来注册账号、接收验证码等,而使用这张卡又必须要往卡里充值,所以我们选择这一种,向卡里充值10英镑即可,不考虑其他套餐。来到填写个人信息的页面,这里不需要真实身份,至于地址,你可以使用地址生成器随机生成一个,或者你也可以在地图上随机找一条街道作为填写进去的地址。(我使用的是真实地址,用的拼音)底部显示了你的用户名,到时你在登录个人中心时,需要用用户名+密码登录,所以别急着关掉这个页面,记一下用户名(使用手机号也可以登录)。原创 2024-07-09 10:14:19 · 2528 阅读 · 0 评论 -
vue3长列表优化,使用vue-virtual-scroller实现直播间弹幕列表虚拟滚动效果
但是需要注意:获取DynamicScroller这个组件的时候,要使用document.getElementById('liveMsg')这种形式,不能使用ref这种,因为ref获取到的并不是一个html元素,没有scrollTop方法,所以无法滚动到底部。这三个组件区别是滚动每一项高度是固定的还是动态的,Recycle就是固定的高度,Dynamic是动态的,动态的话,必须要包含DynamicScrollerItem。原创 2024-07-02 15:21:39 · 2644 阅读 · 0 评论 -
直播的js代码debug解析找到protobuf消息的定义
我们都知道直播的弹幕消息是通过websocket发送的,而且是通过protobuf传输的,那么这里面传输了哪些内容,这个proto文件又要怎么定义?每个消息叫什么,消息里面又包含有哪些字段,每个字段又是什么类型?都可以通过js查看得到。原创 2024-07-01 11:07:24 · 494 阅读 · 0 评论 -
从直播消息中找到对应的proto协议内容
这么多直播间的消息,我们该怎么从里面找到我们需要的消息定义呢?原创 2024-07-01 11:06:24 · 374 阅读 · 0 评论 -
protobufjs解析proto消息出错RangeError: index out of range: 2499 + 10 > 2499解决办法
使用websocket通讯传输protobuf消息的时候,decode的时候出错了:出现这种错误的时候,99%是因为proto里面的消息类型和服务端发送的消息类型不一致导致的。原创 2024-07-01 11:05:42 · 490 阅读 · 0 评论 -
调试解析直播弹幕消息protobuf内容,一步一步教你debug查看PushFrame和Response解码在哪里
我们知道直播间的弹幕消息是通过websocket传输的,而且传输的并不是明文数据,而是protobuf消息,至于为什么使用这个protobuf消息,因为它是二进制传输,更快更稳,相对于直播这种实时性比较高的要求,使用这种消息传输是非常合适的。原创 2024-06-29 15:13:09 · 825 阅读 · 0 评论 -
tauri使用github action实现跨平台编译并解决编译错误,mac已损坏,无法打开,你应该将它移到废纸篓解决办法
里面有编译文件可以参考。今天主要讲一下遇到的问题。原创 2024-06-28 14:07:03 · 1175 阅读 · 0 评论 -
Failed to resolve import “protobufjs/minimal“ from “src/proto/dy.js“. Does the file exist?
但是这是自动生成的啊,怎么办?原创 2024-06-28 11:55:16 · 316 阅读 · 0 评论