web-dev-qa-db-fra.com

Comment accéder à la caméra sur l'application Web pour écran d'accueil iOS11?

Sommaire

Nous ne pouvons pas accéder à la caméra à partir d'une application Web d'écran d'accueil iOS11 (version publique) à l'aide de WebRTC ou de l'entrée de fichier, comme indiqué ci-dessous. Comment nos utilisateurs peuvent-ils continuer à accéder à la caméra, s'il vous plaît?

Nous servons la page des applications Web via https.

Mise à jour, avril

Update, March

Comme les gens ici l'ont dit, la fonction Apple informe la fonction d'application Web de la caméra pour applications Web est de retour dans 11.3 avec les techniciens de maintenance. C'est bien, mais nous ne savons pas encore si nous voulons que tout le monde réinstalle jusqu'à ce que nous puissions effectuer des tests approfondis sur 11.3GM.

Solution, novembre

Mise à jour du 6 décembre

iOS 11.2 et iOS 11.1.2 ne résolvent pas.

Solutions de contournement, 21 septembre

On pourrait demander aux clients existants de l'application Web

  • pas de mise à niveau vers iOS11 - bonne chance avec ça :)
  • prendre des photos dans l'appareil photo iOS, puis les sélectionner à nouveau dans l'application Web
  • attendre la prochaine version bêta d'ios
  • réinstaller en tant que page Safari dans le navigateur (après suppression de la logique ATHS)
  • passer à Android

Entrée de fichier

Notre code de production actuel utilise une entrée de fichier qui a bien fonctionné pendant des années avec iOS 10 et les versions antérieures. Sur iOS11, il fonctionne comme un onglet Safari mais pas à partir de l'application de l'écran d'accueil. Dans ce dernier cas, la caméra est ouverte et seul un écran noir est affiché, il est donc inutilisable.

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

WebRTC

Safari 11 sur iOS11 offre capture de média WebRTC , ce qui est formidable.

Nous pouvons capturer une image de caméra sur un canevas sur une page Web normale sur un ordinateur de bureau ou sur un mobile en utilisant navigator.mediaDevices.getUserMedia per le code exemple lié ici .

Lorsque nous ajoutons la page à l'écran d'accueil de l'iPad ou de l'iPhone, navigator.mediaDevices devient undefined et devient inutilisable.

    <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;
javascripthtml5camerawebrtcios11
111
ajayel

Nous avons un problème assez similaire. Jusqu'à présent, la seule solution de contournement que nous ayons pu faire est de supprimer la balise méta pour qu'elle soit "compatible Apple-mobile-web-app" et aux utilisateurs de l'ouvrir dans Safari, où tout semble fonctionner normalement.

21
Tomas Vitasek

Mise à jour : Certains journaux de modifications et publications antérieures m'avaient amené à croire que Web Apps utilisait un manifest.json au lieu de Apple-mobile-web-app-capable avoir accès à une implémentation WebRTC appropriée, ce n’est malheureusement pas le cas, comme d’autres l’ont souligné ici, et les tests ont confirmé. Visage triste. Désolé pour les inconvénients causés par cela et espérons qu'un jour de chance dans une galaxie très éloignée Apple nous donnera enfin l'accès à l'appareil photo dans des vues optimisées par WebKit (non-Safari) ...

Oui, comme d'autres l'ont déjà mentionné, getUserMedia n'est disponible que directement dans Safari, mais ni dans UIWebView ni dans WKWebView. Par conséquent, vos seuls choix sont les suivants:

  • supprimer <meta name="Apple-mobile-web-app-capable" content="yes"> pour que votre application s'exécute dans un onglet Safari normal, où getuserMedia est accessible
  • en utilisant un framework tel qu'Apache Cordova qui vous permet d'accéder à la caméra d'un périphérique de différentes manières.

En espérant que Apple supprime cette restriction WebRTC plutôt tôt que tard ...

La source:
Pour les développeurs utilisant WebKit dans leurs applications, RTCPeerConnection et RTCDataChannel sont disponibles dans n'importe quel affichage Web, mais l'accès à la caméra et au microphone est actuellement limité à Safari.

21
StateOfTheArtJonas

Bonnes nouvelles! La caméra semble enfin être accessible depuis une application Web d'écran d'accueil dans la première version bêta d'iOS 11.3.

J'ai fait un repo avec quelques fichiers, ce qui montre que cela fonctionne:

https://github.com/joachimboggild/uploadtest

Étapes pour tester:

  1. Servir ces fichiers à partir d'un site Web accessible depuis votre téléphone
  2. Ouvrez le fichier index.html dans iOS Safari
  3. Ajouter à l'écran d'accueil
  4. Ouvrez l'application depuis l'écran d'accueil. Maintenant, la page Web est ouverte en plein écran, sans navigation ui.
  5. Appuyez sur le bouton Fichier pour sélectionner une image de la caméra.

Maintenant, la caméra devrait fonctionner normalement et ne pas être un écran noir. Cela démontre que la fonctionnalité fonctionne à nouveau.

Je dois ajouter que j'utilise un champ simple, pas getUserMedia ou quelque chose de ce genre. Je ne sais pas si ça marche.

14
Joachim Bøggild

Apparemment, il est résolu dans "ios 13 beta 1": https://Twitter.com/ChromiumDev/status/1136541745158791168?s=09

2
jvitor83

Cela semble fonctionner à nouveau dans iOS 11.4 si vous utilisez un champ de saisie de fichier.

1
aalcutt