h5
分享uniapp移动端和h5项目如何使用谷歌地图
项目背景 使用 uniapp + vue2 开发的国外类地图 APP，原本是打算使用 uniapp 打安卓包的方式，最后由于种种原因变成在安卓壳子里使用 webview 的套壳 APP，所以最终效果其实是跟 h5 的一致。 两种路子都试了，中间踩了非常非常非常多的坑！但是不管怎样，最终能上线成功，所 ......
H5跳回微信小程序页面
目录官方文档JSSDKuniapp H5 跳转微信小程序页面H5微信小程序 官方文档 https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html JSSDK https://res.wx.qq.com/open/j ......
h5页面代码已修改未生效
h5页面代码修改之后，用微信自带浏览器打开，出现未在开发环境出现的样式问题，且初次打开链接的手机没问题，用手机浏览器打开也没问题 原因： 微信浏览器缓存 解决方案： 一：打开微信，“我” “设置” “通用” “存储空间” “缓存” 等待计算完成后 “前往清理” 二：取消全选，不然很多东西会清空， 如 ......
原生安卓嵌入vue打包的H5，在H5中调用原生摄像头扫码，且扫描回调返回数据
<div class="code"> <img class="scan" src="../assets/images/scan.png" alt="" @click.stop="openQrcode('getScanData')" /> <input class="input" type="numb ......
原生IOS嵌入vue打包的H5，在H5中调用原生摄像头扫码，且扫描回调返回数据
<div class="code"> <img class="scan" src="../assets/images/scan.png" alt="" @click.stop="openQrcode('camera')" /> <input class="input" type="number" p ......
h5和css3有什么新特性
Laravel是一个流行的PHP框架，它具有出色的可测试性，可以帮助开发人员在更短的时间内编写可靠的代码。但是，即使使用了这个框架，也可能会出现测试覆盖率较低的情况。测试覆盖率是指代码中已由测试案例覆盖的部分比例。测试覆盖率越高，代码质量越高。在本文中，我们将分享几种技巧，帮助您提高Laravel应 ......
鸿蒙，HarmonyOS与H5相关点
HarmonyOS（鸿蒙操作系统）与H5（HTML5）有以下相关点： 支持Web技术：HarmonyOS支持基于Web技术的应用开发，包括使用HTML、CSS和JavaScript构建的H5应用程序。你可以使用H5技术栈开发HarmonyOS应用，从而在HarmonyOS设备上提供丰富的Web应用体 ......
uniapp中实现H5录音和上传、实时语音识别（兼容App小程序）和波形可视化
目录Recorder-UniCore插件特性集成到项目中调用录音上传录音ASR语音识别 在uniapp中使用Recorder-UniCore插件可以实现跨平台录音功能，uniapp自带的recorderManager接口不支持H5、录音格式和实时回调onFrameRecorded兼容性不好，用Rec ......
记录--H5 视频兼容性处理总结
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 概述 最近在负责公司官网的开发，在 H5 播放视频时，遇到很多兼容问题，所以总结下在 H5 播放时，遇到的兼容性问题，并封装一个 Video 的组件，便于在 H5 使用。 测试 先来测试一下在不同的浏览器，video 有什么兼容性的问题， ......
前端H5之CSS动画效果
支持效果如下： 进入 淡入：fadeIn 翻转进入：flipInY 中心弹入：bounceIn 中心放大：zoomIn 翻转进入：rollIn 光速进入：lightSpeedIn 移入，从左向右：fadeInLeft 移入，从上向下：fadeInDown 移入，从右向左：fadeInRight 移入 ......
h5ai--目录下载网站部署
1.说明 容器化部署，在docker hub上找h5ai的镜像，本文使用的是awesometic/h5ai的镜像进行部署 参考：https://hub.docker.com/r/awesometic/h5ai 2.部署 2.1 创建文件下载目录 mkdir -p /data/h5ai/_h5ai/p ......
vue3实现H5网页录音并上传（mp3、wav）兼容Android、iOS和PC端
使用 Recorder插件 可以在HTML5网页中进行录音，录音完成后得到blob文件对象，然后将blob上传到服务器；项目使用的vue3.0版本（这个插件同时支持vue2.0、也支持uniapp，很强！！），录音过程中会显示可视化波形，同时能够做到兼容PC端、Android、和iOS，一次编码 到 ......
H5APP请求部分js脚本出现502情况问题排查
1. 问题现象 公司客户APP内网部署，集成到公司客户办公APP，如果想要外网访问APP，需要通过指定的地址，估计是反向代理，具体的我不是很清楚。 昨天突然出现无法进入APP的问题，经过排查发现是部分js文件请求失败，报502错误 2. 排查思路 首先排查服务器与网站是否正常，远程发现网站运行正常， ......
vue实现h5扫码
插件 html5-qrcode npm 地址 html5-qrcode 是一个基于 JavaScript 轻量级和跨平台的扫码插件。允许用户使用摄像头扫描二维码，并且解析为文本或者 url。 支持扫描不同类型的二维码和条形码 支持不同的平台，Android、IOS、Windows、MacOs 或者 ......
记录H5中使用手机端摄像头拍照存储Base64格式图片
前面把openssl配置好了，现在在手机端就可以输入https://ip:port访问我的应用客户端了，今天在测试的过程中发现一些问题。 问题一：手机端点开后发现是前置摄像头。 需要加个video的配置项，facingMode:{exact:"environment"} 这个加了之后，在pc端打开摄 ......
H5中为什么要有websocket
在线网络游戏，是最重要的游戏形式， 通过互联网，玩家可以一起联网对战，能带来很多的乐趣。 H5微信小游戏，抖音小游戏怎么样做联网对战和传统的有什么不一样的？ 首先我们来看传统的联网，我们直接用TCP socket, 而H5的标准里面，我们用的是websocket，今天我们来说一说websocket ......
PC网站或H5网站接入客服系统
网页链接接入 PC网站或H5网站可以通过多种方式接入客服系统，直接访问或跳转聊天链接，是最简单的一种方式 获取聊天链接 前往【部署】【团队设置】【网站接入】可以找到聊天链接，直接把该链接放入自己网站的任何位置，就可以点击直接聊天了。 下面还有一个根据该链接生成的二维码，可以直接截图二维码，发布到网站 ......
H5小游戏是不是风口
随着移动互联网的发展，出现了几个超级App, 如微信，陌陌， QQ，抖音，今日头条等。 这些超级APP 每天都有几亿的活跃用户，用户玩手机的都集中在这些超级APP上。 对于超级APP而言，他们有流量，需要内容，留住用户，需要内容将流量变现。 游戏是互联网最直接的变现模式，广告 + 道具付费。 传统的 ......
react+antd-mobile+vite移动端H5前端项目
React+antd-mobile+vite ($\color{red} {注意：} $)待解决问题 （1）高版本路由第一次切换tab跳路由会出现闪烁,路由切换会延迟导致tab无法触发active(预计和缓存组件不更新路由参数有关) （2）使用ReactDOM.createRoot实例化项目，在结合 ......
vue3+vant+vite移动端H5前端项目
vue3+vant4 项目地址 vue项目演示 react项目演示 react项目代码:react项目代码 环境版本 nuc 16.10.9 (ncu -u) nvm 1.1.11 node 20.0.0 npm 9.6.4 项目重要知识点 1. 采用 vue3 + vite + pinia 2.可 ......
商智C店H5性能优化实战
前言 商智C店，是依托移动低码能力搭建的一个应用，产品面向B端商家。随着应用体量持续增大，考虑产品定位及用户体验，我们针对性能较差页面做了一次优化，并取得了不错的效果，用户体验值（UEI）从一般提升到良好。本文详细记录了优化思路及过程，期望给正在或打算做用户体验提升的小伙伴提供一些参考。 一、性能优 ......
H5前端特殊艺术字体文件太大，可通过font-spider压缩
原理: 1.爬行本地 html 文档，分析所有 css 语句 2.记录@font-face语句声明的字体，并且记录使用该字体的 css 选择器 3.通过 css 选择器的规则查找当前 html 文档的节点，记录节点上的文本 4.找到字体文件并删除没被使用的字符 5.编码成跨平台使用的字体格式 简而言 ......
import { EventEmitter } from 'eventemitter3'; class H5SSE extends EventEmitter 代码解析
import { EventEmitter } from 'eventemitter3'; class H5SSE extends EventEmitter 代码解析 通过eventemitter3源码学习Javascript设计模式：发布-订阅（观察者模式） 发布-订阅模式又叫观察者模式，它定义对 ......
h5 video 暂停后切前后台导致视频提前
背景 使用 h5 video 开发的页面，对于需要视频定帧的场景，会通过调用 video.pause() 来使视频暂停，然而，当切到后台再重新切回前台，video 会重新出发 timeupdate 事件，并将当前的时间提前 1-2s 左右，从而导致视频定的帧改变。 分析 该问题可能是浏览器内部原因， ......
Uniapp判断运行环境，小程序-公众号-H5-APP
直接上代码 // #ifdef H5 var app_type = this.isWeiXin() ? 'wechat' : 'h5'; var app_type_name = this.isWeiXin() ? '微信公众号' : 'H5'; // #endif // #ifdef MP-WEIX ......
vue3--h5页面中判断在支付宝环境还是微信环境
支付宝： navigator.userAgent.indexOf('AliApp') > -1 环境变量： navigator.userAgent "Mozilla/5.0......AlipayDefined(nt:WIFI,ws:320|504|2.0) AliApp(AP/9.6.0.0000 ......
H5网页流媒体播放器EasyPlayer播放H.265录像时，无法倍速回放是什么原因？
流媒体播放器EasyPlayer是我们流媒体组件系列中关注度较高的产品，经过多年的发展和迭代，目前已经有多个应用版本，包括RTSP版、RTMP版、Pro版，以及js版，其中js版本作为网页播放器，受到了用户的广泛使用。在功能上，EasyPlayer支持直播、点播、录像、快照截图、MP4播放、多屏播放 ......
uniapp的editor组件在H5上无法点击的问题处理
uniapp开发的移动端H5和小程序，富文本框输入框使用了editor的组件在小程序端是运行正常的，但是在H5端出现了无法点击的情况，是好时坏 原因是H5端依赖远端的quill.min.js组件，该远端的组件偶尔会出现访问的情况文档上写的比较清楚，但是具体怎么写没有写的写的很具体 经常尝试，搞定。具 ......
webview和h5通信
有个需求是web-view嵌入h5页面，这时需要知道h5的路有变化，以下是一个简单的实现 1.vue页面使用 wx.miniProgram.postMessage发送消息 beforeRouteLeave(to,from,next){ wx.miniProgram.postMessage({ dat ......