Rozwiązania do dystrybucji aplikacji HTML5 jako aplikacji komputerowych? [Zamknięte]

141

Jakie są rozwiązania dotyczące dystrybucji aplikacji komputerowej opartej na HTML5?

Chcę móc rozpowszechniać moją aplikację HTML5 jako samodzielną aplikację komputerową w systemach Windows, OSX i Linux. Chciałbym, aby ludzie mogli dwukrotnie kliknąć skrót do ikony mojej aplikacji, aby uruchomić mój program.

Nie chcę, aby w ogóle było wyświetlane okno przeglądarki, tylko moja aplikacja. czy to możliwe?

javascript  html  desktop-application 
— foreyez
źródło
4
Chrome +
— pełny
2
Chrome w systemie Windows ma opcję „utwórz skrót do aplikacji” z menu klucza. Utworzy łącze na pulpicie, które otwiera standardowe okno bez paska adresu.
— 6502
3
Czy masz jakieś inne wymagania, takie jak dostęp do plików lokalnych lub inne rzeczy, które normalnie nie są możliwe w przeglądarce?
— Tiemen
76
Czy ktoś może mi wyjaśnić, dlaczego to pytanie jest oznaczone jako nie konstruktywne ? Pyta, czy jest platforma, odpowiedź jest obiektywna: tak . I mógłby być „zaimplementowany” z pewnymi możliwościami, więc tak naprawdę jest to zaznaczone.
— Francesco Belladonna
10
To pytanie jest zarówno istotne, jak i aktualne - jak pokazuje ten ostatni artykuł: clintberry.com/2013/html5-apps-desktop-2013 .
— Per Quested Aronsson

Odpowiedzi:

75

Aplikacje HTML5 w 2014 roku

Ramki z Chrome / Webkit

  • Electron (dawna powłoka atomu)

    Electron to biblioteka open source opracowana przez GitHub do tworzenia wieloplatformowych aplikacji komputerowych z HTML, CSS i JavaScript. Electron osiąga to, łącząc Chromium i Node.js w jedno środowisko uruchomieniowe, a aplikacje mogą być pakowane dla komputerów Mac, Windows i Linux. ( źródło )

    Użytkownicy github używają tego, aby udostępnić swój edytor kodu Atom jako aplikację. Posiada udokumentowane API i kanał pomocy na oficjalnych forach Atom.

  • Node-Webkit , najbardziej minimalne podejście

    node-webkit to środowisko uruchomieniowe aplikacji oparte na Chromium i node.js. Możesz pisać aplikacje natywne w HTML i JavaScript za pomocą node-webkit. Umożliwia także wywoływanie modułów Node.js bezpośrednio z DOM i umożliwia nowy sposób pisania natywnych aplikacji przy użyciu wszystkich technologii internetowych.

    Za tym stoi Intel (?). Powiedziano mi, że jest bardzo szorstki na krawędziach.

  • Brackets Shell , piaskownica edytora kodu Adobes (i podstawa Adobe Edge)

    Uwaga: Powłoka nawiasów jest obsługiwana tylko do użytku przez projekt Brackets. Chociaż niektórym osobom z pewnością udało się użyć go jako powłoki aplikacji dla innych projektów, nie zapewniamy żadnego oficjalnego wsparcia w tym zakresie i nie włożyliśmy zbyt wiele pracy, aby umożliwić łatwe ponowne użycie powłoki aplikacji. Wiele osób prawdopodobnie będzie łatwiej korzystać z projektu takiego jak node-webkit, który jest bardziej ogólny z założenia.

    mówi plik readme, ale jest sporo osób, które to zrobiły.

Struktury + narzędzia

  • Adobe AIR , jak sugerowały inne odpowiedzi.

    Środowisko wykonawcze Adobe® AIR® umożliwia programistom umieszczanie tego samego kodu w natywnych aplikacjach na komputery stacjonarne z systemem Windows i Mac OS, a także na iPhone'a, iPada, Kindle Fire, Nook Tablet i inne urządzenia z systemem Android ™, docierając do sklepów z aplikacjami mobilnymi dla ponad 500 milionów urządzenia.

  • Sencha to firma sprzedająca narzędzia dla twórców aplikacji, w tym tworzenie i dystrybucję aplikacji HTML5.

Nieaktywne podejścia

— Samuel Herzog
źródło
7
Mozilla Prism jest teraz nieaktywna
— Harshith JV,
8
Tylko ostrzeżenie dzięki Adobe Air. Jeśli planujesz używać dowolnego rozwiązania szablonu javascript (np. Handlebars, Mustache), większość z nich nie działa z powodu błędów bezpieczeństwa związanych z nowymi wywołaniami JavaScript function ().
— James Parker
dzięki za tę bardzo przydatną wskazówkę! niestety nie miałem jeszcze przeciwności, aby przetestować którykolwiek z wyżej wymienionych przykładów. Po prostu zebrałem je poprzez badania.
— Samuel Herzog
Możesz sprawić, by aplikacja działała poza bezpieczną piaskownicą. Miałem również ten problem z systemem szablonów KendoUI i udało mi się go pokonać. Tak czy inaczej przesiadłem się z Air na Titanium Desktop, ale obecnie szukam alternatyw, ponieważ implementacja TD w webkicie Windows ma poważne problemy z elementami formularzy (dane wejściowe / rozwijane ).
— Vasco Costa
Możesz rozważyć Sentenza Desktop, aby spakować aplikację internetową HTML5 / CSS3 / JS do aplikacji Mac OS X (.app). Dostępna jest również biblioteka API. Nie wymaga żadnych frameworków (takich jak Adobe Air czy TideSDK). Obsługiwane wdrażanie w sklepie Mac App Store.
— Beny
10

Możesz spojrzeć na XULRunner z Mozilli. Na poziomie 10000 stóp przeglądarka FireFox jest aplikacją XULRunner (oczywiście bardzo wyrafinowaną, ale ...). Ale XULRunner pozwala ci używać Javascript i XML do tworzenia aplikacji, a okno przeglądarki jest jednym z tych komponentów, więc po wyświetleniu podstawowego okna możesz prawdopodobnie zrobić prawie wszystko, co chcesz.

Ponadto, w zależności od stopnia zaawansowania aplikacji, istnieje kilka struktur „widżetów” (np. Dashboard na Macu, Yahoo Widgets, Windows Gadgets), które są również w zasadzie środowiskami wykonawczymi HTML.

— Will Hartung
źródło
2
Gorąco polecam przyjrzenie się XULRunnerowi. To, co opisujesz, jest idealne i dobrze udokumentowane. Przypuszczam, że Chrome również działałby równie dobrze, ale nie sprawdziłem tego.
— Jared Farrish
XUL runner to niesamowity framework i bardzo elastyczny, ale niezbyt dobrze udokumentowany, jak mówisz. Początkujący będzie musiał dużo cierpieć, aby zacząć.
— esafwan
10

Zdecydowanie sprawdź Titanium . Właśnie dzisiaj wziąłem funkcjonalną aplikację HTML5 i po kilku drobnych modyfikacjach udało mi się wrzucić ją do Titanium i spakować dla Mac, Windows i Linux.

Obsługuje również PHP, Python i Ruby, jeśli Twoja aplikacja wymaga przetwarzania „po stronie serwera”.

— ggutenberg
źródło
Jeśli potrzebujesz gotowego rozwiązania, myślę, że to jest odpowiedź.
— zdylanizowany
15
Moje doświadczenia z Titanium były okropne - na zewnątrz wygląda świetnie, ale jest nafaszerowany robakami i bardzo szybko staje się piekłem. Nie mogę tego polecić.
— Damian
3
Pomyślałem również, że byłby to dobry wybór, ale: 1) nie mogłem sprawić, by uruchamiał proste „tworzenie nowego projektu / uruchamianie” w systemie Linux (Ubuntu 11.10) 2) Titanium Desktop jest przekształcany w projekt oparty na społeczności ( to znaczy, jeśli ktoś nie weźmie ich kodu, zginie)
— Luis Lobo Borobia
4
Wiem, że to stare, ale właśnie przeczytałem tę odpowiedź i spędziłem trochę czasu, aż zorientowałem się, że Titanium Desktop nie żyje. Więc nie ma już opcji. Przy okazji, myślę o stworzeniu czegoś z osadzonym c # i chromem, tak jak zrobił to github w swoim narzędziu dla Windows
— NicoGranelli
6
Titanium Desktop zmienił nazwę na
— Peacemoon
5

chrome może zrobić to, co pryzmat Zobacz - Narzędzia-> Utwórz skrót do aplikacji

— user822746
źródło
Nie wiedziałem, że ... +1
— arg20
Niestety skróty do aplikacji nie są dostępne na komputerach Mac.
— Shane Holloway
3

Adobe AIR ma umożliwiać pracę głównie w językach HTML, CSS i JavaScript, zapewniając jednocześnie aplikację komputerową. (Uwaga: sam z niego nie korzystałem).

— TJ Crowder
źródło
1
zintegrowana przeglądarka w AIR jest stara i nigdy nie będzie aktualizowana, więc nie polecam (używałem jej w większej liczbie projektów)
— simion314
@ simion314: Jestem ciekawy, skoro AIR to trwający projekt, dlaczego mówisz, że przeglądarka w nim „nigdy” nie będzie aktualizowana.
— TJ Crowder
patrz forums.adobe.com/message/6177332 Adobe pracuje bardziej w mobilnej części AIR, a na urządzeniach mobilnych używają StageWebView i nie aktualizują silnika webkit w AIR, stagewebview ogranicza się tylko do wyświetlania rzeczy, na przykład jeśli spróbuj załadować złożoną bibliotekę javascript lub aplikację, taką jak ckeditor 4, zakończy się niepowodzeniem z powodu pewnych niezgodności z silnikiem webkit (niektóre są związane z piaskownicą, ale nie wszystkie)
— simion314
2

Hmmm ... maszyna wirtualna dla HTML5 / CSS / JS ... brzmi jak przeglądarka. :)

Może Adobe AIR załatwi sprawę, ponieważ opiera się na pomyśle przeniesienia bogatych aplikacji internetowych na pulpit. Jednak nigdy go nie używałem.

Jedną z rzeczy, które możesz zrobić, to stworzyć bardzo podstawową aplikację komputerową, która używa pewnego rodzaju gotowej kontrolki przeglądarki internetowej (np. Jeśli tworzysz na Maca, po prostu upuść WebView w oknie i dodaj trochę podstawowego kodu, aby załadować swój kod HTML do aplikacji uruchomienie).

— Jeff
źródło
1

Obecnie odpowiedź brzmi, że są różne rozwiązania dla każdej platformy.

  • W przypadku systemu MAC OSX utworzysz aplikację Cocoa Desktop z UIWebView
  • W przypadku systemu Windows utworzysz aplikację komputerową .NET ze składnikiem przeglądarki.
— Mustafa Hanif
źródło
Myślę, niż użyć okna z komponentu przeglądarka ma kilka ograniczeń (może uzyskać dostęp do systemu plików lub pokazać popup?) Czy wiesz, każdy projekt niż stosowanie tego podejścia ...?
— clagccs
Najlepsza odpowiedź i nikt tego nie przyznaje. Z tyłu przeważnie wszystkie rozwiązania hybrydowe wykorzystują komponent Webview, który zachowuje się jak przeglądarka. To wszystko, czego potrzebujesz, uruchom przeglądarkę internetową, załaduj html / css / js i voila!
— Dan Ochiana
1

Możesz użyć wbudowanego serwera, takiego jak Tomcat lub może Apache.

Używam tomcat do kompletnej aplikacji internetowej Java. Uruchom w przeglądarce, ale aplikacja musi być zainstalowana. Skrót do uruchomienia aplikacji, uruchomienia usługi i otwarcia przeglądarki.

Lub spróbuj użyć zestawu internetowego

— Bruno Tafarelo
źródło
1

Trochę późno, ale możesz użyć przenośnej wersji Google Chrome, a następnie utworzyć małą aplikację Windows, aby ją zainstalować, i utworzyć skrót .ink do jej --kiosk i trybu aplikacji.
Trochę jak skróty do aplikacji Chrome, ale gdzie instalujesz dla nich chrome.

— Szczery
źródło
1

Jeśli potrzebujesz go tylko dla systemu Windows, powinieneś rozważyć Aplikacje HTML (HTA), jest częścią Internet Explorera od IE 5 (ponad 10 lat).

Nie jest wymagany serwer, pełne formatowanie HTML, pełny dostęp do lokalnych zasobów (nawet portów COM / USB), super. Ponadto, łatwe do debugowania w programie Visual Studio, po prostu powiąż z MSHTA.exe

Możesz włączyć HTML 5 w aplikacjach HTA za pomocą następującego metatagu:

<!-- enable html5 features --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
— William Walseth
źródło
+1 Poszukaj wsparcia dla Linuksa i Maca :)
— Bhargav Nanekalva
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.