Soluções para distribuir aplicativos HTML5 como aplicativos de desktop? [fechadas]


141

Quais são algumas soluções para distribuir um aplicativo de desktop baseado em HTML5?

Quero poder distribuir meu aplicativo HTML5 como um aplicativo de desktop independente no Windows, OSX e Linux. Gostaria que as pessoas pudessem clicar duas vezes no atalho do ícone do aplicativo para executar o meu programa.

Não quero que a janela do navegador seja exibida, apenas meu aplicativo. Isso é possível?


4
Chrome + Fullscreen funciona bem
— PostMan 02/02

2
O Chrome no Windows possui uma opção "criar atalho para aplicativos" no menu de ferramentas. Ele criará um link na área de trabalho que abre a janela padrão sem barra de endereço.
— 6502

3
Você tem outros requisitos, como acessar arquivos locais ou outras coisas que normalmente não são possíveis no navegador?
— Tiemen 8/08

76
Alguém pode me explicar por que essa pergunta está marcada como não construtiva ? Ele está perguntando se existe uma plataforma, a resposta é objetiva: sim . E poderia ser "implementado" com algumas possibilidades, então por que está marcado dessa maneira, realmente.
— Francesco Belladonna

10
Esta pergunta é relevante e tópica - como mostra este artigo recente: clintberry.com/2013/html5-apps-desktop-2013 .
— Por Aronsson consultado 10/10

Respostas:


75

Aplicativos HTML5 em 2014

Quadros por chrome / webkit

  • Elétron (antigo Atom Shell)

    O Electron é uma biblioteca de código aberto desenvolvida pelo GitHub para criar aplicativos de desktop de plataforma cruzada com HTML, CSS e JavaScript. A Electron realiza isso combinando o Chromium e o Node.js em um único tempo de execução, e os aplicativos podem ser empacotados para Mac, Windows e Linux. ( fonte )

    O pessoal do github usa isso para fornecer seu editor de código Atom como um aplicativo. Ele possui uma API documentada e um canal de ajuda nos fóruns oficiais sobre átomos.

  • Node-Webkit , a abordagem mais mínima

    O node-webkit é um tempo de execução do aplicativo baseado no Chromium e no node.js. Você pode escrever aplicativos nativos em HTML e JavaScript com o node-webkit. Ele também permite que você chame os módulos Node.js. diretamente do DOM e permite uma nova maneira de escrever aplicativos nativos com todas as tecnologias da Web.

    A Intel está por trás disso (?). Foi-me dito que é muito difícil nas bordas.

  • Brackets Shell , a caixa de areia do editor de código do Adobes (e a base do Adobe Edge)

    Nota: O brackets-shell é mantido apenas para uso pelo projeto Brackets. Embora algumas pessoas tenham tido sucesso ao usá-lo como um shell de aplicativo para outros projetos, não fornecemos nenhum suporte oficial para isso e não fizemos muito trabalho para tornar o shell de aplicativo facilmente reutilizável. Muitas pessoas provavelmente acharão mais fácil usar um projeto como o node-webkit, que é mais genérico por design.

    diz o leia-me, mas há muitas pessoas por aí que fizeram isso, no entanto.

Frameworks + Ferramentas

  • Adobe AIR , como outras respostas sugeridas.

    O tempo de execução do Adobe® AIR® permite que os desenvolvedores empacotem o mesmo código em aplicativos nativos para desktops Windows e Mac OS, bem como iPhone, iPad, Kindle Fire, Nook Tablet e outros dispositivos Android ™, atingindo as lojas de aplicativos móveis por mais de 500 milhões dispositivos.

  • A Sencha é uma empresa que vende ferramentas para desenvolvedores de aplicativos, incluindo desenvolvimento e distribuição de aplicativos html5.

Abordagens inativas


7
Mozilla Prism está inativo agora
— Harshith JV

8
Apenas um alerta sobre o Adobe Air. Se você planeja usar qualquer tipo de solução de modelo javascript (por exemplo, guidão, bigode), a maioria deles não funciona devido a erros de segurança relacionados à nova chamada javascript da função ().
— James Parker

obrigado por essa dica muito útil! infelizmente não tive a oportunidade de testar nenhum dos exemplos listados acima ainda. Apenas os colecionei por meio de pesquisas.
— Samuel Herzog

Você pode fazer com que seu aplicativo seja executado fora do tamanho da caixa de proteção de segurança. De qualquer maneira, mudei do Air para o Titanium Desktop, mas atualmente estou procurando alternativas, já que a implementação do TD do webkit do Windows tem sérios problemas com os elementos do formulário (entradas / dropdowns). )
— Vasco Costa

Você pode considerar que o Sentenza Desktop empacote o aplicativo da web HTML5 / CSS3 / JS no aplicativo Mac OS X (.app). Uma biblioteca de API também está disponível. Não requer estruturas (como Adobe Air ou TideSDK). Implantação da Mac App Store suportada.
— Beny 07/02


10

Você pode querer olhar para o XULRunner do Mozilla. Em um nível de 10000 pés, o navegador FireFox é um aplicativo XULRunner (obviamente um muito sofisticado, mas ...). Mas o XULRunner permite que você use Javascript e XML para criar aplicativos, e a janela do navegador é um desses componentes; portanto, quando você abre sua janela básica, provavelmente pode fazer praticamente o que quiser.

Além disso, dependendo da sofisticação do seu aplicativo, existem várias estruturas de "widget" (como o Painel no Mac, Yahoo Widgets, Windows Gadgets), que também são basicamente tempos de execução em HTML.


2
Eu recomendo olhar para o XULRunner. Para o que você descreve, é ideal e bem documentado. O Chrome também funcionaria da mesma forma, suponho, mas ainda não o examinei.
— Jared Farrish

O XUL runner é uma estrutura incrível e muito flexível, mas não está bem documentada, como você diz. Um novato terá que sofrer muito para começar a coisa.
— esafwan # 03

10

Definitivamente confira Titanium . Ainda hoje, peguei um aplicativo HTML5 funcional e, com algumas pequenas modificações, fui capaz de soltá-lo no Titanium e empacotá-lo para Mac, Windows e Linux.

E também suporta PHP, Python e Ruby se o seu aplicativo exigir processamento "do lado do servidor".


Se você deseja uma solução pré-empacotada, acho que esta é a resposta.
— dilanizado em 26/11/11

15
Minhas experiências com o Titanium foram terríveis - parecem ótimas por fora, mas estão cheias de insetos e se tornam um inferno para serem usadas muito rapidamente. Eu não posso recomendar.
— Damian

3
Eu também pensei que seria uma boa escolha, mas: 1) Não consegui fazê-lo executar um simples "criar-novo-projeto / executar" no Linux (Ubuntu 11.10) 2) O Titanium Desktop está sendo transformado em um projeto orientado para a comunidade ( isso significa que, a menos que alguém toma o seu código ele irá morrer)
— Luis Lobo Borobia

4
Sei que isso é antigo, mas acabei de ler esta resposta e passei algum tempo até descobrir que o Titanium Desktop estava morto. Portanto, não é mais uma opção. BTW, eu estou pensando em criar algo com c # e cromo incorporado, como github fez em sua ferramenta para Windows
— NicoGranelli

6
O Titanium Desktop tornou-se TideSDK tidesdk.org
— Peacemoon 28/06

5

o chrome pode fazer o que o prisma faz Ver - Ferramentas-> Criar atalho do aplicativo


Não sabia que ... +1
— arg20:

Infelizmente, os atalhos de aplicativos não estão disponíveis no Mac.
— Shane Holloway


3

O Adobe AIR destina-se a permitir que você trabalhe principalmente em HTML, CSS e JavaScript enquanto fornece um aplicativo de desktop. (Advertência: eu realmente não o usei.)


1
o navegador integrado no AIR é antiga e nunca será atualizado, então eu não recomendo (eu usei-o em mais projetos)
— simion314

@ simion314: Estou curioso, como o AIR é um projeto em andamento, por que você diz que o navegador nele "nunca" será atualizado.
— TJ Crowder

consulte forums.adobe.com/message/6177332 A Adobe funciona mais para a parte móvel do AIR e, no celular, eles usam o StageWebView e não atualizam o mecanismo do webkit no AIR, a stagewebview é limitada apenas à exibição de itens, por exemplo, se você tentar carregar uma biblioteca complexa javascript ou aplicativo como ckeditor 4 ele irá falhar por causa de algumas incompatibilidades com o motor webkit (alguns estão relacionados com o sandboxing mas não todos)
— simion314


2

Hmmm ... uma máquina virtual para HTML5 / CSS / JS ... soa como um navegador. :)

Talvez o Adobe AIR faça o truque, porque é baseado na idéia de trazer aplicativos ricos da Internet para a área de trabalho. Eu nunca usei, no entanto.

Uma coisa que você pode fazer é desenvolver um aplicativo de desktop muito básico que use algum tipo de controle pré-empacotado do navegador da web (por exemplo, se você estiver desenvolvendo para um Mac, basta soltar um WebView na janela e adicionar algum código básico para carregar seu html no aplicativo comece).





1

Atualmente, a resposta é que existem soluções diferentes para cada plataforma.

  • Para MAC OSX Você criará um aplicativo Cocoa Desktop com um UIWebView
  • Para o Windows, você criará um aplicativo de desktop .NET com um componente do navegador.

Eu acho que o uso de janelas com um componente navegador tem várias limitações (pode aceder ao sistema de arquivos ou programa de pop-up?), Você conhece algum projeto do que usar essa abordagem ...?
— clagccs

Melhor resposta e ninguém a reconhece. Na parte de trás, principalmente todas as soluções híbridas usam um componente de visualização na web que se comporta exatamente como um navegador. É tudo o que você precisa, obtenha uma visualização na web, carregue o html / css / js e pronto!
— 22817 Dan Ochiana

1

Você pode usar um servidor incorporado como o Tomcat ou talvez o Apache.

Eu uso o tomcat para um aplicativo Web Java completo. Execute o navegador interno, mas o aplicativo precisa estar instalado. O atalho para iniciar o aplicativo, inicie o serviço e abra o navegador.

Ou tente usar o webkit


1

Um pouco tarde, mas você pode usar uma versão portátil do google chrome e, em seguida, criar um aplicativo Windows pequeno para instalá-lo e criar um atalho .ink no modo --kiosk e app.
Como os atalhos de aplicativos do Chrome, mas onde você instala o Chrome para eles.


1

Se você precisa apenas do Windows, considere os Aplicativos HTML (HTA), ele faz parte do Internet Explorer desde o IE 5 (mais de 10 anos).

Não é necessário servidor, formatação HTML completa, acesso total aos recursos locais (até portas COM / USB), incrível. Além disso, fácil de depurar com o Visual Studio, basta vincular ao MSHTA.exe

Você pode ativar o HTML 5 nos HTAs com a seguinte metatag:

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

+1 Olhe para Linux e Mac apoiar também :)
— Bhargav Nanekalva
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.