javascript - IOS相机离开pwa后返回黑屏

Question

我正在使用 html 文件输入来打开相机并为我的 PWA 拍照。

<input type="file" accept="image/*" capture="camera" name="photo" id="photo-input-js" data-project-id="<?php echo $projectId ?>">

// this element triggers the input 
<li class="menu-item <?php echo $current_page == 'camera' ? 'is-active' : '' ?>" id="camera-tab">
   <a href="<?php echo site_url("photos/openCamera/". $projectId) ?>" id="open-camera-js">
            <div class="icon icon-camera"></div>
    <span class="d-none d-md-block ">Camera</span>
   </a>
</li>

Javascript:

// open camera
$(document).on('click', '#open-camera-js', function(e) {
  e.preventDefault();

  $(".menu-item").removeClass('is-active');
  $("#camera-tab").addClass('is-active');

  // check support for geolocation/ask for permissions
  if (!navigator.geolocation) {
      throw new Error('Unsupproted device');
   }

  // open the file input
  $("#photo-input-js").click();
});

// save image
$(document).on('change', '#photo-input-js', function(e) {
     e.preventDefault();
     let photo = $(this).prop('files')[0] ? $(this).prop('files')[0] : false;
     if (photo) {
        // handle captured photo
     }

在我将 pwa 下载到我的主屏幕后，相机可以正常工作，直到我离开应用程序并返回，而无需从打开的应用程序中刷出应用程序。

如果按下主页按钮并离开应用程序，然后返回，我会得到黑屏，而不是像这样的摄像头画面:



之后，我必须离开应用程序并从打开的应用程序中刷出我的 pwa，然后再次打开应用程序以使相机再次正常工作。

相机在我的 pwa 的 android 版本上工作正常

Answer 1

这是由 iOS 13.2 和 13.3 中的错误引起的。
You can find the bug report here
它已在 iOS 13.4 及更高版本中得到解决。我可以亲自确认我可以在 13.3 中重现此问题，但在更新到 13.5.1 后无法重现