ios14/ios15系统video标签无法自动播放视频问题 ios14/ios15 系统 video 标签无法自动播放视频问题背景出于用户体验考虑,浏览器不希望网站能够自动播放视频,即使标签上配置了 autoplay 属性,也无法播放视频。 解决办法就是将视频设置为静音播放,这样其实从体验上来讲视频和一个 gif 也没有什么区别,只要视频静音,浏览器就能够自动播放视频。 https://caniuse.com/mdn-html_elements_ 2024-11-15 前端 #ios #webview
ssr同构框架下的html缓存问题 先说结论使用 nuxt3 框架开发的同构应用,建议在服务端输出 html 时强制浏览器禁用缓存,配置方法: 123456789export default defineNitroPlugin((nitro) => { nitro.hooks.hook("render:response", (response, { event }) => 2024-09-11 前端 #nuxt3
fetchApi拦截与数据上报 背景之前的文章有分享过 flogger 和 arms 对前端请求数据进行拦截和上报的原理,当时只做了对 xhr 的拦截和上报,现在新的框架基本都使用 fetch 作为数据请求的工具。请求日志需要对 fetch 请求进行拦截和上报。 原理线上代码 12345678910111213141516171819202122232425262728293031323334353637383940414243 2024-09-04 前端 #监控
k8s部署logstash k8s 部署 logstash直接上配置: 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939 2024-08-22 运维 #docker #k8s
构建基于nodejs能够连接k8s集群的docker基础镜像 构建基于 nodejs 能够连接 aws eks 集群的 docker 基础镜像背景想要从 gitlab 上通过 gitlab-ci 自动构建并推送到 aws eks 集群上,需要能够从 ci 上直接执行 aws 命令。 支持连接多套集群,例如腾讯云 tke 和 aws eks。 构建镜像12345678910111213141516171819202122232425FROM node:18.1 2024-08-22 运维 #docker #k8s
next3框架报错 Failed to patch the fetch module already patched. next3 框架报错 Failed to patch the fetch module already patched.错误信息1234{ "message": "Failed to patch the \"fetch\" module: already patched.", "stack": " 2024-08-22 前端 #nuxt3
nuxt3框架dev环境启动无法重定向到外部链接 问题描述应用场景:用户打开网页时,需要检查登录状态,若未登录则需要跳转到 sso 登录页面进行登录,sso 登录页并不在项目中,属于第三方系统。 当前页面:http://localhost:3000/ 跳转目标:http://sso.example.com/login 问题:在 dev 环境下,应用启动后,页面会自动跳转到 sso 登录页面,但实际上并没有跳转,而是显示了如下错误信息: 原因分析 2024-05-27 前端 #nuxt3
k8s集群配置ServiceMonitor不生效 现象配置完类型为 ServiceMonitor 的 CRD 并应用后,并未采集到期望的指标数据。 排查查看 Prometheus Web UI 的 Targets 页面,可以看到 ServiceMonitor 配置的目标服务没有出现在面板中,确认应为配置问题。 检查项1234567891011121314151617apiVersion: monitoring.coreos.com/v1kind: 2024-04-29 运维 #k8s #prometheus
nuxt3项目createError的注意事项 Nuxt3 项目 createError 的坑Nuxt3 项目中,如果需要在页面渲染时抛出错误,取消原本的组件渲染,使用通用的错误页面,官方提供了 createError 方法可以实现。 可以参考的官方文档:https://nuxt.com/docs/getting-started/error-handling#error-pagehttps://nuxt.com/docs/guide/direc 2024-04-24 前端 #nuxt3
(更新)短信唤起App/小程序的最佳实践 H5 打开/下载 APP 方法汇总之前的文章H5 打开-下载 APP 方法汇总介绍了 H5 页面如何友好唤起 APP 的方法。 通过 schema URL 和 universal links 配合可以实现当用户安装 APP 时唤起 APP,未安装时下载 APP 的交互体验。 本文主要是将上述方法结合起来,讨论在用户在短信场景中具体的实现方案。 需求描述运营下发短信,用户点击短信中的短链后 2023-05-30 前端 #移动端 #微信小程序