HTML5 uygulamalarını masaüstü uygulamaları olarak dağıtmak için çözümler? [kapalı]


141

HTML5 tabanlı bir masaüstü uygulamasını dağıtmak için bazı çözümler nelerdir?

HTML5 uygulamamı Windows, OSX ve Linux'ta bağımsız bir masaüstü uygulaması olarak dağıtabilmek istiyorum. Kullanıcıların programımı çalıştırmak için uygulama simgesi kısayolumu çift tıklayabilmelerini istiyorum.

Tarayıcı penceresinin hiç gösterilmesini istemiyorum, sadece uygulamam. Mümkün mü?


4
Chrome + Tam ekran iyi çalışıyor
PostMan

2
Windows'da Chrome'un İngiliz anahtarı menüsünden "uygulama kısayolu yap" seçeneği vardır. Masaüstünde, adres çubuğu olmadan standart pencere açan bir bağlantı oluşturur.
6502

3
Yerel dosyalara veya tarayıcıda normalde mümkün olmayan diğer şeylere erişmek gibi başka gereksinimleriniz var mı?
Tiemen

76
Birisi bana bu sorunun neden yapıcı değil olarak işaretlendiğini açıklayabilir mi? Bir platform olup olmadığını soruyor, cevap objektif: evet . Ve bazı olasılıklarla "uygulanabilir", bu yüzden neden gerçekten bu şekilde işaretleniyor.
Francesco Belladonna

10
Bu soru hem alakalı hem de günceldir - bu son makalede gösterildiği gibi: clintberry.com/2013/html5-apps-desktop-2013 .
Görev Aradı Aronsson

Yanıtlar:


75

2014'teki HTML5 Uygulamaları

Chrome / webkit çerçeveler

  • Elektron (eski Atom Kabuğu)

    Electron, GitHub tarafından HTML, CSS ve JavaScript ile platformlar arası masaüstü uygulamaları oluşturmak için geliştirilmiş açık kaynaklı bir kütüphanedir. Electron bunu Chromium ve Node.js'yi tek bir çalışma zamanında birleştirerek başarır ve uygulamalar Mac, Windows ve Linux için paketlenebilir. ( kaynak )

    Github halkı, kod editörü Atom'u bir uygulama olarak sağlamak için bunu kullanıyor . Resmi atom forumlarında belgelenmiş bir API ve yardım kanalı vardır.

  • Düğüm-Webkit , en minimal yaklaşım

    node-webkit, Chromium ve node.js tabanlı bir uygulama çalışma zamanıdır. Düğüm-webkit ile yerel uygulamaları HTML ve JavaScript olarak yazabilirsiniz. Ayrıca Node.js modüllerini doğrudan DOM'dan çağırmanıza izin verir ve tüm Web teknolojileriyle yerel uygulamalar yazmanın yeni bir yolunu sunar.

    Intel bunun arkasında (?). Kenarlarda çok kaba olduğu söylendi.

  • Adobes kod düzenleyicisinin (ve Adobe Edge'in tabanının) sanal alanı Brackets Shell

    Not: Parantez kabuğu yalnızca Parantez projesi tarafından kullanılmak üzere korunur. Bazı insanlar kesinlikle diğer projeler için bir uygulama kabuğu olarak kullanmakta başarılı olsa da, bunun için resmi bir destek sağlamıyoruz ve uygulama kabuğunu kolayca yeniden kullanılabilir hale getirmek için bir ton çalışma yapmadık. Birçok kişi muhtemelen tasarımla daha genel olan düğüm-webkit gibi bir projeyi kullanmayı daha kolay bulacaktır.

    Benioku diyor, ama yine de bunu yapan çok sayıda insan var.

Çerçeveler + Araçlar

  • Başka bir yanıt önerildiği gibi Adobe AIR .

    Adobe® AIR® çalışma zamanı, geliştiricilerin aynı kodu Windows ve Mac OS masaüstü bilgisayarların yanı sıra iPhone, iPad, Kindle Fire, Nook Tablet ve diğer Android ™ cihazlarda yerel uygulamalara paketleyerek 500 milyondan fazla mobil uygulama mağazasına ulaşmasını sağlar cihazlar.

  • Sencha , html5 uygulama geliştirme ve dağıtımı da dahil olmak üzere uygulama geliştiricileri için araçlar satan bir şirkettir.

Aktif olmayan yaklaşımlar


7
Mozilla Prism şu anda etkin değil
Harshith JV

8
Adobe Air ile bir adım öne geçin. Herhangi bir javascript şablon çözümü (örneğin Gidon, Bıyık) kullanmayı planlıyorsanız, çoğu yeni işlev () javascript çağrılarıyla ilgili güvenlik hataları nedeniyle çalışmaz.
James Parker

çok yararlı ipucu için teşekkürler! ne yazık ki yukarıda listelenen örneklerden herhangi birini test etme fırsatım olmadı. Onları sadece araştırma yoluyla topladım.
Samuel Herzog

Uygulamanızın güvenlik sanal alanında büyük boyutta çalışmasını sağlayabilirsiniz. KendoUI şablonlama sistemiyle de bu sorunu yaşadım ve üstesinden gelebildim.Her iki şekilde de Air'den Titanium Desktop'a geçtim, ancak TD'nin Windows webkit uygulamasının form öğeleri (girişler / açılanlar) ile ciddi sorunları olduğundan şu anda alternatifler arıyorum. ).
Vasco Costa

Sentenza Desktop'ı HTML5 / CSS3 / JS web uygulamasını Mac OS X uygulamasına (.app) paketlemeyi düşünebilirsiniz . Bir API kütüphanesi de mevcuttur. Herhangi bir çerçeve gerektirmez (Adobe Air veya TideSDK gibi). Mac App Store dağıtımı desteklenir.
Beny

15

Masaüstü için html5 uygulamaları oluşturmak için Nodejs ve Chromium kullanan AppJS'yi kullanabilirsiniz. göz atın : http://appjs.com Github Bağlantı: https://github.com/appjs/appjs


1
Benzer bir düğüm-webkit, v8 anlık görüntüsünü kullanarak javascriptinizi derlemek gibi bazı güzel özelliklere sahiptir. bağlantı
pillar15

Kullanımdan Kaldırılma Bildirimi AppJS projesi birkaç yıldır aktif olarak geliştirilmemiştir. Lütfen bunun yerine NW.js veya Elektron'a bakın.
Aaron Franke

10

Mozilla'dan XULRunner'a bakmak isteyebilirsiniz. 10000 feet seviyesinde, FireFox tarayıcı bir XULRunner uygulamasıdır (açıkçası çok sofistike bir uygulamadır, ancak ...). Ancak XULRunner, uygulamalar oluşturmak için Javascript ve XML kullanmanıza izin verir ve tarayıcı penceresi bu bileşenlerden biridir, bu nedenle temel pencerenizi kaldırdığınızda, büyük olasılıkla istediğiniz her şeyi yapabilirsiniz.

Ayrıca, uygulamanızın karmaşıklığına bağlı olarak, temelde HTML çalışma zamanları olan birkaç "widget" çerçevesi (Mac'te Gösterge Tablosu, Yahoo Widget'ları, Windows Gadget'ları gibi) vardır.


2
XULRunner'a bakmanızı tavsiye ederim. Açıkladığınız şey için ideal ve iyi belgelenmiş. Sanırım Chrome da işe yarayacaktı, ama bakmadım.
Jared Farrish

XUL koşucusu harika bir çerçeve ve çok esnek, ama dediğin gibi iyi belgelenmemiş. Bir acemi bir şey başlamak için çok acı çekmek zorunda kalacak.
esafwan

10

Kesinlikle Titanyum göz atın . Sadece bugün işlevsel bir HTML5 uygulaması aldım ve birkaç küçük değişiklikle Titanyum'a bırakıp Mac, Windows ve Linux için paketleyebildim.

Ayrıca, uygulamanız "sunucu tarafı" işleme gerektiriyorsa PHP, Python ve Ruby'yi de destekler.


Önceden paketlenmiş bir çözüm istiyorsanız, bunun cevap olduğunu düşünüyorum.
23'te dylanized

15
Titanyum ile yaşadığım deneyimler korkunçtu - dışarıda harika görünüyor ama böceklerle doludur ve çok hızlı bir şekilde kullanmak cehenneme dönüşür. Bunu tavsiye edemez.
Damian

3
Ayrıca bunun iyi bir seçim olacağını düşündüm ama: 1) Linux'ta basit bir "yeni proje oluştur / çalıştır" yapamadım (Ubuntu 11.10) 2) Titanium Desktop COmmunity-Driven projesine dönüştürülüyor ( yani birisi kodunu
almazsa

4
Bunun eski olduğunu biliyorum, ama sadece bu cevabı okudum ve Titanium Desktop'ın öldüğünü anlayana kadar biraz zaman geçirdim. Yani, artık bir seçenek değil. BTW,
cith

6
Titanyum Masaüstü TideSDK oldu tidesdk.org
Peacemoon

5

krom prizmanın yaptığı şeyi yapabilir Bkz. - Araçlar-> Uygulama kısayolu oluştur


Bunu bilmiyordum ... +1
arg20

Maalesef, Mac'te uygulama kısayolları kullanılamıyor.
Shane Holloway


3

Adobe AIR , bir masaüstü uygulaması sağlarken öncelikle HTML, CSS ve JavaScript'te çalışmanıza izin vermeyi amaçlamaktadır. (Dikkat: Aslında kendim kullanmadım.)


1
AIR'deki entegre tarayıcı eski ve asla güncellenmeyecek, bu yüzden tavsiye etmiyorum (daha fazla projede kullandım)
simion314 17:14

@ simion314: AIR devam eden bir proje olduğu için merak ediyorum, neden içindeki tarayıcının "asla" güncellenmeyeceğini söylüyorsunuz?
TJ Crowder

bkz. forumlar.adobe.com/tr/message/6177332 Adobe AIR'in mobil bölümü için daha çok çalışır ve mobilde StageWebView kullanır ve AIR'deki webkit motorunu güncellemezler, stagewebview yalnızca bir şeyler görüntülemekle sınırlıdır, örneğin webkit motoruyla bazı uyumsuzluklar nedeniyle başarısız olacak ckeditor 4 gibi karmaşık bir javascript kütüphanesi veya uygulama yüklemeye çalışın (bazıları sandboxing ile ilgilidir, hepsi değil)
simion314 17:03


2

Hmmm ... HTML5 / CSS / JS için sanal bir makine ... bir tarayıcı gibi geliyor. :)

Belki Adobe AIR hile yapabilir, çünkü zengin İnternet uygulamalarını masaüstüne getirme fikrine dayanır. Ancak hiç kullanmadım.

Yapabileceğiniz bir şey, bir çeşit hazır ambalajlı web tarayıcı kontrolü kullanan çok temel bir masaüstü uygulaması geliştirmektir (örneğin bir Mac için geliştiriyorsanız, pencereye bir WebView bırakın ve html'nizi uygulamaya yüklemek için bazı temel kod ekleyin başlamak).





1

Şu anda cevap, her platformun farklı çözümleri.

  • MAC OSX için UIWebView ile bir Cocoa Desktop Uygulaması oluşturacaksınız
  • Windows için tarayıcı bileşenine sahip bir .NET masaüstü uygulaması yapacaksınız.

Tarayıcı bileşenli bir pencere kullanmaktan çok çeşitli sınırlamalar olduğunu düşünüyorum (dosya sistemine erişebilir veya pop-up gösterebilir mi?), Bu yaklaşımı kullanmaktan başka bir proje biliyor musunuz? ...
clagccs

En iyi cevap ve kimse bunu kabul etmiyor. Arkada çoğunlukla tüm hibrit çözümler tıpkı bir tarayıcı gibi davranan bir webview bileşeni kullanıyor. Tüm ihtiyacınız olan bu, bir web görünümü olsun, html / css / js ve voila yükleyin!
Dan Ochiana

1

Tomcat veya belki de Apache gibi gömülü bir sunucu kullanabilirsiniz.

Tomcat'i eksiksiz bir java web uygulaması için kullanıyorum. Tarayıcının içinde çalıştırın, ancak uygulamanın yüklenmesi gerekir. Uygulamayı başlatmak, hizmeti başlatmak ve tarayıcıyı açmak için kısayol.

Veya webkit'i kullanmayı deneyin


1

Biraz geç, ancak google chrome'un taşınabilir bir sürümünü kullanabilir ve yüklemek için küçük bir windows uygulaması oluşturabilir ve --kiosk ve uygulama moduna bir .ink kısayolu oluşturabilirsiniz.
Krom uygulama kısayolları gibi, ancak onlar için krom yüklediğiniz yerde.


1

Sadece Windows için ihtiyacınız varsa, HTML Uygulamaları'nı (HTA) düşünmelisiniz, IE 5'ten (10+ yıl) beri Internet Explorer'ın bir parçası olmuştur.

Sunucu gerekmez, tam HTML biçimlendirme, yerel kaynaklara tam erişim (COM / USB bağlantı noktaları bile), harika. Ayrıca, Visual Studio ile hata ayıklamak kolay, sadece MSHTA.exe'ye bağlanın

HTML 5'i HTA'larda aşağıdaki meta etiketle etkinleştirebilirsiniz:

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

+1 Linux ve Mac desteğini de arayın :)
Bhargav Nanekalva
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.