小程序video全屏横竖屏错乱时，pageorientation不生效是因平台限制，唯一可行方案是监听@fullscreenchange事件并调用平台专属api（如微信的wx.setscreenorientation），且需满足配置supportedscreenorientation及用户手势触发前提。
小程序 video 全屏后横竖屏错乱，pageOrientation 不生效怎么办？
小程序平台（微信、QQ、支付宝等）的 video 组件全屏行为由宿主环境原生控制，pages.json 中的 pageOrientation 仅影响页面初始方向，对 video 全屏后的方向无约束力。这不是配置漏了，而是平台限制——你无法靠声明式配置接管全屏时的方向。
- 小程序不支持
plus.screen.lockOrientation（App 独占 API） -
uni.setScreenOrientation在小程序中返回fail not supported或静默忽略 -
manifest.json的screenOrientation字段对小程序完全无效
真机上唯一可控入口，是监听 @fullscreenchange 事件并配合平台特定 API。
微信小程序：用 wx.setScreenOrientation 动态锁方向
微信基础库 2.25.0+ 支持该 API，但必须满足两个前提：
- 当前页面已声明支持对应方向（在
app.json或page.json中配置"supportedScreenOrientation"） - 调用发生在用户手势触发的上下文中（如
button点击、video全屏按钮点击），不能在自动逻辑里调用
<video src="%7B%7BvideoUrl%7D%7D" controls></video>
在 onFullscreenChange 中判断并调用：
onFullscreenChange(e) {
if (e.detail.fullscreen) {
// 进入全屏 → 强制横屏
wx.setScreenOrientation({ orientation: 'landscape' })
} else {
// 退出全屏 → 恢复竖屏
wx.setScreenOrientation({ orientation: 'portrait' })
}
}
- 注意：微信要求
app.json中必须包含"supportedScreenOrientation": ["portrait", "landscape"]，否则 API 直接报错 - iOS 微信下部分机型（如 iOS 17+）可能仍会短暂闪动或延迟生效，这是微信 WebView 层级限制，无法绕过
其他小程序平台（QQ、支付宝、字节）如何处理？
各平台 API 不统一，且兼容性差异大：
QQ 小程序：支持
qq.setScreenOrientation，但需在qq.json中声明supportedScreenOrientation支付宝小程序：不提供屏幕方向锁定 API，只能靠 CSS 媒体查询 +
@media (orientation: landscape)做样式适配，无法阻止系统旋转字节小程序（抖音）：暂无公开方向控制 API，全屏行为完全由客户端决定，建议隐藏原生 controls，用自定义按钮 +
videoContext.requestFullScreen()触发，并在fullscreenchange后尝试tt.setScreenOrientation（仅部分版本支持）所有平台都不支持在
onLoad或onShow中提前锁定方向——必须由用户显式操作触发若目标平台不支持方向 API，就放弃“强制”，转为响应式布局适配：用
vh/vw替代rpx，避免固定宽高比导致拉伸或留白
为什么 CSS transform: rotate(90deg) 是危险操作？
有人尝试用 CSS 旋转整个页面容器来模拟横屏，这会导致：
触摸坐标系翻转：点击位置与实际 DOM 坐标不一致，
touchstart的clientX/clientY变成错位值canvas、map、cover-view等原生组件渲染异常或消失键盘弹出错乱（尤其在输入框获取焦点后）
微信开发者工具能跑通，真机几乎必现交互失灵
真正需要横屏体验的视频页，应单独设为一个「全屏专用页」，用
navigateTo跳转过去，并在该页生命周期内专注做横屏适配，而非在原页面硬撑
微信和 QQ 小程序的方向控制能力有限，支付宝和字节更弱；所谓“自适应”，本质是接受平台规则，而不是对抗它。最稳妥的做法，是把全屏逻辑交给平台原生控件，只用 JS 做状态同步和样式微调——别试图用 CSS 或 JS 抢原生播放器的控制权。
