web-dev-qa-db-fra.com

Ajouter une application Web progressive Play Store / App Store

Notre PWA est complètement construit en utilisant le nouvel angulaire. Nous avons mis en œuvre toutes les optimisations telles que le tremblement de l’arbre, l’aplatissement, l’AOT, le prestataire de services, etc. Cela fonctionne très bien et se comporte comme l’application mobile. Si les utilisateurs l'ajoutent à leur écran d'accueil, il est difficile de faire la différence.

Nous avons quelques grosses limitations avec PWA:

  • toutes les notifications (cruciales) de notre entreprise doivent être envoyées par SMS. Ceci a évidemment un énorme avantage en termes de coûts. Nous nous sommes penchés sur l’utilisation de la notification push "Web" sur le Android bien que nous ayons également de nombreux utilisateurs iOS.
  • Nous devons avoir la possibilité de "suivre" l'emplacement géographique en "arrière-plan" et que l'API de géolocalisation HTML5 ne le coupe pas.
  • actuellement, chaque fois que l'utilisateur accède à l'URL (envoyer comme SMS rappel)), il a tendance à ouvrir un nouvel onglet dans le navigateur (cela dépend du téléphone). Même si l'utilisateur ajoute réellement l'application à son écran d'accueil Cela augmente évidemment le temps de chargement et crée trop d'onglets.Nous préférerions mettre l'application au premier plan et naviguer vers un itinéraire particulier (ou utiliser des notifications Push).
  • certains de nos utilisateurs actifs peuvent facilement recevoir 10 notifications par jour et ils ont besoin d'un moyen simple de naviguer dans l'application.

Nous avons examiné NativeScript et Ionic. Les deux offrent la possibilité de développer Angular angulaire, mais ils semblent tous "conçus" pour écrire des applications spécialement conçues pour les téléphones mobiles (... ou en partant de zéro avec elles).

J'ai peut-être manqué quelque chose, mais quelle serait la meilleure pratique lorsque nous voulons simplement mettre un wrapper autour de notre application Web progressive afin de pouvoir l'installer en tant qu'application "hybride". L'application navigue simplement vers notre URL publique, elle prend en charge les travailleurs du service et nous permet également d'accéder à certaines fonctions natives.

Je comprends que je manque peut-être le but de PWA ici, mais écrire une autre application "native" n’est pas vraiment une option pour nous.

Quel serait le meilleur moyen d'exposer notre Web progressif en tant qu'application dans le Google Play Store ou Apple App Store?

26
Adam Kundrat

PWABuilder.com est un excellent endroit pour commencer à utiliser une application Web hébergée. Cet outil peut être utilisé en ligne ou à partir de la CLI. Une partie de celui-ci crée un agent de service et d'autres éléments, mais elle crée également les projets Cordova pour Android et iOS.

J'ai utilisé PWABuilder uniquement pour créer un point de départ. Finalement, en combinant les projets iOS et Android générés en un seul projet pour iOS, Android et Windows. Parce que c'est Cordova, vous pouvez également utiliser des plugins.

9
Sorskoot

Mise à jour 2019

Maintenant que Google est ouvert aux applications PWA sur Google Playstore, vous pouvez utiliser des outils tels que PWA2APK afin de convertir les PWA existants en applications compatibles avec Google Playstore. Le Android APK (PWApk) généré par l'outil peut être téléchargé sur Playstore.

Cet outil a été tweeté par Alex Russel, l'un des inventeurs de PWA.

https://Twitter.com/slightlylate/status/109368179129718784

5
Felix josemon

vous voudrez peut-être rechercher des liens profonds.

https://developers.google.com/web/updates/2017/02/improved-add-to-home-screen#Android_intent_filters

L'écran Nouveau et amélioré Ajouter à l'accueil

Paul Kinlan Par Paul Kinlan Paul est un défenseur du développement Chrome a introduit pour la première fois les bannières "Ajouter à l'écran d'accueil" dans Chrome 42. Ce fut un grand pas pour Web, car il offrait aux utilisateurs la possibilité de conserver facilement un site favori sur leur écran d'accueil, un peu comme les applications natives. Des développeurs comme Alibaba nous ont appris que les utilisateurs réagissent 4 fois plus souvent en ajoutant leur site à l'écran d'accueil. Nous avons également constaté que le fait de régler l'heuristique d'ajout à l'écran d'accueil sur Demander rapidement produit 48% d'installations supplémentaires.

Nous sommes heureux de dire que l’équipe a travaillé sur une expérience d’ajout à l’écran d’accueil améliorée qui permet aux applications Web d’être des citoyens de premier ordre pour Android. Au lieu d'être simplement une icône de raccourci, les applications Web seront désormais intégrées à Android. Cela signifie que les utilisateurs qui ajoutent un PWA à leur écran d'accueil pourront le localiser n'importe où, s'ils voient d'autres applications (par exemple dans le tiroir d'applications ou en recherchant des applications), et ouvrir le site à partir d'intentions. Nous voyons cela comme la première étape parmi un certain nombre d'améliorations à venir et avons l'intention d'en faire l'expérience par défaut pour l'ajout à l'écran d'accueil dans les mois à venir.

L’expérience améliorée d’ajout à l’écran d’accueil est déjà disponible dans Chrome Canary et sera déployée sur Chrome 57 bêta au cours des prochaines semaines.

Remarque: il a été envoyé à tous les utilisateurs du canal stable de Chrome à compter de Chrome 59. Pour tester votre site, visitez votre PWA. Vous pouvez lancer l’installation à partir du menu à trois points> "Ajouter à la page principale". écran "ou via la bannière d’ajout à l’écran d’accueil.

Cette nouvelle expérience représente une amélioration considérable par rapport à la version initiale de l’ajout à l’écran d’accueil, mais il existe quelques différences entre ces applications Web progressives installées et les Android Apps.

Mise à jour de l'icône et du nom de votre application Vous avez maintenant la possibilité de mettre à jour l'icône et le nom de votre Progressive Web App et de les refléter pour l'utilisateur. Si vous changez d’icône ou de nom dans le manifeste, l’icône de l’écran d’accueil sera mis à jour une fois que l’utilisateur aura ouvert le site.

Filtres d'intention Android Lorsqu'une application Web progressive est installée via cette nouvelle expérience améliorée d'ajout à l'écran d'accueil, elle est enregistrée avec le système pour devenir une cible pour l'espace URL de son domaine. Cela signifie que lorsqu'un utilisateur cliquera sur un lien contenu dans l'étendue de votre Progressive Web App, celle-ci s'ouvrira au lieu de Chrome s'ouvrira avec votre PWA en cours d'exécution.

Lorsque vous installez une application Web progressive, nous examinons votre manifeste d’application Web et d’autres méta-données et créons un APK (package Android) installé sur le périphérique de l’utilisateur, ce qui peut prendre un court instant lors de la première installation de l’utilisateur. votre application web.

Remarque: chaque fois que le manifeste d'application Web change, nous devons générer un nouveau fichier APK. Il est donc déconseillé de disposer de manifestes fréquemment mis à jour. Il est particulièrement important de vous assurer que vous n'utilisez pas d'identifiants spécifiques à l'utilisateur dans le manifeste (tels qu'un start_url personnalisé par utilisateur), car ils génèrent un fichier APK unique, ce qui signifie que votre temps d'installation sera beaucoup plus long que prévu. Dans cet APK, nous définissons un Android Filtre d'intention qui définit quand votre application Web doit être ouverte. Par exemple, pour ouvrir le https://airhorner.com app à tout moment. ce lien est cliqué, Chrome créerait ce qui suit.

<intent-filter>
  <action Android:name="Android.intent.action.VIEW" />
  <category Android:name="Android.intent.category.DEFAULT" />
  <category Android:name="Android.intent.category.BROWSABLE" />
  <data
    Android:scheme="https"
    Android:Host="airhorner.com"
    Android:pathPrefix="/" />
</intent-filter>

C'est incroyablement puissant, mais pas très flexible. Cela indique simplement qu’un lien sur lequel on clique ou intercepte dans Android pour l’ensemble du domaine de https://airhorner.com/ ouvre l’application.

Mais que faire si vous ne voulez pas que votre PWA s'ouvre pour tous les chemins de votre domaine? C’est là que la propriété manifeste de l’application Web Portée entre en jeu. La portée est un ....

2
robert king

Vous pouvez facilement emballer votre PWA en tant qu'application ionique/Cordova.

  1. Pas moyen de réaliser web Push sur iOS pour le moment. Utilisez Cordova.
  2. Le suivi en arrière-plan n'est pas possible. Envisagez une combinaison de notifications Push périodiques et de synchronisation en arrière-plan pour voir si elle vous aide.
  3. Sur Android tout ce que l'utilisateur doit faire est de cliquer sur toujours la première fois que le lien s'ouvre ne se souvient pas de la façon dont c'est sur ios.
  4. Les notifications push vous permettent de spécifier l'URL.

Vous pouvez lire cet article pour comprendre un peu plus sur la façon dont j'ai mélangé cordova avec PWA.

https://medium.com/awebdeveloper/pwa-is-future-of-mobile-how-to-tame-it-855dd42df0ec

0
aWebDeveloper