Cordova Android端mediaDevices.getUserMedia流立即暂停问题求助

针对你遇到的Cordova安卓编译后摄像头流初始显示后暂停、触摸时恢复的问题，给出以下解决方向：

1. 适配安卓WebView自动播放限制 #

安卓WebView默认要求视频播放必须由用户交互触发，即使代码中通过onloadedmetadata调用play()也可能不被识别。可以添加用户触摸事件监听，在首次触摸时主动触发播放：

// 在getUserMedia的then回调中添加
let hasInitiatedPlay = false;
document.addEventListener('touchstart', function() {
  if (!hasInitiatedPlay && localMediaStream) {
    video.play().catch(err => console.log('播放失败:', err));
    hasInitiatedPlay = true;
  }
}, { once: true }); // 使用once确保只触发一次

2. 调整Cordova配置项 #

在config.xml中添加以下配置，放宽WebView的媒体播放限制：

<!-- 允许内联媒体播放 -->
<preference name="AllowInlineMediaPlayback" value="true" />
<!-- 取消媒体播放必须用户交互的限制 -->
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<!-- 确保摄像头权限正确配置 -->
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.front" />

3. 修改视频标签属性 #

给video标签添加playsinline、autoplay、muted属性，帮助WebView正确识别播放需求：

<video id="video" playsinline autoplay muted></video>

muted属性是安卓WebView允许自动播放的常见前提，因为默认禁止自动播放带音频的视频。

4. 移除facingMode的exact约束 #

部分安卓设备的WebView不支持facingMode的exact参数，可能导致流不稳定。修改约束配置：

const constraints = {
  audio: false,
  video: {
    width: {min: 800, ideal: 1024, max: 1280},
    height: {min: 600},
    facingMode: 'user' // 替换原有的{exact: 'user'}
  }
}

5. 监听并恢复意外暂停 #

添加视频暂停事件监听，当检测到非用户主动触发的暂停时自动恢复播放：

// 在getUserMedia的then回调中添加
video.addEventListener('pause', function() {
  // 排除用户主动暂停的情况（可根据业务逻辑调整判断条件）
  if (localMediaStream && !video._userPaused) {
    video.play().catch(err => console.log('恢复播放失败:', err));
  }
});

// 如果有用户主动暂停的按钮，添加标记
document.getElementById('pauseBtn')?.addEventListener('click', function() {
  video._userPaused = !video._userPaused;
  if (video._userPaused) {
    video.pause();
  } else {
    video.play();
  }
});

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