Application Web Phonegap dans les navigateurs de bureau classiques
Si je développe une application Web dans phonegap, la même application Web peut-elle être exécutée sur des ordinateurs de bureau/portables classiques dans un navigateur?
Consultez le plugin Ripple Chrome pour exécuter les applications PhoneGap avec l'émulation de type d'appareil dans le navigateur Chrome.
Oui ... et non: Votre application Web sera exécutée dans les navigateurs de bureau Oui, car elle est composée de html, de css et de javascript . .
En gros, si vous vous en tenez à la norme, vous pourrez facilement transférer votre application sur la plupart des navigateurs, le travail à ce stade étant principalement un travail de thématisation.
Il fonctionnera certainement sur le bureau et sur un serveur Web, si vous le faites correctement.
Je le fais avec beaucoup de mes applications et des choses à noter est:
- CORS est autorisé dans PhoneGap mais peut ne pas l'être sur les navigateurs de bureau
- Les API Cordova/PhoneGap ne fonctionnent pas et peuvent générer des erreurs si vous essayez de les appeler.
La bonne pratique consiste à intégrer les écouteurs d'événements spécifiques à votre périphérique, etc., dans la fonction onDeviceReady en tant que:
onDeviceReady: function() {
// Register the device event listeners
document.addEventListener("backbutton", function (e) {
console.log("default prevented");
e.preventDefault();
}, false );
document.addEventListener("resume", onDeviceResume, false);
et enregistrer que dans la fonction d'initialisation
document.addEventListener("deviceready", onDeviceReady, false);
En dehors de cela, j'utilise une fonction primitive pour assigner la variable "phonegap" que je peux référencer si j'ai besoin de savoir sur quelle plate-forme nous sommes, ou si nous sommes un ordinateur de bureau (auquel cas ce sera faux).
isPhoneGap: function() {
var is = false;
var agent = navigator.userAgent.toLowerCase();
var path = window.location.href;
if (path.indexOf("file://") != -1) {
if (agent.indexOf("Android") != -1) {
is = "Android";
} else if (agent.indexOf("iphone") != -1 || agent.indexOf("ipad") != -1 || agent.indexOf("iPod") != -1) {
is = "ios";
} else if (agent.indexOf("iemobile") != -1) {
is = "wp";
}
}
return is;
},
Pas super joli mais j'espère que ça aide.
DesktopGap utilise le navigateur Chrome intégré au lieu de IE. Il n'y a qu'une version Windows.
Pas dans le navigateur mais Phonegap est supporté par Windows 8 donc si vous compilez votre application en tant que ici
; vous pouvez exécuter votre application juste sur w8 mais je n'ai pas essayé cela.
À l'heure actuelle, vous pouvez utiliser la plate-forme browser avec Cordova.
Vous pouvez l'installer à l'aide de la commande CLI Cordova standard
cordova platform add browser
Ensuite, en installant les plug-ins Cordova standard, ils fournissent la même interface de programmation que sur le périphérique. Par exemple, regardez https://github.com/Apache/cordova-plugin-camera/#supported-platforms . Le support n’est pas compatible à 100% avec l’appareil, mais l’équipe Cordova essaie d’apporter autant que possible une solution compatible au navigateur, en tant que plate-forme.
MacGap est un projet très actif et semble bien supporter l’API.
Hélas, ce n'est que pour Mac OSX, mais pourrait-il fonctionner comme un bon point de départ?
J'ai été surpris de ne trouver aucun moyen simple de tester l'application dans un navigateur de bureau. J'ai donc lancé un projet GitHub qui rend le processus simple. Actuellement, seul un nombre limité de plugins est émulé, mais je vais en ajouter d'autres et j'espère que des contributions aideront à compléter les autres plugins plus rapidement. Une assistance est également prévue pour la sélection de différentes tailles d’écran et d’autres personnalisations. J'espère que ça aide.
Si votre application phonegap ne dépend d'aucun code natif, alors vous pouvez simplement utiliser les fichiers html, css & js nécessaires à la création d'une application Web. Si votre application phonegap utilise des plugins phonegap ou des appels javascript spécifiques à phonegap, vous devez simplement décider de la manière dont ils doivent être mis en œuvre sur une application Web.
si vous utilisez un mac, ouvrez un terminal et désactivez la sécurité Web
open -a /Applications/Google\ Chrome.app --args --allow-file-access-from-files --disable-web-security
ouvrez votre homepage.html et appréciez :)
Étant donné que les applications de lacune téléphonique sont créées à l’aide de JS, HTML et CSS, vous pouvez accéder à ces fichiers HTML et les exécuter dans le navigateur . Cependant, votre code a accès à tous les appels spécifiques à un périphérique, ce qui jettera alors une erreur.
Essayez ceci: https://github.com/icblenke/phonegap-mac
J'ai essayé un échantillon et cela a fonctionné très bien .. Espérons que cela aide !!
En utilisant Ripple Emulator en chrome, vous pouvez exécuter votre application phonegap.
PhoneGap est une infrastructure d'application qui vous permet de créer des applications installées de manière native à l'aide de HTML et de JavaScript.
La façon la plus simple de penser à PhoneGap est un conteneur d'affichage Web 100% largeur et 100% hauteur, avec une interface de programmation JavaScript qui vous permet d'accéder aux fonctionnalités du système d'exploitation sous-jacent.
Il fonctionnera certainement sur le bureau, SI vous le faites correctement.
Je le fais avec beaucoup de mes applications, mais il est bon d’envelopper les écouteurs d’événements spécifiques à votre appareil, tels que:
onDeviceReady: function() {
// Your Code for Device event listner
},false);
Et initialiser la fonction
document.addEventListener("deviceready", onDeviceReady, false);
Vous pouvez installer Android VM et l’exécuter sur vos ordinateurs de bureau/Mac/terminaux de bureau Cisco/téléphones/etc. Ce que vous demandez probablement, c'est si vous pouvez avoir une base de code unique. La réponse est 99% oui. Vous avez besoin de quelques fichiers "supplémentaires" pour phonegap (index.html, config), mais vous pouvez également déployer le même code aux deux endroits. Ça fonctionne bien. Eh bien, il existe des "pièges" tels que
Qui dans le H vote négativement sur cette réponse? C'est en fait le peu qui répond directement à sa question. Il demande: "Si je développe une application Web dans phonegap, la même application Web peut-elle être exécutée dans des ordinateurs de bureau/portables classiques dans un navigateur?" Ma réponse est correcte car je l'ai fait et c'est en production avec une entreprise avec près de 1000 magasins et plus de 100 millions de dollars de revenus. Vous reconnaîtriez la plupart de leurs clients comme des noms familiers. L'application PhoneGap IS identique à 99% à la WebApp. En fait, le même dossier est compressé et téléchargé sur build.phonegap, comme copié sur le portail Web. Exactement comme indiqué ci-dessus, vous pouvez utiliser la même application Web et elle s'exécute dans un navigateur Web. En passant, vous pouvez utiliser la caméra à partir de HTML/js et NE PAS utiliser de code spécifique à PhoneGap. Idem pour le GPS (vous aurez toutefois besoin d’un code robuste pour le faire fonctionner sur de nombreux téléphones). L'accéléromètre et autre matériel seraient bien sûr des exceptions; mais, duh!
En fait, ma réponse est l’une des deux seules à souligner de nombreux problèmes. En outre, vous devez signaler le désordre des pixels de l'appareil. Vous pouvez utiliser vos CSS et votre pourcentage de mise en page, puis utiliser Media-Query pour ajouter des modifications CSS personnalisées pour les tablettes, les téléphones plus récents, etc. Vous finissez par créer des écrans presque personnalisés pour tablette, téléphone et autres formats d’affichage si vous souhaitez une assistance encore meilleure. Ensuite, vous apprendrez à créer des widgets/fragments d’interface utilisateur/autres et à les rendre intelligents. Un exemple simple consiste à utiliser jquery datatable et à modifier les colonnes sur des périphériques plus petits (masquer les colonnes de contenu d’information plus faible). Etc. Modifiez les boutons radio pour sélectionner, entre autres, des téléphones plus petits. Ce genre de merde. Bien sûr, vous finirez par avoir à inventer votre propre liste de diffusion ou à en utiliser une à partir de l'interface utilisateur de jquery, etc.
Vous pouvez également essayer d'exécuter votre application dans Chrome en utilisant l'option de ligne de commande --disable-web-security. Cela vous permettra d'effectuer certaines opérations "mobiles" telles que les requêtes interdomaines, etc.
J'espère que cela t'aides !
Comme Remy l'a dit, la plupart des éléments standard que vous écrivez conviendront, mais vous devrez envelopper certaines méthodes utilisant l'appareil photo/l'accéléromètre pour savoir si vous êtes dans une application ou non.
Bien qu'une meilleure solution consiste à utiliser la détection de fonctionnalités, car vous pouvez télécharger des images et utiliser l'appareil photo avec l'entrée HTML dans un site Web mobile, je suis à peu près sûr que vous pouvez accéder à la webcam dans certaines versions de Desktop Chrome maintenant.
Si vous souhaitez créer une application véritablement universelle, vous devez utiliser de nombreuses méthodes de détection de périphérique/dispositif, ou disposer d'un produit central, et utiliser quelque chose comme Git Submodules pour l'inclure et l'étendre en tant qu'application Phonegap.
Il n’existe pas de méthode simple, simple et standardisée.
Il existe un outil pour exécuter n'importe quelle application Android sur le système. le nom de l'outil est 'bluestack', il peut exécuter n'importe quelle application Android sur des systèmes.