Solusi untuk mendistribusikan aplikasi HTML5 sebagai aplikasi desktop? [Tutup]


141

Apa saja solusi untuk mendistribusikan aplikasi desktop berbasis HTML5?

Saya ingin dapat mendistribusikan aplikasi HTML5 saya sebagai aplikasi desktop mandiri di Windows, OSX, dan Linux. Saya ingin orang-orang dapat mengklik dua kali pintasan ikon aplikasi saya untuk menjalankan program saya.

Saya tidak ingin jendela browser ditampilkan sama sekali, hanya aplikasi saya. Apakah ini mungkin?


4
Chrome + Fullscreen berfungsi dengan baik
PostMan

2
Chrome di windows memiliki opsi "buat pintasan aplikasi" dari menu perkakas. Ini akan membuat tautan di desktop yang membuka jendela standar tanpa bilah alamat.
6502

3
Apakah Anda memiliki persyaratan lain, seperti mengakses file lokal atau hal-hal lain yang biasanya tidak mungkin dalam browser?
Tiemen

76
Adakah yang bisa menjelaskan mengapa pertanyaan ini tidak konstruktif ? Dia bertanya apakah ada platform, jawabannya objektif: ya . Dan bisa "diimplementasikan" dengan beberapa kemungkinan, jadi mengapa ditandai dengan cara ini, sungguh.
Francesco Belladonna

10
Pertanyaan ini relevan dan topikal - seperti yang ditunjukkan oleh artikel terbaru ini: clintberry.com/2013/html5-apps-desktop-2013 .
Per Quested Aronsson

Jawaban:


75

Aplikasi HTML5 pada tahun 2014

Bingkai oleh chrome / webkit

  • Elektron (sebelumnya Atom Shell)

    Electron adalah pustaka sumber terbuka yang dikembangkan oleh GitHub untuk membangun aplikasi desktop lintas platform dengan HTML, CSS, dan JavaScript. Elektron menyelesaikan ini dengan menggabungkan Chromium dan Node.js menjadi satu runtime dan aplikasi dapat dikemas untuk Mac, Windows, dan Linux. ( sumber )

    Orang-orang di github menggunakan ini untuk menyediakan editor kode mereka Atom sebagai aplikasi. Ia memiliki api yang didokumentasikan dan saluran bantuan di forum atom resmi.

  • Node-Webkit , pendekatan yang paling minimal

    node-webkit adalah runtime aplikasi berdasarkan Chromium dan node.js. Anda dapat menulis aplikasi asli dalam HTML dan JavaScript dengan node-webkit. Ini juga memungkinkan Anda memanggil modul Node.js langsung dari DOM dan memungkinkan cara baru untuk menulis aplikasi asli dengan semua teknologi Web.

    Intel berada di balik ini (?). Saya telah diberitahu bahwa itu sangat kasar di sekitarnya.

  • Brackets Shell , kotak pasir editor kode Adobes (dan basis Adobe Edge)

    Catatan: Shell kurung hanya dipelihara untuk digunakan oleh proyek kurung. Meskipun beberapa orang pasti berhasil menggunakannya sebagai shell aplikasi untuk proyek lain, kami tidak memberikan dukungan resmi untuk itu dan kami belum melakukan banyak pekerjaan untuk membuat shell aplikasi mudah digunakan kembali. Banyak orang akan lebih mudah menggunakan proyek seperti node-webkit, yang lebih umum secara desain.

    kata readme, tetapi ada cukup banyak orang di luar sana yang melakukannya.

Kerangka + Alat

  • Adobe AIR , seperti jawaban lain yang disarankan.

    Runtime Adobe® AIR® memungkinkan pengembang untuk mengemas kode yang sama ke dalam aplikasi asli untuk desktop Windows dan Mac OS serta iPhone, iPad, Kindle Fire, Nook Tablet, dan perangkat Android ™ lainnya, menjangkau toko aplikasi seluler untuk lebih dari 500 juta perangkat.

  • Sencha adalah perusahaan yang menjual alat untuk pengembang aplikasi, termasuk pengembangan dan distribusi aplikasi HTML5.

Pendekatan tidak aktif


7
Mozilla Prism tidak aktif sekarang
Harshith JV

8
Hanya kepala dengan Adobe Air. Jika Anda berencana menggunakan segala jenis solusi template javascript (mis. Setang, Moustache) kebanyakan dari mereka tidak berfungsi karena kesalahan keamanan yang terkait dengan fungsi baru () panggilan javascript.
James Parker

terima kasih untuk itu petunjuk yang sangat berguna! sayangnya saya belum memiliki kesempatan untuk menguji salah satu contoh yang tercantum di atas. Saya hanya mengumpulkannya melalui penelitian.
Samuel Herzog

Anda dapat membuat aplikasi Anda berjalan di luar kotak pasir keamanan. Saya punya masalah dengan sistem templating KendoUI juga, dan bisa mengatasinya. Bagaimanapun saya beralih dari Air ke Titanium Desktop, tetapi saat ini saya sedang mencari alternatif karena penerapan TD webkit Windows memiliki masalah serius dengan elemen bentuk (input / dropdown) ).
Vasco Costa

Anda dapat mempertimbangkan Sentenza Desktop untuk mengemas aplikasi web HTML5 / CSS3 / JS ke dalam aplikasi Mac OS X (.app). Pustaka API juga tersedia. Itu tidak memerlukan kerangka kerja apa pun (seperti Adobe Air atau TideSDK). Penerapan Mac App Store didukung.
Beny

15

Anda dapat menggunakan AppJS yang menggunakan Nodejs dan Chromium untuk membangun aplikasi html5 untuk desktop. lihat: http://appjs.com Tautan Github: https://github.com/appjs/appjs


1
Yang serupa adalah node-webkit, ia memiliki beberapa fitur bagus seperti kompilasi javascript Anda menggunakan snapshot v8. tautan
pilar15

Penghentian Pemberitahuan Proyek AppJS belum dikembangkan secara aktif selama beberapa tahun. Silakan periksa NW.js atau Elektron sebagai gantinya.
Aaron Franke

10

Anda mungkin ingin melihat XULRunner dari Mozilla. Pada tingkat 10.000 kaki, browser FireFox adalah aplikasi XULRunner (jelas yang sangat canggih, tapi ...). Tetapi XULRunner memungkinkan Anda menggunakan Javascript dan XML untuk membuat aplikasi, dan jendela peramban adalah salah satu komponen itu, sehingga setelah Anda membuka jendela dasar, kemungkinan besar Anda bisa melakukan apa saja yang diinginkan.

Juga, tergantung pada kecanggihan aplikasi Anda, ada beberapa kerangka kerja "widget" (seperti Dashboard di Mac, Yahoo Widgets, Windows Gadgets) yang pada dasarnya juga merupakan runtime HTML.


2
Saya sangat merekomendasikan melihat XULRunner. Untuk apa yang Anda gambarkan, ini ideal, dan didokumentasikan dengan baik. Chrome juga akan berfungsi dengan baik, saya kira, tetapi saya belum memeriksanya.
Jared Farrish

Pelari XUL adalah kerangka kerja yang mengagumkan dan sangat fleksibel, tetapi tidak terdokumentasi dengan baik seperti yang Anda katakan. Seorang pemula harus banyak menderita untuk memulai sesuatu.
esafwan

10

Lihat Titanium . Baru hari ini saya mengambil aplikasi HTML5 fungsional dan dengan beberapa modifikasi kecil bisa memasukkannya ke Titanium dan mengemasnya untuk Mac, Windows dan Linux.

Dan itu juga mendukung PHP, Python dan Ruby jika aplikasi Anda membutuhkan pemrosesan "sisi server".


Jika Anda menginginkan solusi yang dikemas, saya pikir ini jawabannya.
dylanized

15
Pengalaman saya dengan Titanium sangat buruk - terlihat hebat di luar tetapi diisi dengan bug dan menjadi neraka untuk digunakan dengan sangat cepat. Saya tidak bisa merekomendasikannya.
Damian

3
Saya juga berpikir ini akan menjadi pilihan yang baik tetapi: 1) Saya tidak bisa membuatnya menjalankan "create-new-project / run" sederhana di Linux (Ubuntu 11.10) 2) Titanium Desktop sedang ditransformasikan ke proyek COmmunity-Driven ( itu berarti, kecuali seseorang mengambil kode mereka, ia akan mati)
Luis Lobo Borobia

4
Saya tahu ini sudah tua, tetapi saya baru saja membaca jawaban ini, dan menghabiskan beberapa waktu sampai saya tahu bahwa Titanium Desktop sudah mati. Jadi, bukan pilihan lagi. BTW, saya sedang berpikir tentang membuat sesuatu dengan c # dan chromium tertanam, seperti yang dilakukan github di alatnya untuk windows
NicoGranelli

6
Titanium Desktop telah menjadi TideSDK tidesdk.org
Peacemoon



3

Adobe AIR dimaksudkan untuk memungkinkan Anda bekerja terutama dalam HTML, CSS, dan JavaScript sambil menyediakan aplikasi desktop. (Peringatan: Saya belum benar-benar menggunakannya sendiri.)


1
browser terintegrasi di AIR sudah tua dan tidak akan pernah diperbarui, jadi saya tidak merekomendasikannya (saya menggunakannya di lebih banyak proyek)
simion314

@ simion314: Saya ingin tahu, karena AIR adalah proyek yang sedang berjalan, mengapa Anda mengatakan browser di dalamnya "tidak akan" diperbarui.
TJ Crowder

lihat forums.adobe.com/message/6177332 Adobe bekerja lebih untuk bagian seluler AIR, dan pada seluler mereka menggunakan StageWebView dan mereka tidak akan memperbarui mesin webkit di UDARA, stagewebview dibatasi hanya untuk menampilkan barang, misalnya jika Anda cobalah untuk memuat pustaka javascript kompleks atau aplikasi seperti ckeditor 4, itu akan gagal karena beberapa ketidakcocokan dengan mesin webkit (ada juga yang berhubungan dengan sandboxing tetapi tidak semua)
simion314


2

Hmmm ... mesin virtual untuk HTML5 / CSS / JS ... terdengar seperti browser. :)

Mungkin Adobe AIR akan melakukan triknya, karena didasarkan pada gagasan membawa aplikasi Internet yang kaya ke desktop. Namun saya belum pernah menggunakannya.

Satu hal yang dapat Anda lakukan adalah mengembangkan aplikasi desktop yang sangat mendasar yang menggunakan beberapa jenis kontrol browser web yang telah dikemas sebelumnya (misalnya jika Anda mengembangkan untuk Mac, cukup letakkan WebView di jendela dan tambahkan beberapa kode dasar untuk memuat html Anda pada aplikasi memulai).





1

Saat ini jawabannya adalah solusi yang berbeda untuk setiap platform.

  • Untuk MAC OSX Anda akan membuat Aplikasi Desktop Kakao dengan UIWebView
  • Untuk Windows Anda akan membuat aplikasi desktop .NET dengan komponen browser.

Saya pikir daripada menggunakan windows dengan komponen browser memiliki beberapa keterbatasan (dapat mengakses ke filesystem atau menampilkan popup?), Apakah Anda tahu proyek apa pun selain menggunakan pendekatan ini? ...
clagccs

Jawaban terbaik dan tidak ada yang mengakuinya. Di belakang sebagian besar semua solusi hybrid menggunakan komponen tampilan web yang berperilaku seperti browser. Ini yang Anda butuhkan, dapatkan webview, muat html / css / js dan voila!
Dan Ochiana

1

Anda dapat menggunakan server tertanam seperti Tomcat atau mungkin Apache.

Saya menggunakan kucing jantan untuk aplikasi web java lengkap. Jalankan di dalam browser, tetapi aplikasi harus diinstal. Cara pintas untuk memulai aplikasi, memulai layanan dan membuka browser.

Atau coba gunakan webkit


1

Agak terlambat, tetapi Anda dapat menggunakan versi portabel dari google chrome, dan kemudian membuat aplikasi windows kecil untuk menginstalnya, dan membuat pintasan .ink ke mode --kiosk dan aplikasi.
Agak suka cara pintas aplikasi chrome, tetapi di mana Anda menginstal chrome untuk mereka.


1

Jika Anda hanya membutuhkannya untuk Windows, Anda harus mempertimbangkan Aplikasi HTML (HTA), itu sudah menjadi bagian dari Internet Explorer sejak IE 5 (10+ tahun).

Tidak diperlukan server, pemformatan HTML lengkap, akses penuh ke sumber daya lokal (bahkan port COM / USB), luar biasa. Juga, mudah di-debug dengan Visual Studio, cukup ikat ke MSHTA.exe

Anda dapat mengaktifkan HTML 5 di HTA dengan tag meta berikut:

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

+1 Carilah dukungan Linux dan Mac juga :)
Bhargav Nanekalva
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.