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.