Des solutions pour distribuer des applications HTML5 en tant qu'applications de bureau? [fermé]


141

Quelles sont les solutions pour distribuer une application de bureau basée sur HTML5?

Je souhaite pouvoir distribuer mon application HTML5 en tant qu'application de bureau autonome sous Windows, OSX et Linux. J'aimerais que les gens puissent double-cliquer sur le raccourci de l'icône de mon application pour exécuter mon programme.

Je ne veux pas du tout que la fenêtre du navigateur s'affiche, juste mon application. Est-ce possible?


4
Chrome + Fullscreen fonctionne bien
PostMan

2
Chrome sur Windows dispose d'une option "Créer un raccourci vers l'application" dans le menu clé à molette. Il créera un lien sur le bureau qui ouvre la fenêtre standard sans barre d'adresse.
6502

3
Avez-vous d'autres exigences, comme accéder aux fichiers locaux ou à d'autres choses qui ne sont normalement pas possibles dans le navigateur?
Tiemen

76
Quelqu'un peut-il m'expliquer pourquoi cette question est marquée comme non constructive ? Il demande s'il y a une plateforme, la réponse est objective: oui . Et pourrait être "implémenté" avec quelques possibilités, alors pourquoi est marqué de cette façon, vraiment.
Francesco Belladonna

10
Cette question est à la fois pertinente et d'actualité - comme le montre cet article récent: clintberry.com/2013/html5-apps-desktop-2013 .
Per Quested Aronsson

Réponses:


75

Applications HTML5 en 2014

Cadres par chrome / webkit

  • Electron (ancien Atom Shell)

    Electron est une bibliothèque open source développée par GitHub pour créer des applications de bureau multiplateformes avec HTML, CSS et JavaScript. Electron accomplit cela en combinant Chromium et Node.js dans un seul runtime et les applications peuvent être packagées pour Mac, Windows et Linux. ( source )

    Les gens de github l'utilisent pour fournir leur éditeur de code Atom en tant qu'application. Il a une API documentée et un canal d'aide sur les forums officiels d'atome.

  • Node-Webkit , l'approche la plus minimale

    node-webkit est un runtime d'application basé sur Chromium et node.js. Vous pouvez écrire des applications natives en HTML et JavaScript avec node-webkit. Il vous permet également d'appeler les modules Node.js directement depuis le DOM et permet une nouvelle façon d'écrire des applications natives avec toutes les technologies Web.

    Intel est derrière cela (?). On m'a dit que c'était très rugueux sur les bords.

  • Brackets Shell , le bac à sable de l'éditeur de code d'Adobes (et base d'Adobe Edge)

    Remarque: la coque entre parenthèses est uniquement conservée pour être utilisée par le projet Brackets. Bien que certaines personnes aient définitivement réussi à l'utiliser comme shell d'application pour d'autres projets, nous ne fournissons aucun support officiel pour cela et nous n'avons pas fait une tonne de travail pour rendre le shell d'application facilement réutilisable. Beaucoup de gens trouveront probablement plus facile d'utiliser un projet comme node-webkit, qui est plus générique de par sa conception.

    dit le readme, mais il y a pas mal de gens qui l'ont fait quand même.

Cadres + outils

  • Adobe AIR , comme l'a suggéré une autre réponse.

    Le runtime Adobe® AIR® permet aux développeurs de conditionner le même code dans des applications natives pour les ordinateurs de bureau Windows et Mac OS ainsi que pour iPhone, iPad, Kindle Fire, Nook Tablet et autres appareils Android ™, atteignant les magasins d'applications mobiles pour plus de 500 millions dispositifs.

  • Sencha est une société qui vend des outils pour les développeurs d'applications, y compris le développement et la distribution d'applications html5.

Approches inactives

  • Tide SDK ( archivé le 12/07/2015 sur archive.org ), version bêta, abandonné le 12 juillet 2015

    http://www.tidesdk.org/

  • XULRunner de Mozilla peut faire l'affaire pour vous mais ajoute une surcharge.

  • app.js s'est terminé le 28 octobre 2013 pour avoir été dépassé par ( https://github.com/rogerwang/node-webkit)[node-webkit] .

    Parce que c'est simple et pourtant puissant. En utilisant AppJS, vous n'avez pas à vous soucier du codage multiplateforme ou de l'apprentissage de nouveaux langages et outils. Vous connaissez déjà HTML, CSS et JavaScript. Quoi de mieux que cette pile pour le développement d'applications? De plus, AppJS utilise Chromium au cœur de sorte que vous puissiez faire fonctionner les dernières API HTML 5. Alors, concentrez-vous sur la tâche que votre application doit accomplir.

  • Mozilla Prism est mis hors service, leur slugline était:

    Apporter des applications Web à votre bureau
    Prism est une application qui permet aux utilisateurs de séparer les applications Web de leur navigateur et de les exécuter directement sur leur bureau.


7
Mozilla Prism est maintenant inactif
Harshith JV

8
Juste un avertissement avec Adobe Air. Si vous prévoyez d'utiliser n'importe quel type de solution de modèle javascript (c'est-à-dire Handlebars, Moustache), la plupart d'entre elles ne fonctionnent pas en raison d'erreurs de sécurité liées aux appels javascript de la nouvelle fonction ().
James Parker

merci pour cet indice très utile! Malheureusement, je n'ai pas encore eu l'occasion de tester l'un des exemples énumérés ci-dessus. Je les ai simplement collectés via la recherche.
Samuel Herzog

Vous pouvez faire en sorte que votre application s'exécute hors de la taille du sandbox de sécurité. J'ai également eu ce problème avec le système de création de modèles KendoUI, et j'ai pu le surmonter.Dans tous les cas, je suis passé d'Air à Titanium Desktop, mais je suis actuellement à la recherche d'alternatives car l'implémentation Windows Webkit de TD a de sérieux problèmes avec les éléments de formulaire (entrées / listes déroulantes) ).
Vasco Costa

Vous pouvez envisager que Sentenza Desktop intègre l' application Web HTML5 / CSS3 / JS dans l'application Mac OS X (.app). Une bibliothèque d'API est également disponible. Il ne nécessite aucun framework (comme Adobe Air ou TideSDK). Déploiement du Mac App Store pris en charge.
Beny

15

Vous pouvez utiliser AppJS qui utilise Nodejs et Chromium pour créer des applications html5 pour le bureau. Découvrez-le: http://appjs.com Lien Github: https://github.com/appjs/appjs


1
Le même est node-webkit, il a quelques fonctionnalités intéressantes comme la compilation de votre javascript en utilisant un instantané v8. lien
pillar15

Avis de dépréciation Le projet AppJS n'a pas été activement développé depuis quelques années. Veuillez consulter NW.js ou Electron à la place.
Aaron Franke

10

Vous voudrez peut-être regarder XULRunner de Mozilla. À un niveau de 10000 pieds, le navigateur FireFox est une application XULRunner (évidemment très sophistiquée, mais ...). Mais XULRunner vous permet d'utiliser Javascript et XML pour créer des applications, et la fenêtre du navigateur est l'un de ces composants, donc une fois que vous avez ouvert votre fenêtre de base, vous pouvez probablement faire à peu près tout ce que vous voulez.

En outre, en fonction de la sophistication de votre application, il existe plusieurs frameworks de "widgets" (comme Dashboard sur Mac, Yahoo Widgets, Windows Gadgets) qui sont également des environnements d'exécution HTML.


2
Je recommande fortement de regarder XULRunner. Pour ce que vous décrivez, c'est idéal et bien documenté. Chrome fonctionnerait aussi bien, je suppose, mais je ne l'ai pas examiné.
Jared Farrish

XUL runner est un framework génial et très flexible, mais pas bien documenté comme vous le dites. Un débutant devra beaucoup souffrir pour que les choses commencent.
esafwan

10

Jetez un œil au titane . Aujourd'hui encore, j'ai pris une application HTML5 fonctionnelle et, avec quelques modifications mineures, j'ai pu la déposer dans Titanium et la mettre en package pour Mac, Windows et Linux.

Et il prend également en charge PHP, Python et Ruby si votre application nécessite un traitement «côté serveur».


Si vous voulez une solution pré-emballée, je pense que c'est la réponse.
dylanisé

15
Mes expériences avec Titanium ont été terribles - il a fière allure à l'extérieur mais est bourré de bugs et devient un enfer à utiliser très rapidement. Je ne peux pas le recommander.
Damian

3
J'ai aussi pensé que ce serait un bon choix mais: 1) Je ne pouvais pas lui faire exécuter un simple "create-new-project / run" sous Linux (Ubuntu 11.10) 2) Titanium Desktop est en train d'être transformé en un projet COmmunity-Driven ( cela signifie que si quelqu'un ne prend pas son code, il mourra)
Luis Lobo Borobia

4
Je sais que c'est vieux, mais je viens de lire cette réponse et j'ai passé du temps jusqu'à ce que je découvre que Titanium Desktop est mort. Donc, plus une option. BTW, je pense à créer quelque chose avec c # et chrome intégré, comme l'a fait github dans son outil pour Windows
NicoGranelli

6
Titanium Desktop est devenu TideSDK tidesdk.org
Peacemoon

5

chrome peut faire ce que fait le prisme Voir - Outils-> Créer un raccourci vers une application


Je ne savais pas que ... +1
arg20

Malheureusement, les raccourcis d'application ne sont pas disponibles sur Mac.
Shane Holloway


3

Adobe AIR est conçu pour vous permettre de travailler principalement en HTML, CSS et JavaScript tout en fournissant une application de bureau. (Attention: je ne l'ai pas utilisé moi-même.)


1
le navigateur intégré dans AIR est ancien et ne sera jamais mis à jour, donc je ne le recommande pas (je l'ai utilisé dans plus de projets)
simion314

@ simion314: Je suis curieux, car AIR est un projet en cours, pourquoi vous dites que le navigateur qu'il contient ne sera "jamais" mis à jour.
TJ Crowder

voir forums.adobe.com/message/6177332 Adobe fonctionne davantage pour la partie mobile d'AIR, et sur mobile, ils utilisent StageWebView et ils ne mettront pas à jour le moteur de kit Web dans AIR, le stagewebview se limite à afficher des éléments, par exemple si vous essayez de charger une bibliothèque javascript complexe ou une application comme ckeditor 4 cela échouera en raison de certaines incompatibilités avec le moteur de
kit Web


2

Hmmm ... une machine virtuelle pour HTML5 / CSS / JS ... sonne comme un navigateur. :)

Adobe AIR ferait peut-être l'affaire, car il est basé sur l'idée d'apporter des applications Internet riches sur le bureau. Je ne l'ai cependant jamais utilisé.

Une chose que vous pouvez faire est de développer une application de bureau très basique qui utilise une sorte de contrôle de navigateur Web pré-emballé (par exemple, si vous développez pour un Mac, déposez simplement une WebView dans la fenêtre et ajoutez du code de base pour charger votre html sur l'application. Commencez).





1

Actuellement, la réponse est qu'il existe différentes solutions de chaque plate-forme.

  • Pour MAC OSX, vous allez créer une application de bureau Cocoa avec un UIWebView
  • Pour Windows, vous allez créer une application de bureau .NET avec un composant de navigateur.

Je pense qu'utiliser une fenêtre avec un composant de navigateur a plusieurs limitations (peut accéder au système de fichiers ou afficher le popup?), Connaissez-vous un projet que d'utiliser cette approche? ...
clagccs

Meilleure réponse et personne ne la reconnaît. À l'arrière, toutes les solutions hybrides utilisent un composant de vue Web qui se comporte comme un navigateur. C'est tout ce dont vous avez besoin, obtenez une vue Web, chargez le html / css / js et le tour est joué!
Dan Ochiana

1

Vous pouvez utiliser un serveur intégré comme Tomcat ou peut-être Apache.

J'utilise tomcat pour une application web java complète. Exécutez à l'intérieur du navigateur, mais l'application doit être installée. Le raccourci pour démarrer l'application, démarrer le service et ouvrir le navigateur.

Ou essayez d'utiliser Webkit


1

Un peu tard, mais vous pouvez utiliser une version portable de google chrome, puis créer une petite application Windows pour l'installer et créer un raccourci .ink vers son mode --kiosk et application.
Un peu comme les raccourcis d'applications Chrome, mais où vous installez Chrome pour eux.


1

Si vous en avez juste besoin pour Windows, vous devriez envisager les applications HTML (HTA), cela fait partie d'Internet Explorer depuis IE 5 (10+ ans).

Aucun serveur requis, formatage HTML complet, accès complet aux ressources locales (même aux ports COM / USB), génial. En outre, facile à déboguer avec Visual Studio, il suffit de se lier à MSHTA.exe

Vous pouvez activer HTML 5 dans les HTA avec la balise Meta suivante:

<!-- enable html5 features --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>

+1 Recherchez également le support Linux et Mac :)
Bhargav Nanekalva
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.