.NET

1 jun, 2015

Como executar uma aplicação ASP.NET 5 no pen-drive via linha de comando?

Publicidade

O desenvolvedor de aplicações web está acostumado a executar uma aplicação sempre no servidor ou localmente, afinal, sempre há um servidor web como o IIS (Internet information Server). No entanto, agora com a nova versão do ASP.NET 5 e do Framework Core, ganhamos um novo horizonte de desenvolvimento. O objetivo deste artigo é mostrar como desenvolver uma aplicação ASP.NET 5 no Visual Studio 2015, preparar as configurações do servidor web, publicar em uma pasta na máquina local e, em seguida, copiar num pen-drive e executar a aplicação web via linha de comando.

O pré-requisito para este artigo é qualquer versão do Visual Studio 2015. Eu usei a versão Enterprise 2015, versão 14.0.22823.1 D14REL.

Criar o projeto ASP.NET 5

O primeiro passo é criar uma aplicação ASP.NET 5. Então, abra o VS 2015, selecione File / New Project (Ctrl + Shift + N). Na janela aberta, selecione a linguagem Visual C#, a categoria web e nos templates, ASP.NET Web Application. O nome do projeto será ASP5PenDrive, conforme a figura 1.

Figura 1 – Novo projeto
Figura 1 – Novo projeto

Clique no botão OK, e na janela aberta, temos diversos templates tanto do ASP.NET 4.6 quanto do ASP.NET 5. Neste caso, selecione Web Site nos templates do ASP.NET 5, conforme a figura 2. Veja que há outros dois templates, um para uma aplicação vazia (Empty) e outra para Web API, mas como quero que já tenham as Views e os Controllers padrão prontos, usei o web site.

Figura 2 – Template do projeto Web Site
Figura 2 – Template do projeto Web Site

Clique no botão OK e aguarde a criação do projeto, que já assume uma estrutura de projetos MVC, onde temos os Controllers, as Views e Models. De acordo com a nova estrutura dos projetos ASP.NET 5, abra o arquivo project.json e verifique que o ponto de entrada da aplicação é o que está declarado no webroot, neste caso wwwroot. Agora, o mais importante para o entendimento deste artigo é a declaração do web na sessão commands, o qual aponta para o servidor WebListener e a URL padrão é http://localhost:5000, informando assim qual será o Host. Já adianto a todos que qualquer aplicação ASP.NET 5 pode ser executada num servidor baseado no WebListener ou no Kestrel para Mac Ox ou Linux.

{
  "webroot": "wwwroot",
  "userSecretsId": "aspnet5-ASP5PenDrive-0ee28ada-21db-46aa-b900-d3a6b993cf7e",
  "version": "1.0.0-*",

  "dependencies": {
    "EntityFramework.SqlServer": "7.0.0-beta4",
    "EntityFramework.Commands": "7.0.0-beta4",
    "Microsoft.AspNet.Mvc": "6.0.0-beta4",
    "Microsoft.AspNet.Mvc.TagHelpers": "6.0.0-beta4",
    "Microsoft.AspNet.Authentication.Cookies": "1.0.0-beta4",
    "Microsoft.AspNet.Authentication.Facebook": "1.0.0-beta4",
    "Microsoft.AspNet.Authentication.Google": "1.0.0-beta4",
    "Microsoft.AspNet.Authentication.MicrosoftAccount": "1.0.0-beta4",
    "Microsoft.AspNet.Authentication.Twitter": "1.0.0-beta4",
    "Microsoft.AspNet.Diagnostics": "1.0.0-beta4",
    "Microsoft.AspNet.Diagnostics.Entity": "7.0.0-beta4",
    "Microsoft.AspNet.Identity.EntityFramework": "3.0.0-beta4",
    "Microsoft.AspNet.Server.IIS": "1.0.0-beta4",
    "Microsoft.AspNet.Server.WebListener": "1.0.0-beta4",
    "Microsoft.AspNet.StaticFiles": "1.0.0-beta4",
    "Microsoft.AspNet.Tooling.Razor": "1.0.0-beta4",
    "Microsoft.Framework.ConfigurationModel.Json": "1.0.0-beta4",
    "Microsoft.Framework.ConfigurationModel.UserSecrets": "1.0.0-beta4",
    "Microsoft.Framework.CodeGenerators.Mvc": "1.0.0-beta4",
    "Microsoft.Framework.Logging": "1.0.0-beta4",
    "Microsoft.Framework.Logging.Console": "1.0.0-beta4",
    "Microsoft.VisualStudio.Web.BrowserLink.Loader": "14.0.0-beta4"
  },

  "commands": {
    "web": "Microsoft.AspNet.Hosting --server Microsoft.AspNet.Server.WebListener --server.urls http://localhost:5000",
    "gen": "Microsoft.Framework.CodeGeneration",
    "ef":  "EntityFramework.Commands"
  },

  "frameworks": {
    "dnx451": { },
    "dnxcore50": { }
  },

  "exclude": [
    "wwwroot",
    "node_modules",
    "bower_components"
  ],
  "publishExclude": [
    "node_modules",
    "bower_components",
    "**.xproj",
    "**.user",
    "**.vspscc"
  ],
  "scripts": {
    "postrestore": [ "npm install", "bower install" ],
    "prepare": [ "gulp copy" ]
  }
}

Para efeito de execução de projeto, pressione F5 para executar a aplicação no browser. O servidor padrão será o IIS Express. Veja na figura 3 que está tudo rodando no browser. Você pode navegar em qualquer página que conste no menu (Home, About, Contact).

Figura 3 – Projeto em execução no browser
Figura 3 – Projeto em execução no browser

Neste momento, abra o Windows Explorer exatamente na pasta onde você criou o projeto. Note que na raiz não há a pasta BIN, então, onde que está a DLL do projeto? Veja que há uma pasta chamada SRC (Source) contendo toda a estrutura da aplicação, e dentro do wwwroot, temos a pasta BIN. Conforme a figura 4, veja que o conteúdo da pasta BIN é apenas uma DLL chamada AspNet.Loader. Isto é resultado do compilador Roslyn que o framework atual consiste, ou seja, tudo é compilado em tempo de execução. Isto mesmo, você pode fazer um teste na janela Immediate Window do VS.NET 2015, criando qualquer fórmula, por exemplo, 1+1, tecle ENTER e ele já te dará o resultado. Isto tudo sem precisar rodar a aplicação.

Figura 4 – Conteúdo da pasta BIN
Figura 4 – Conteúdo da pasta BIN

Mas eu disse que o ponto de entrada desta aplicação é o endereço http://localhost:5000. Então, por que o browser mostra http://localhost:4834? Isto está declarado nas propriedades do projeto, na guia Debug, Port: 4834, conforme a figura 5. Como executamos via IIS Express, a partir do VS 2015, ele assume esta porta.

Figura 5 – Port da execução
Figura 5 – Port da execução

Qual plataforma escolho para rodar a aplicação?

Quando criamos um projeto ASP.NET 5, automaticamente temos duas opções de execução, ou no framework dnx451 ou dnxcore50. Isto está declarado na lista de frameworks no arquivo project.json. O dnx significa .NET Execution Environment, ou seja, qual o ambiente de execução do .NET. O dnx451 aponta para o .NET framework 4.5.1 completo, com todas as referências de namespaces. Já o dnxcore50 aponta apenas para o Core 5.0, que é um framework mais enxuto para o ASP.NET 5. E, claro que você pode adicionar ou remover outras dependências de namespaces através de injeção de dependência, mas isto é tópico para outro artigo.

"frameworks": {
    "dnx451": { },
    "dnxcore50": { }
  },

E como agora tudo é via injeção de dependência, se você excluir qualquer uma destas duas linhas e salvar o arquivo, automaticamente o framework excluído será desinstalado na lista de References, conforme a figura 6. Vale dizer que o mesmo processo se aplica para instalação de qualquer outro framework.

Figura 6 – Lista de frameworks instalados no References
Figura 6 – Lista de frameworks instalados no References

Sendo assim, nas propriedades do projeto, abra a guia Application, selecione o checkbox “Use specific DNX version” e, em Platform, selecione “.NET Core”, conforme a figura 7.

Figura 7 – Plataforma .NET Core
Figura 7 – Plataforma .NET Core

E, já que iremos rodar no pen-drive, vamos alterar um texto qualquer para visualizarmos o resultado. Abra o arquivo Index.cshtml que está na pasta Views\Home, localize o texto “This application consists of:” e altere para “App executada no Pen-Drive”.

<h2>@*This application consists of:*@</h2>
<h2>App executada no Pen-Drive:</h2>

Salve tudo, selecione o menu Build / Build Solution e veja na linha de Status que o Build foi completado com sucesso. Se você mudou algo no projeto e não compilou com sucesso, arrume o erro até que tudo esteja 100%.

Publicar a aplicação

Até aqui sabemos que a aplicação está pronta para ser executada em qualquer servidor que suporte o ASP.NET 5. No entanto, precisamos publicar a aplicação numa pasta local para que possamos copiá-la para um pen-drive. Sendo assim, selecione o menu Build / Publish ASP5PenDrive. Será aberta a janela de acordo com a figura 8, então, selecione a opção File System. Afinal, basta uma publicação local. O nome do Profile é MeuDeploy.

Figura 8 – Profile da publicação
Figura 8 – Profile da publicação

Clique no botão OK e aponte para a pasta local a ser feita a publicação c:\temp\ArtigoASP5, conforme a figura 9.

Figura 9 – Pasta para o deploy
Figura 9 – Pasta para o deploy

Clique no botão Publish e aguarde a publicação completa na pasta de destino. Abra a janela Output e veja se o processo foi finalizado com sucesso. Você terá as informações similares com as seguintes linhas:

Connecting to c:\temp\ArtigoASP5...
rmdir /S /Q "C:\Users\Renato\AppData\Local\Temp\PublishTemp\"
Environment variables:
Path=C:\ProjetosASPNET5\ASP5PenDrive\src\ASP5PenDrive\.\node_modules\.bin;C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\\Extensions\Microsoft\Web Tools\External;%PATH%;C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\\Extensions\Microsoft\Web Tools\External\git
C:\Users\Renato\.dnx\runtimes\dnx-clr-win-x86.1.0.0-beta4\bin\dnu.cmd publish "C:\ProjetosASPNET5\ASP5PenDrive\src\ASP5PenDrive" --out "C:\Users\Renato\AppData\Local\Temp\PublishTemp" --configuration Release --runtime dnx-coreclr-win-x86.1.0.0-beta4 --wwwroot-out "wwwroot" --quiet
[10:01:24] Using gulpfile C:\ProjetosASPNET5\ASP5PenDrive\src\ASP5PenDrive\gulpfile.js
[10:01:24] Starting 'clean'...
[10:01:24] Finished 'clean' after 27 ms
[10:01:24] Starting 'copy'...
[10:01:24] Finished 'copy' after 25 ms
Time elapsed 00:00:02.8077158
Publishing with publish method [FileSystem]
Publishing files to c:\temp\ArtigoASP5
Executing command ["C:\Program Files (x86)\IIS\Microsoft Web Deploy V3\msdeploy.exe" -source:contentPath='C:\Users\Renato\AppData\Local\Temp\PublishTemp\' -dest:contentPath='c:\temp\ArtigoASP5' -verb:sync -enableRule:DoNotDeleteRule -retryAttempts:2 -disablerule:BackupRule]
Informa‡äes: Adicionando o diret¢rio (c:\temp\ArtigoASP5\approot).
Informa‡äes: Adicionando o arquivo (c:\temp\ArtigoASP5\approot\global.json).
...
Total de altera‡äes: 1503 (1503 adicionados(as), 0 exclu¡dos(as), 0 atualizado(as), 0 parƒmetros alterados, 70790056 bytes copiados)
Web App was published successfully file:///c:/temp/ArtigoASP5

Copiar e executar no pen-drive

Agora que já temos a aplicação publicada na pasta c:\temp\ArtigoASP5, abra-a no Windows Explorer, insira um pen-drive na sua máquina e copie toda a pasta para o mesmo. Veja que o conteúdo na raiz contém vários arquivos com extensão “cmd”, os quais são para executar via linha de comando, conforme a figura 10. Uma curiosidade é a pasta BIN, que contém apenas o arquivo AspNet.Loader.dll.

Figura 10 – Estrutura dos arquivos
Figura 10 – Estrutura dos arquivos

Na lista de arquivos da pasta ArtigoASP5, no Pend-Drive, há o arquivo chamado web.cmd. Dê um duplo clique nele e veja que é aberta a janela de Prompt, informando que o servidor web está pronto, ou seja, mostra a mensagem Started, conforme a figura 11.

Figura 11 – Servidor pronto para execução
Figura 11 – Servidor pronto para execução

Agora se prepare para a emoção, abra o browser, insira o endereço http://localhost:5000 e tecle ENTER para ver o resultado, conforme a figura 12.

Figura 12 – Aplicação ASP.NET 5 rodando no Pen-Drive
Figura 12 – Aplicação ASP.NET 5 rodando no Pen-Drive

Você pode navegar à vontade na aplicação, ir para as páginas de contato e about. No entanto, se você fechar a janela de comando para interromper o servidor web e tentar navegar na sua aplicação, irá notar uma mensagem de erro, dizendo que ela não está disponível.

Conclusão

Perceba o quão independente uma aplicação web se tornou. Você pode executá-la em qualquer servidor Windows, Linux ou Mac Ox – basta ter o servidor web instalado. O fato da Microsoft disponibilizar tudo isto via Open Source ajuda todos os desenvolvedores, independente de plataforma, a executar aplicações ASP.NET em todos os lugares. Farei um estudo mais aprofundado sobre os servidores e os comandos/ferramentas a serem usados em outro artigo.

Agradeço a oportunidade de poder compartilhar o conhecimento deste artigo. Qualquer dúvida e preparação de times de desenvolvimento, por favor me contate.