Решения для распространения приложений 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.