目前H5页面的解决方案是: 1、判断页面的高度是否是屏幕高度; 2、如果window.innerHeight是屏幕的高度,会动态设置 footerBar 的 bottom属性……
iPhone6微信小程序渲染H5页面高度偶现异常的问题如何解决?webview渲染H5页面的高度偶现异常(以下window.height 都是通过 window.innerHeight 属性获取的): iPhone6的屏幕高度是 667,正常情况下小程序渲染的H5页面 高度 是不包含小程序的navbar 和 statusBar的高度的,即 603, 此时底部footerBar是正常渲染的…… [图片] [图片] 但是异常的时候,小程序渲染的H5高度是 667,导致底部footerBar元素出现定位向下偏移了…… [图片] [图片] footerBar相关的样式如下: .footerBar { position: fixed; background: #fafafa; width: 100%; height: 98px; left: 0; right: 0; bottom: 0; padding: 12px 0; @supports ((height: constant(safe-area-inset-bottom)) or (height: env(safe-area-inset-bottom))) { height: calc(constant(safe-area-inset-bottom) + 86px); height: calc(env(safe-area-inset-bottom) + 86px); padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); } display: flex; align-items: center; justify-content: center; border-top: 0.5px solid #eee; transform: translateY(0) translateZ(0); z-index: 999; & > div { flex: 1; } } 通用布局: /* 禁止iOS弹性滚动 */ html, body, #root { width: 100vw; height: 100vh; overflow: hidden; background: #f7f7f7; } #root { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .container { /* position: absolute; top: 0; left: 0; */ width: 100vw; height: 100vh; overflow: auto; background: #f7f7f7; -webkit-overflow-scrolling: touch; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); font-family: PingFangSC, PingFangSC-Regular, sans-serif; }
2024-06-25https://www.v2ex.com/t/468565 这里说是根据referer来识别的,ios系统的Safari浏览器 打开微信回调页面会 丢失 referer 信息…… 也会导致这个问题
授权入口页所在域名:空微信第三方平台引入用户进入授权页时 方式一:授权注册页面扫码授权, 将授权链接生成二维码扫码后, 如图错误提示, 而 方式二:点击移动端链接快速授权 是可以正常授权的.请问是什么原因?, 文档中也没有任何说明!!!谢谢!!!![图片]
2020-12-04