React Native WebView在iOS端无法切换屏幕方向的问题求助

1. 配置Expo项目的屏幕旋转权限 #

Expo GO默认启用多方向支持，但独立打包的iOS应用需要手动声明允许的屏幕方向。在项目的app.json文件中，找到expo.ios.infoPlist节点，添加以下配置：

"UISupportedInterfaceOrientations": [
  "UIInterfaceOrientationPortrait",
  "UIInterfaceOrientationLandscapeLeft",
  "UIInterfaceOrientationLandscapeRight"
],
"UISupportedInterfaceOrientations~ipad": [
  "UIInterfaceOrientationPortrait",
  "UIInterfaceOrientationPortraitUpsideDown",
  "UIInterfaceOrientationLandscapeLeft",
  "UIInterfaceOrientationLandscapeRight"
]

这段配置会让iOS应用本身支持横竖屏切换，为WebView内的页面触发旋转提供基础。

2. 调整WebView的媒体相关属性 #

如果Web页面是通过视频等媒体内容触发旋转，需要给WebView添加对应属性，允许全屏播放和旋转：

<WebView
  source={{ uri: WEBSITE }}
  allowsFullscreenVideo={true}
  // 若需自动播放触发旋转的媒体，可添加下面一行（可选）
  mediaPlaybackRequiresUserAction={false}
/>

其中allowsFullscreenVideo是核心配置，它允许WebView内的内容进入全屏模式，进而触发系统的屏幕旋转逻辑。

3. 原生项目验证（已eject到iOS原生项目时） #

如果已经将Expo项目eject为原生iOS项目，还需要在Xcode中确认项目的方向设置：

• 打开Xcode并选中项目target
• 切换到General标签，找到Deployment Info下的Device Orientation
• 勾选需要支持的方向（至少包含Portrait、Landscape Left、Landscape Right）

Expo GO内置了这些默认配置，所以调试时旋转功能正常，但独立打包时必须显式声明这些权限和设置，否则iOS会默认锁定竖屏，导致WebView内的旋转请求无法生效。

内容的提问来源于stack exchange，提问作者Mischa Firges