【问题标题】:Publish ASP.NET Core 2.1 and Angular 6 project to Azure将 ASP.NET Core 2.1 和 Angular 6 项目发布到 Azure
【发布时间】:2019-01-18 18:48:59
【问题描述】:

我一直在尝试将项目发布到 Azure Web 服务。我使用 dotnet cli 工具生成了项目,当它生成项目时,我删除了提供的 ClientApp 文件夹并使用 Angular CLI 生成了一个新的 Angular 项目。现在我在前端有 Angular 6,在后端有 Entity Framework Core 的 Asp.NET core 2.1。我编写了一个简单的网站,可以在我的本地主机上完美运行。现在我想将它发布到 Azure。发布过程本身是成功的,我可以在下面看到一条消息,但是当 url 在浏览器中打开时,它会显示以下内容: 然后我尝试在 Azure 上诊断和解决问题,结果如下: 完整报告:

在发布期间我配置了一些设置:

但仍然没有运气。以前我使用与 core 2.0 和 angular 5 相同的方法,效果很好。现在我遇到了 core 2.1 和 angular 6 的问题

这里是 Startup.cs:

using Microsoft.AspNetCore.Authentication.Cookies;
using Microsoft.AspNetCore.Authentication.JwtBearer;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.SpaServices.AngularCli;
using Microsoft.EntityFrameworkCore;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.IdentityModel.Tokens;
using MovieApp.Models;
using System.IO;
using System.Text;

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

    public IConfiguration Configuration { get; }

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddCors(options =>
        {
            options.AddPolicy("EnableCORS", builder =>
            {
                builder.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod().AllowCredentials().Build();
            });
        });

        services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme).AddJwtBearer(options =>
        {
            options.TokenValidationParameters = new TokenValidationParameters
            {
                ValidateIssuer = true,
                ValidateAudience = true,
                ValidateLifetime = true,
                ValidateIssuerSigningKey = true,
                ValidIssuer = "http://localhost:63269",
                ValidAudience = "http://localhost:63269",
                // ValidIssuer = "https://nqmoviesng.azurewebsites.net",
                //  ValidAudience = "https://nqmoviesng.azurewebsites.net",
                IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes("superSecretKey@345"))
            };
        });
        services.AddSingleton<IHttpContextAccessor, HttpContextAccessor>();

        services.AddMvc();


        services.AddSpaStaticFiles(configuration =>
        {
            configuration.RootPath = "ClientApp/dist";
        });
    }

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        app.UseAuthentication();
        app.UseCors("EnableCORS");

        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
        }

        app.UseDefaultFiles();
        app.UseStaticFiles();

        app.UseMvcWithDefaultRoute();

        app.UseSpaStaticFiles();


        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller}/{action=Index}/{id?}");
        });

        app.UseSpa(spa =>
        {


            spa.Options.SourcePath = "ClientApp";

            if (env.IsDevelopment())
            {
                spa.UseAngularCliServer(npmScript: "start");
            }
        });
    }
 }
}

.csproj 文件:

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

<PropertyGroup>
<TargetFramework>netcoreapp2.1</TargetFramework>
<TypeScriptCompileBlocked>true</TypeScriptCompileBlocked>
<TypeScriptToolsVersion>Latest</TypeScriptToolsVersion>
<IsPackable>false</IsPackable>
<SpaRoot>ClientApp\</SpaRoot>
<DefaultItemExcludes>$(DefaultItemExcludes);$(SpaRoot)node_modules\** 
</DefaultItemExcludes>

<!-- Set this to true if you enable server-side prerendering -->
<BuildServerSideRenderer>false</BuildServerSideRenderer>
</PropertyGroup>

<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.All" Version="2.1.1" />
<PackageReference Include="Microsoft.AspNetCore.SpaServices.Extensions" Version="2.1.1" />
<PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="2.1.1" />
<PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="2.1.1" />
<PackageReference Include="Microsoft.VisualStudio.Web.CodeGeneration.Design" Version="2.1.1" />
<PackageReference Include="Newtonsoft.Json" Version="11.0.2" />
</ItemGroup>

有什么想法吗?

【问题讨论】:

  • 你能从任何地方返回{"message":"Unsuccessfully."}吗?因为我得到了这个
  • 更改为调试构建配置,重新部署;并使用 Visual Studio 2017 社区调试 azure 应用以查看运行时错误。

标签: c# asp.net angular azure asp.net-web-api


【解决方案1】:

我更改了 angular.json 文件。将 "outputPath": "dist/ClientApp" 替换为 "outputPath": "dist" 并且成功了!

【讨论】:

  • 没有在您的问题中提到“如何”将 Angular 应用程序部署到 azure,因此即使不是不可能,也很难解决您的问题。如果您的应用程序无法运行的原因是因为您只是将 dist 文件夹部署到 Azure,而不是在运行 ng build --prod 命令后专门部署在 dist 目录中创建的文件夹,对您来说它必须是 @ 987654322@ 应该已部署到 azure 的目录,然后请更新您的问题以包含该信息。这将非常有用...
猜你喜欢
  • 1970-01-01
  • 2019-11-12
  • 1970-01-01
  • 1970-01-01
  • 2018-11-24
  • 2019-03-08
  • 2018-03-29
  • 2019-05-19
  • 2020-01-23
相关资源
最近更新 更多