如何访问iOS11主屏幕Web应用程序上的相机？ [英] How to access camera on iOS11 home screen web app?

问题描述

摘要

我们无法使用WebRTC或文件输入从iOS11（公共版本）主屏幕Web应用程序访问相机，详情如下。我们的用户如何继续访问相机？

我们通过https服务网页应用页面。

更新，4月

iOS 11.3的公开发布似乎解决了问题，文件输入摄像头访问再次正常工作！

3月更新

正如人们在这里所说的那样，Apple文档提醒网站应用程序相机功能正在与服务人员一起返回到11.3。这很好，但我们还不确定，如果我们希望大家再次重新安装，直到我们能够彻底测试11.3GM。

解决方案，11月

我们失去了希望Apple希望解决这个问题并向前迈进。修改了我们的网络应用程序以删除iOS添加到主屏幕功能，并要求受影响的用户删除任何以前的主屏幕图标。

更新， 12月6日

iOS 11.2和iOS 11.1.2无法修复。

解决方法，9月21日

可以询问网络应用程序的现有客户

• 不升级到iOS11 - 祝你好运:)


• 在iOS相机中拍照，然后在网络应用中选择它们


• 等待下一个ios beta


• 重新安装为Safari浏览器（在我们移除ATHS逻辑之后）


• 切换至Android

文件输入



我们目前的产品代码使用的文件输入在iOS 10和更旧的版本上运行良好。在iOS11上，它可用作Safari选项卡，但不能用于主屏幕应用程序。

 < meta name = apple-mobile-web-app-capablecontent =yes> 
 ... 
< input type =fileaccept =image / *> 
  





WebRTC





iOS 11的Safari 11优惠 WebRTC媒体捕捉，这非常棒。





我们可以使用navigator.mediaDevices.getUserMedia通过此处链接的示例代码。



当我们将页面添加到iPad或iPhone主屏幕时， navigator.mediaDevices 变为未定义且不可用。

 < meta name =apple-mobile-web-app-capablecontent =yes> 
 ... 
 //由于某些原因，mac上的safari可以调试ios safari页面，但不能调试ios主屏幕web应用程序
 var d ='typeof navigator：'+ typeof navigator; // object 
 d + ='typeof navigator.mediaDevices：'+ typeof navigator.mediaDevices; // undefined 
 //尝试替换
 d + ='typeof navigator.getUserMedia：'+ typeof navigator.getUserMedia; // undefined 
 d + ='typeof navigator.webkitGetUserMedia：'+ typeof navigator.webkitGetUserMedia; // undefined 
 status1.innerHTML = d; 
  




解决方案

我们遇到了类似的问题。到目前为止，我们能够做的唯一解决方法是删除它的元标记为apple-mobile-web-app-capable，并允许用户在Safari中打开它，一切似乎都能正常工作。




Summary

We cannot access camera from an iOS11 (public release) home screen web app using either WebRTC or the file input, details below. How can our users continue to access the camera please?

We are serving the web app page over https.

Update, April

The public release of iOS 11.3 seems to have fixed the issue and file input camera access is working again!

Update, March

As people here have said the Apple docs advise web app camera function is returning in 11.3 along with service workers. This is good but we are not sure yet if we want to everyone to to reinstall again until we can thoroughly test on 11.3GM.

Solution, November

We lost hope Apple want to fix this and moved forward. Modified our web app to remove the iOS "Add to home screen" function and asked affected users to remove any previous home screen icon.

Update, 6 December

iOS 11.2 and iOS 11.1.2 don't fix.

Workarounds, 21 September

Seems we could ask existing customers of the web app

• not upgrade to iOS11 - good luck with that :)
• take photos in iOS camera and then select them back in the web app
• wait for next ios beta
• reinstall as a Safari in-browser page (after we remove ATHS logic)
• switch to Android

File Input

Our current production code uses a file input which has worked fine for years with iOS 10 and older. On iOS11 it works as a Safari tab but not from the home screen app. In the latter case the camera is opened and only a black screen is shown, hence it is unusable.

   <meta name="apple-mobile-web-app-capable" content="yes">
   ...
   <input type="file" accept="image/*">

WebRTC

Safari 11 on iOS11 offers WebRTC media capture which is great.

We can capture a camera image to canvas on a normal web page on desktop and mobile using navigator.mediaDevices.getUserMedia per the sample code linked here.

When we add the page to iPad or iPhone home screen, navigator.mediaDevices becomes undefined and unusable.

    <meta name="apple-mobile-web-app-capable" content="yes">
    ...
    // for some reason safari on mac can debug ios safari page but not ios home screen web apps 
    var d = 'typeof navigator : ' + typeof navigator; //object
    d += 'typeof navigator.mediaDevices : ' + typeof navigator.mediaDevices; // undefined
    // try alternates
    d += 'typeof navigator.getUserMedia  : ' + typeof navigator.getUserMedia; // undefined
    d += 'typeof navigator.webkitGetUserMedia  : ' + typeof navigator.webkitGetUserMedia; // undefined
    status1.innerHTML = d;

解决方案

We have quite similar problem. So far the only workaround we were able to do is to remove the meta tag for it to be "apple-mobile-web-app-capable" and let users to open it in Safari, where everything seems to work normally.

这篇关于如何访问iOS11主屏幕Web应用程序上的相机？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！