Решения для распространения приложений HTML5 как настольных приложений? [закрыто]


141

Какие есть решения для распространения настольных приложений на основе HTML5?

Я хочу иметь возможность распространять свое приложение HTML5 как отдельное настольное приложение в Windows, OSX и Linux. Я хотел бы, чтобы люди могли дважды щелкнуть ярлык значка моего приложения, чтобы запустить мою программу.

Я не хочу, чтобы окно браузера отображалось вообще, только мое приложение. Это возможно?


4
Chrome + полноэкранный
режим

2
В Chrome для Windows есть опция «создать ярлык приложения» в меню гаечных ключей. На рабочем столе будет создана ссылка, открывающая стандартное окно без адресной строки.
6502

3
Есть ли у вас какие-либо другие требования, например, доступ к локальным файлам или другие вещи, которые обычно невозможны в браузере?
Tiemen 08

76
Может кто-нибудь объяснить мне, почему этот вопрос отмечен как неконструктивный ? Он спрашивает, есть ли платформа, ответ объективный: да . И может быть «реализован» с некоторыми возможностями, так почему, собственно, так помечено.
Francesco Belladonna

10
Этот вопрос актуален и актуален, как показывает недавняя статья: clintberry.com/2013/html5-apps-desktop-2013 .
Per Quested Aronsson

Ответы:


75

Приложения HTML5 в 2014 г.

Рамки от chrome / webkit

  • Электрон (бывший Atom Shell)

    Electron - это библиотека с открытым исходным кодом, разработанная GitHub для создания кроссплатформенных настольных приложений с использованием HTML, CSS и JavaScript. Electron достигает этого, объединяя Chromium и Node.js в единую среду выполнения, и приложения могут быть упакованы для Mac, Windows и Linux. ( источник )

    Ребята из github используют это, чтобы предоставить свой редактор кода Atom в качестве приложения. У него есть документированный API и канал справки на официальных форумах по атому.

  • Node-Webkit , самый минимальный подход

    node-webkit - это среда выполнения приложения, основанная на Chromium и node.js. Вы можете писать собственные приложения на HTML и JavaScript с помощью node-webkit. Он также позволяет вам вызывать модули Node.js непосредственно из DOM и позволяет по-новому писать собственные приложения со всеми веб-технологиями.

    За этим стоит Intel (?). Мне сказали, что это очень грубо.

  • Brackets Shell , песочница редактора кода Adobes (и база Adobe Edge)

    Примечание. Оболочка скобок предназначена только для использования в проекте скобок. Хотя некоторые люди определенно добились успеха, используя его в качестве оболочки приложения для других проектов, мы не предоставляем официальной поддержки для этого, и мы не проделали огромную работу, чтобы сделать оболочку приложения легко повторно используемой. Многим, вероятно, будет проще использовать такой проект, как node-webkit, который является более универсальным по дизайну.

    говорит ридми, но, тем не менее, довольно много людей сделали это.

Фреймворки + Инструменты

  • Adobe AIR , как было предложено в других ответах.

    Среда выполнения Adobe® AIR® позволяет разработчикам упаковывать один и тот же код в собственные приложения для настольных компьютеров с Windows и Mac OS, а также для iPhone, iPad, Kindle Fire, Nook Tablet и других устройств Android ™, что составляет более 500 миллионов магазинов мобильных приложений. устройств.

  • Sencha - это компания, которая продает инструменты для разработчиков приложений, включая разработку и распространение приложений html5.

Неактивные подходы

  • Tide SDK ( заархивировано 12 июля 2015 г. на archive.org ), бета-версия, прекращена 12 июля 2015 г.

    http://www.tidesdk.org/

  • XULRunner от Mozilla может помочь вам, но добавляет некоторые накладные расходы.

  • app.js закончился 28 октября 2013 года, так как его превзошел ( https://github.com/rogerwang/node-webkit)[node-webkit] .

    Потому что это просто и в то же время мощно. Используя AppJS, вам не нужно беспокоиться о кросс-платформенном кодировании или изучении новых языков и инструментов. Вы уже знакомы с HTML, CSS и JavaScript. Что лучше этого стека для разработки приложений? Кроме того, AppJS использует Chromium в основе, поэтому вы получаете работающие новейшие API-интерфейсы HTML 5. Итак, сосредоточьтесь на задаче, которую должно решать ваше приложение.

  • Mozilla Prism списана, их слоглайн был:

    Перенос веб-приложений на рабочий стол
    Prism - это приложение, которое позволяет пользователям выделять веб-приложения из своего браузера и запускать их прямо на своем рабочем столе.


7
Mozilla Prism сейчас неактивна
Harshith JV

8
Просто предупредите об Adobe Air. Если вы планируете использовать какое-либо решение для шаблонов javascript (например, Handlebars, Mustache), большинство из них не работают из-за ошибок безопасности, связанных с вызовами javascript new function ().
Джеймс Паркер,

спасибо за эту очень полезную подсказку! К сожалению, у меня еще не было возможности протестировать ни один из приведенных выше примеров. Я просто собрал их путем исследования.
Сэмюэл Херцог

Вы можете заставить ваше приложение работать вне изолированной программной среды безопасности. У меня также была эта проблема с системой шаблонов KendoUI, и я смог ее преодолеть. В любом случае я переключился с Air на Titanium Desktop, но в настоящее время ищу альтернативы, поскольку реализация TD в Windows webkit имеет серьезные проблемы с элементами формы (вводы / раскрывающиеся списки ).
Васко Коста

Вы можете использовать Sentenza Desktop для упаковки веб-приложения HTML5 / CSS3 / JS в приложение Mac OS X (.app). Также доступна библиотека API. Не требует никаких фреймворков (вроде Adobe Air или TideSDK). Поддерживается развертывание Mac App Store.
Beny

15

Вы можете использовать AppJS, который использует Nodejs и Chromium для создания приложений html5 для рабочего стола. проверьте это: http://appjs.com Ссылка на Github: https://github.com/appjs/appjs


1
Аналогичным является node-webkit, у него есть некоторые приятные функции, такие как компиляция вашего javascript с использованием снимка v8. link
pillar15 01

Уведомление об устаревании Проект AppJS не развивался активно несколько лет. Пожалуйста, попробуйте вместо этого NW.js или Electron.
Аарон Франке,

10

Вы можете посмотреть XULRunner от Mozilla. На уровне 10000 футов браузер FireFox представляет собой приложение XULRunner (очевидно, очень сложное, но ...). Но XULRunner позволяет вам использовать Javascript и XML для создания приложений, и окно браузера является одним из этих компонентов, поэтому, когда вы откроете основное окно, вы, вероятно, сможете делать практически все, что захотите.

Кроме того, в зависимости от сложности вашего приложения существует несколько фреймворков «виджетов» (например, Dashboard на Mac, виджеты Yahoo, гаджеты Windows), которые также являются средами выполнения HTML.


2
Я очень рекомендую посмотреть XULRunner. Для того, что вы описываете, он идеален и хорошо задокументирован. Думаю, Chrome тоже будет работать так же хорошо, но я не изучал его.
Джаред Фарриш

XUL runner - отличный фреймворк и очень гибкий, но, как вы говорите, плохо документирован. Новичку придется немало пострадать, чтобы начать работу.
esafwan

10

Обязательно обратите внимание на Titanium . Буквально сегодня я взял функциональное приложение HTML5 и с небольшими изменениями смог поместить его в Titanium и упаковать для Mac, Windows и Linux.

И он также поддерживает PHP, Python и Ruby, если вашему приложению требуется обработка на стороне сервера.


Если вам нужно готовое решение, я думаю, это ответ.
dylanized

15
Мой опыт работы с Titanium был ужасен - он выглядит великолепно снаружи, но наполнен ошибками и очень быстро становится адом для использования. Я не могу это рекомендовать.
Дамиан

3
Я также подумал, что это будет хороший выбор, но: 1) Я не мог заставить его запускать простой «create-new-project / run» в Linux (Ubuntu 11.10) 2) Titanium Desktop преобразовывается в проект, управляемый COmmunity ( это означает, что если кто-то не возьмет их код, он умрет)
Луис Лобо Боробиа

4
Я знаю, что это старый, но я только что прочитал этот ответ и потратил некоторое время, пока не понял, что Titanium Desktop мертв. Так что, больше не вариант. Кстати, я думаю о создании чего-нибудь со встроенным C # и хромом, как это сделал github в своем инструменте для Windows
НикоГранелли

6
Titanium Desktop превратился в TideSDK tidesdk.org
Peacemoon

5

хром может делать то, что видит призма - Инструменты-> Создать ярлык приложения


Не знал, что ... +1
arg20

К сожалению, ярлыки приложений недоступны на Mac.
Шейн Холлоуэй


3

Adobe AIR предназначен для того, чтобы вы могли работать в основном с HTML, CSS и JavaScript, одновременно предоставляя настольное приложение. (Предостережение: я сам этим не пользовался.)


1
встроенный браузер в AIR устарел и никогда не будет обновляться, поэтому я не рекомендую его (я использовал его в других проектах)
simion314

@ simion314: Мне любопытно, поскольку AIR - это постоянный проект, почему вы говорите, что браузер в нем «никогда» не будет обновляться.
TJ Crowder

см. forum.adobe.com/message/6177332 Adobe больше работает с мобильной частью AIR, а на мобильных устройствах они используют StageWebView, и они не будут обновлять движок webkit в AIR, stagewebview ограничивается только отображением материалов, например, если вы попробуйте загрузить сложную библиотеку javascript или приложение, такое как ckeditor 4, это не удастся из-за некоторых несовместимости с движком webkit (некоторые из них связаны с песочницей, но не все)
simion314

3

[Только для Windows] попробуйте подход HTML-приложения (HTA) - просто сохраните файл .html с расширением .hta. Он также предоставляет некоторые дополнительные настройки, позволяющие избавиться от окна браузера, установить уровень доверия для приложения и т. Д. Подробнее здесь: http://en.wikipedia.org/wiki/HTML_Application и здесь http://technet.microsoft. com / en-ca / scriptcenter / dd742317.aspx


2

Хммм ... виртуальная машина для HTML5 / CSS / JS ... звучит как браузер. :)

Возможно, Adobe AIR сделает свое дело, потому что он основан на идее переноса богатых Интернет-приложений на рабочий стол. Однако я никогда им не пользовался.

Одна вещь, которую вы могли бы сделать, - это разработать очень простое настольное приложение, которое использует какой-либо предварительно упакованный элемент управления веб-браузера (например, если вы разрабатываете для Mac, просто перетащите WebView в окно и добавьте базовый код для загрузки вашего html в приложение. запускать).


2

Проверьте этот новый проект от Mozilla. Вы также можете создавать настольные приложения: https://developer.mozilla.org/en/Apps

Подробности здесь: http://hacks.mozilla.org/2012/05/desktop-apps-with-html5-and-the-mozilla-web-runtime/


1
Жаль, что они на самом деле не создают его как приложение без хрома.
Фрэнк

1

Для мобильных телефонов вы можете использовать PhoneGap http://www.phonegap.com/ . Возможно, с дополнительным кодом вы сможете использовать его для рабочего стола.



1

В настоящее время ответ заключается в том, что для каждой платформы используются разные решения.

  • Для MAC OSX вы создадите приложение Cocoa Desktop с UIWebView
  • Для Windows вы создадите настольное приложение .NET с компонентом браузера.

Я думаю, что использование окон с компонентом браузера имеет несколько ограничений (может получить доступ к файловой системе или показать всплывающее окно?). Знаете ли вы какой-либо проект, в котором используется этот подход? ...
clagccs

Лучший ответ, и никто его не признает. Сзади почти все гибридные решения используют компонент веб-просмотра, который ведет себя так же, как браузер. Это все, что вам нужно, откройте веб-просмотр, загрузите html / css / js и вуаля!
Дэн Очиана,

1

Вы можете использовать встроенный сервер, например Tomcat или Apache.

Я использую tomcat для полноценного веб-приложения на Java. Запустите в браузере, но приложение необходимо установить. Ярлык для запуска приложения, запуска службы и открытия браузера.

Или попробуйте использовать webkit


1

Немного поздно, но вы можете использовать портативную версию google chrome, а затем создать небольшое приложение для Windows для его установки и создать ярлык .ink для его --kiosk и режима приложения.
Вроде как ярлыки приложений Chrome, но там, где вы устанавливаете хром для них.


1

Если он вам просто нужен для Windows, вам следует рассмотреть HTML-приложения (HTA), он был частью Internet Explorer с IE 5 (10+ лет).

Сервер не требуется, полное форматирование HTML, полный доступ к локальным ресурсам (даже портам COM / USB), отлично. Кроме того, легко отлаживать с помощью Visual Studio, просто привяжите к MSHTA.exe.

Вы можете включить HTML 5 в HTA с помощью следующего метатега:

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

+1 Ищите поддержку Linux и Mac тоже :)
Бхаргав Нанекалва
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.