Processus de déploiement OTA / blogs / fait

Le développement d’applications mobiles augmente rapidement, tout comme l’attente d’un soutien solide. «Mobile First» est le paradigme défini pour de nombreuses équipes de développement d’applications. Contrairement au déploiement Web, une version d’application doit passer par le processus de révision via App Store Connect et Google Play. Des versions mineures ou majeures suivent le même processus de revue de l’application, qui peut prendre 1 à 4 jours. Les correctifs à chaud ou les correctifs de sécurité critiques sont également liés par les restrictions du cycle d’examen. Cela peut entraîner des perturbations de service, des avis négatifs d’applications et de clients.

Disons que la dernière version d’une application est la version 1.2. Cependant, un bogue critique a été identifié dans la version 1.1. Les développeurs d’applications peuvent publier la version 1.3, mais le défi serait qu’il puisse prendre un certain temps pour publier la nouvelle version (sauf si un Le mécanisme de mise à jour forcé est implémenté pour l’application). Un autre défi potentiel serait le fait qu’il n’y a aucune garantie que l’utilisateur aurait des mises à jour automatique.

Heureusement, les mises à jour «Over the Air» arrivent à la rescousse dans de telles situations.

Le Over Til UNIR (OTA), le processus de déploiement pour les applications mobiles permet aux développeurs de pousser les mises à jour sans passer par le processus d’examen traditionnel. Le processus de mise à jour OTA permet une livraison plus rapide pour tout correctif ou correctif.

Bien que cela soit très excitant, il vient avec quelques limitations:

• Cette fonctionnalité n’est pas destinée à des mises à jour majeures ou à des lancements de fonctionnalités importants.
• OTA fonctionne principalement avec les bundlers JavaScript, de sorte que les modifications de fonctionnalité natives ne peuvent pas être déployées via le déploiement OTA.

React Native se compose de JavaScript et de code natif. Lorsque l’application est compilée, elle crée les JSBundles pour les applications Android et iOS ainsi que les versions natives. L’OTA s’appuie également sur les paquets JavaScript et, par conséquent, les applications natives réagissantes sont d’excellents candidats pour profiter de la technologie de mise à jour OTA.

L’une des applications de notre client a un processus de déploiement OTA implémenté à l’aide d’App Center. Cependant, Microsoft a décidé de se retirer App Centre au 31 mars 2025. Par conséquent, nous avons commencé à explorer les alternatives. L’un des solutions alternatives Sur la table a été fourni par App Center et l’autre devait trouver une solution de PaaS similaire d’un autre fournisseur. Puisque la pile back-end était AWS, nous avons choisi d’aller avec Mise à jour EAS.

Mise à jour EAS

La mise à jour EAS est un service hébergé qui sert des mises à jour pour des projets à l’aide de la bibliothèque Expo-Updates. Une fois la mise à jour EAS configurée correctement, l’application écoutera toute version ciblée de l’application sur le serveur EAS Dev Cloud. Expo offre un grand documentation sur la configuration et la configuration.

Comment ça marche?

En un mot;

1. Intégrez les «mises à jour EAS» dans le projet d’application.
2. L’utilisateur a l’installation de l’application sur son appareil.
3. L’équipe de développement a réalisé un correctif / correctif de bogue et a généré JSBundle pour la version de l’application ciblée et téléchargé sur le serveur Cloud Expo.dev.
4. La prochaine fois que l’utilisateur ouvrira l’application (les fréquences peuvent être configurables, nous pouvons définir sur l’application CV / démarrage), l’application vérifiera si un bundle est disponible pour être installé. S’il existe une mise à jour disponible, la version plus récente de l’application à partir de l’EXPO sera installée sur l’appareil de l’utilisateur.

Processus de déploiement OTA

Des détails supplémentaires peuvent être trouvés à https://docs.expo.dev/eas-update/how-it-works/.

Détails de la mise en œuvre:

Si vous êtes nouveau pour réagir le développement d’applications natifs, cet article peut aider Accédez à React / React Native en moins d’un mois. Et si vous passez de React à React Native, vous pouvez le trouver React Native – Le point de vue d’un développeur Web sur le pivot au mobile utile.

J’utilise mon application React-Native 0.73,7 existante. Cependant, on peut démarrer une nouvelle application native React pour votre test.

La configuration du projet nous oblige à configurer des modules d’expo. Le Guide d’installation de l’Expo Fournit un installateur qui gère la configuration. Notre projet avait besoin d’une version SDK 50 du programme d’installation.

• Utilisation de NPX install-expo-modules@0.8.1J’ai installé Expo, SDK-50, en alignement avec notre version native React actuelle 0.73.7, qui a ajouté les dépendances suivantes.

"@expo/vector-icons": "^14.0.0",
"expo-asset": "~9.0.2",
"expo-file-system": "~16.0.9",
"expo-font": "~11.10.3",
"expo-keep-awake": "~12.8.2",
"expo-modules-autolinking": "1.10.3",
"expo-modules-core": "1.11.14",
"fbemitter": "^3.0.0",
"whatwg-url-without-unicode": "8.0.0-3"

• Installé Expo-updaDates V0.24.14 Package qui a ajouté les dépendances suivantes.

"@expo/code-signing-certificates": "0.0.5",
"@expo/config": "~8.5.0",
"@expo/config-plugins": "~7.9.0",
"arg": "4.1.0",
"chalk": "^4.1.2",
"expo-eas-client": "~0.11.0",
"expo-manifests": "~0.13.0",
"expo-structured-headers": "~3.7.0",
"expo-updates-interface": "~0.15.1",
"fbemitter": "^3.0.0",
"resolve-from": "^5.0.0"

• Création du compte Expo à https://expo.dev/signup
• Pour configurer le compte exécuté, EAS Configurez
• Cela a généré l’ID du projet et les autres détails du compte.
• Les canaux suivants ont été créés: mise en scène, UAT et production.
• Ajout des valeurs de projet pertinentes à app.json, ajouté expo.plist et mise à jour dans AndroidManifest.xml.
• Scripts Block of Package.json a été mis à jour pour utiliser NPX Expo pour lancer l’application.
• Appdelegate.swift a été refactorisé dans le cadre du changement.
• Les actifs et références du centre d’applications et du codepush ont été supprimés.
• Création du composant personnalisé pour afficher une invite modale lorsque une nouvelle mise à jour est trouvée.

Déploiement OTA:

• Exécutez la commande via le terminal:

EAS_CHANNEL=staging RUNTIME_VERSION="7.13" eas update --message "build:[QA] - 7.13.841 - 25.5.9.4 - OTA Test2 commit"

• Une fois le package publié, je peux voir ma mise à jour disponible dans expo.dev comme indiqué dans l’image ci-dessous.

Écran de mise à jour EAS Une fois que le déploiement OTA est réussi.

Test:

1. Contrairement à App Center, Expo fournit le même package pour les cibles iOS et Android.
2. Le package de version ciblée est disponible sur le serveur Expo.
3. L’application redémarrer ou CV affichera la fenêtre contextuelle (implémentation personnalisée) informant «une nouvelle mise à jour est disponible».
4. Lorsqu’un utilisateur frappe le bouton «OK» dans la fenêtre contextuelle, la mise à jour sera installée et le contenu dans l’application redémarrera.
5. Si l’application redémarre avec succès, la mise à jour est installée avec succès.

Considérations:

• Dans metro.config.js – le @rnx-kit/metro-serializer a dû être commenté en raison du problème de compatibilité avec le processus de bundle de mise à jour EAS.
• Le package Expo / Vector-ICons provoque une baisse de la version de version Android sur le démarrage de l’application. Ce package peut être supprimé, mais si Package-Lock.json est supprimé, le package se réinstallera sous forme de dépendance à l’expo et, encore une fois, provoquera la plante de l’application. Le problème est décrit dans les commentaires ici: https://github.com/expo/expo/issues/26521. TVoici aucune solution disponible pour le moment. Le package d’icônes d’expo n’est pas géré correctement pendant le processus de construction. Il est causé par le package React-Native-Elements. Lorsqu’ils sont supprimés, les fichiers ne sont plus ajoutés à App.Manifest et l’application construit et s’exécute comme prévu.
• D’une manière ou d’une autre, la police nécessite des instructions dans Node_Modules / React-Native-Elements / Dist / AIDERS / GETICICONTYPE.js sont ramassés lors de la génération d’expo-dates d’application.manifest même si les fichiers ne sont pas utilisés notre application. La solution actuelle consiste à aller de l’avant et à inclure les polices dans le package, mais ce n’est pas optimal. Une meilleure solution consiste à filtrer ces polices à partir du processus d’expo-up-up.

Dépannage du déploiement:

• Erreur Récupération de la dernière mise à jour de l’expo: Erreur: «Nom de canal» n’est pas autorisé à être vide.

Les en-têtes «expo-runtime-Version», «Expo-Channel-Name» et «Expo-plateforme» sont nécessaires. Ils peuvent également être définis avec les paramètres de requête «Runtime-Version», «Channel-Name» et «Platform». Apprendre encore plus: https://github.com/expo/fyi/blob/main/eas-update-missing-headers.md

Les valeurs de configuration de l’application iOS sont maintenues dans support / expo.plist. L’erreur ci-dessus indique que le EXUpdatesRequestHeadersLe bloc dans le PLIST pourrait manquer.

Le déploiement OTA est très utile lorsque un grand nombre de clients utilisent l’application et que tout correctif ou correctif urgent doit être publié. Vous pouvez le définir pour vos environnements inférieurs ainsi que pour la production.

D’après mon expérience, c’est très fiable et l’équipe Expo fait un excellent travail pour le maintenir.

Donc Profitez-en service incroyable et Codage heureux!

Pour plus d’informations sur le perficient Solutions mobiles compétence, s’abonner à notre blog ou contact Notre équipe de solutions mobiles aujourd’hui!