Atualize do ASP.NET MVC e da API Web para o ASP.NET Core MVC

Este artigo mostra como começar a migrar um projeto ASP.NET MVC para ASP.NET Core MVC. No processo, ele destaca mudanças relacionadas a ASP.NET MVC.

A migração de ASP.NET MVC é um processo de várias etapas. Este artigo abrange:

• Configuração inicial.
• Controladores básicos e visualizações.
• Conteúdo estático.
• Dependências do lado do cliente.

Para migrar a configuração e Identity o código, consulte Migrar configuração para o ASP.NET Core e Migrar autenticação e Identity para o ASP.NET Core.

Prerequisites

• Visual Studio 2019 16.4 ou posterior com a carga de trabalho de desenvolvimento Web e ASP.NET
• SDK do .NET Core 3.1

Criar o projeto inicial de ASP.NET MVC

Crie um exemplo ASP.NET projeto MVC no Visual Studio para migrar:

1. No menu Arquivo, selecione Novo>Projeto.
2. Selecione ASP.NET Aplicativo Web (.NET Framework) e, em seguida, selecione Avançar.
3. Nomeie o projeto WebApp1 para que o espaço de nomes corresponda ao projeto ASP.NET Core criado na próxima etapa. Selecione Criar.
4. Seleciona MVC e depois seleciona Criar.

Criar o projeto ASP.NET Core

Crie uma nova solução com um novo projeto ASP.NET Core para migrar para:

1. Inicie uma segunda instância do Visual Studio.
2. No menu Arquivo, selecione Novo>Projeto.
3. Selecione ASP.NET aplicativo Web principal e, em seguida, selecione Avançar.
4. Na caixa de diálogo Configurar seu novo projeto , nomeie o projeto WebApp1.
5. Defina o local para um diretório diferente do projeto anterior para usar o mesmo nome do projeto. Usar o mesmo namespace facilita a cópia de código entre os dois projetos. Selecione Criar.
6. Na caixa de diálogo Criar um novo aplicativo Web ASP.NET Core, certifique-se de que .NET Core e ASP.NET Core 3.1 estejam selecionados. Selecione o modelo de projeto Aplicativo Web (Modelo-View-Controller ) e selecione Criar.

Configurar o site ASP.NET Core para usar o MVC

No ASP.NET Core 3.0 ou projetos posteriores, o .NET Framework não é mais uma estrutura de destino suportada. Seu projeto deve ter como destino o .NET Core. A estrutura partilhada do ASP.NET Core, que inclui o MVC, faz parte da instalação da plataforma .NET Core runtime. A estrutura compartilhada é referenciada automaticamente ao usar o Microsoft.NET.Sdk.Web SDK no arquivo de projeto:

<Project Sdk="Microsoft.NET.Sdk.Web">

Para mais informações, consulte a Referência do Framework.

No ASP.NET Core, a classe Startup:

• Substitui Global.asax.
• Lida com todas as tarefas de inicialização do aplicativo.

Para obter mais informações, consulte arranque da aplicação no ASP.NET Core.

No projeto ASP.NET Core, abra o Startup.cs arquivo:

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddControllersWithViews();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }
        app.UseHttpsRedirection();
        app.UseStaticFiles();

        app.UseRouting();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller=Home}/{action=Index}/{id?}");
        });
    }
}

ASP.NET Core aplicativos devem optar por recursos de framework com middleware. O código gerado por modelo anterior adiciona os seguintes serviços e middleware:

• O AddControllersWithViews método de extensão registra o suporte ao serviço MVC para controladores, recursos relacionados à API e exibições. Para obter mais informações sobre as opções de registro do serviço MVC, consulte Registro do serviço MVC
• O método de extensão UseStaticFiles adiciona o manipulador de arquivo estático Microsoft.AspNetCore.StaticFiles. O UseStaticFiles método de extensão deve ser chamado antes de UseRouting. Para obter mais informações, consulte ficheiros estáticos no ASP.NET Core.
• O UseRouting método de extensão adiciona roteamento. Para obter mais informações, consulte Roteamento no ASP.NET Core.

Essa configuração existente inclui o que é necessário para migrar o exemplo ASP.NET projeto MVC. Para obter mais informações sobre as opções de middleware do ASP.NET Core, consulte Inicialização do aplicativo no ASP.NET Core.

Migrar controladores e visualizações

No projeto ASP.NET Core, uma nova classe de controlador vazia e uma nova classe de exibição seriam adicionadas para servir como espaços reservados usando os mesmos nomes do controlador e classes de exibição em qualquer projeto MVC ASP.NET a ser migrado.

O projeto ASP.NET Core WebApp1 já inclui um controlador de exemplo mínimo e uma vista com o mesmo nome do projeto ASP.NET MVC. Por isso, estes servirão como marcadores para o controlador ASP.NET MVC e as vistas a serem migradas do projeto ASP.NET MVC WebApp1.

1. Copie os métodos do ASP.NET MVC HomeController para substituir os novos métodos ASP.NET Core HomeController . Não há necessidade de alterar o tipo de retorno dos métodos de ação. O tipo de retorno do método de ação do controlador do modelo embutido do ASP.NET MVC é ActionResult; já no ASP.NET Core MVC, os métodos de ação retornam IActionResult. ActionResult implementa IActionResult.
2. No projeto ASP.NET Core, clique com o botão direito no diretório Vistas/Home , selecione Adicionar>Item Existente.
3. Na caixa de diálogo Adicionar Item Existente, navegue até o diretório do projeto ASP.NET MVC Home.
4. Selecione , About.cshtmlContact.cshtml, e Index.cshtmlRazor visualize ficheiros, depois selecione Adicionar, substituindo os ficheiros existentes.

Para obter mais informações, consulte Manipular solicitações com controladores no ASP.NET Core MVC e Views no ASP.NET Core MVC.

Testar cada método

Cada ponto de extremidade do controlador pode ser testado, no entanto, o layout e os estilos são abordados posteriormente no documento.

1. Execute o aplicativo ASP.NET Core.
2. Invoque as exibições renderizadas do navegador no aplicativo ASP.NET Core em execução substituindo o número da porta atual pelo número da porta usado no projeto ASP.NET Core. Por exemplo, https://localhost:44375/home/about.

Migrar conteúdo estático

Em ASP.NET MVC 5 ou anterior, o conteúdo estático era hospedado a partir do diretório raiz do projeto Web e era misturado com arquivos do lado do servidor. No ASP.NET Core, os ficheiros estáticos são armazenados na diretoria raiz web do projeto. O diretório padrão é {content root}/wwwroot, mas pode ser alterado. Para obter mais informações, consulte ficheiros estáticos no ASP.NET Core.

Copie o conteúdo estático do projeto ASP.NET MVC WebApp1 para o wwwroot diretório no projeto ASP.NET Core WebApp1 :

1. No projeto ASP.NET Core, clique com o botão direito no wwwroot diretório e selecione Adicionar>Item Existente.
2. Na caixa de diálogo Adicionar Item Existente , navegue até o projeto ASP.NET MVC WebApp1 .
3. Selecione o favicon.ico ficheiro, depois selecione Adicionar, substituindo o ficheiro existente.

Migrar os arquivos de layout

Copie os arquivos de layout do projeto ASP.NET MVC para o projeto ASP.NET Core:

1. No projeto ASP.NET Core, clique com o botão direito no Views diretório e selecione Adicionar>Item Existente.
2. Na caixa de diálogo Adicionar Item Existente, navegue até o diretório do projeto ASP.NET Views.
3. Selecione o _ViewStart.cshtml ficheiro e depois selecione Adicionar.

Copie os arquivos de layout compartilhados do projeto MVC ASP.NET para o projeto ASP.NET Core:

1. No projeto ASP.NET Core, clique com o botão direito no Views/Shared diretório e selecione Adicionar>Item Existente.
2. Na caixa de diálogo Adicionar Item Existente, navegue até o diretório do projeto ASP.NET Views/Shared.
3. Selecione o _Layout.cshtml ficheiro, depois selecione Adicionar, substituindo o ficheiro existente.

No projeto ASP.NET Core, abra o _Layout.cshtml arquivo. Faça as seguintes alterações para corresponder ao código concluído mostrado abaixo:

Atualize a inclusão do Bootstrap CSS para corresponder ao código concluído abaixo:

1. Substitua @Styles.Render("~/Content/css") por um <link> elemento para carregar bootstrap.css (veja abaixo).
2. Remover @Scripts.Render("~/bundles/modernizr").

A marcação de substituição concluída para a inclusão do Bootstrap CSS:

<link rel="stylesheet"
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.css"
    integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
    crossorigin="anonymous">

Atualize a inclusão do jQuery e do Bootstrap JavaScript para corresponder ao código concluído abaixo:

1. Substitua @Scripts.Render("~/bundles/jquery") por um <script> elemento (veja abaixo).
2. Substitua @Scripts.Render("~/bundles/bootstrap") por um <script> elemento (veja abaixo).

A marcação de substituição concluída para a inclusão de JavaScript do jQuery e do Bootstrap:

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"
    integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

O arquivo atualizado _Layout.cshtml é mostrado abaixo:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    <link rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
          crossorigin="anonymous">
</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                    <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
        </footer>
    </div>

    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    @RenderSection("scripts", required: false)
</body>
</html>

Visualize o site no navegador. Deve renderizar com os estilos previstos aplicados corretamente.

Configurar agregação e minificação

ASP.NET Core é compatível com várias soluções open-source de agrupamento e minificação, como o WebOptimizer e outras bibliotecas semelhantes. ASP.NET Core não fornece uma solução nativa de agrupamento e minificação. Para obter informações sobre como configurar a agregação e a minificação, consulte Agregação e minificação.

Resolver erros HTTP 500

Há muitos problemas que podem causar uma mensagem de erro HTTP 500 que não contém informações sobre a origem do problema. Por exemplo, se o Views/_ViewImports.cshtml arquivo contiver um namespace que não existe no projeto, um erro HTTP 500 será gerado. Por defeito, nas aplicações ASP.NET Core, a UseDeveloperExceptionPage extensão é adicionada ao IApplicationBuilder e executada quando o ambiente é Desenvolvimento. Isso é detalhado no código a seguir:

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddControllersWithViews();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }
        app.UseHttpsRedirection();
        app.UseStaticFiles();

        app.UseRouting();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller=Home}/{action=Index}/{id?}");
        });
    }
}

O ASP.NET Core converte exceções não tratadas em respostas de erro HTTP 500. Normalmente, os detalhes do erro não são incluídos nessas respostas para evitar a divulgação de informações potencialmente confidenciais sobre o servidor. Para obter mais informações, consulte Página de exceção do desenvolvedor.

Próximos passos

• <identity.md>

Recursos adicionais

• ASP.NET Núcleo Blazor
• Ajuda de Etiquetas no ASP.NET Core