Javascript .NET Core 3.1和Angular 9 web应用程序生成错误_Javascript_.net_Angular

Javascript .NET Core 3.1和Angular 9 web应用程序生成错误

javascript .net angular

Javascript .NET Core 3.1和Angular 9 web应用程序生成错误,javascript,.net,angular,Javascript,.net,Angular,我已经在VSCode中开发了一个.NETCore3.1和Angular9Web应用程序我已经设置了一个launch.json文件，它可以毫无障碍地为整个应用程序（.NET Core和Angular 9）提供服务当我运行ng build--prod构建angular 9应用程序并将其写入.NET核心wwwroot时，我使用下面的angular.json设置 angular.json（摘录）然后，我使用dotnet run运行应用程序，以便在localhost:5000上为应用程序提供服务。就

我已经在VSCode中开发了一个.NETCore3.1和Angular9Web应用程序

我已经设置了一个launch.json文件，它可以毫无障碍地为整个应用程序（.NET Core和Angular 9）提供服务

当我运行

ng build--prod

构建angular 9应用程序并将其写入.NET核心wwwroot时，我使用下面的angular.json设置

angular.json（摘录）

然后，我使用

dotnet run

运行应用程序，以便在localhost:5000上为应用程序提供服务。就在同一天，这一切都发挥了100%的作用，然后在添加了两个组件后，我得到了一张空白页。我删除了我添加的两个组件，但没有任何效果。我仍然会看到一个空白页面，上面显示控制台错误消息，如下图所示

例如，其中一条错误消息为“加载资源失败：服务器响应状态为400（错误请求）”，文件名为“main-es2015.9ddbf650cf0cef0e7f09b565.js”

我已验证路径中是否存在特定文件。我还打开了所有的文件，它们都有内容。我复制了内容并验证（使用在线验证器）其中的JavaScript是否有效

我还双击了控制台错误中显示的文件名，并显示以下.json格式的错误消息

.json格式的错误消息

{
  "errors": {
  "dataanalysisId": [
  "The value 'main-es2015.9ddbf650cf0e7f09b565.js' is not valid."
  ]
  },
  "type": "https://tools.ietf.org/html/rfc7231#section-6.5.1",
  "title": "One or more validation errors occurred.",
  "status": 400,
  "traceId": "|82e44613-41a1b227ab4a5264."
}

我认为，

出现了一个或多个验证错误

，

值“main-es2015.9ddbf650cf0cef0e7f09b565.js”无效

“main-es2015.9ddbf650cf0ce7f09b565.js”是否无效

我还仔细检查了生成的index.html文件，并且正确引用了特定的JavaScript文件

index.html

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Cache-Control" content="max-age=0, must-revalidate"/>
        <meta http-equiv="Pragma" content="no-cache"/>
        <meta http-equiv="Expires" content="0" />
        <title>TargetPro</title>
        <base href="/">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="icon" type="image/x-icon" href="/assets/images/NewBigenLogo.ico">
        <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&amp;display=swap" rel="stylesheet">
        <!-- <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
        <link rel="manifest" href="manifest.webmanifest">
        <link rel="stylesheet" href="assets/custom.css">
        <meta name="theme-color" content="#1976d2">
        <link rel="stylesheet" href="styles.7a6852d4635a483ded1e.css">
    </head>
    <body class="body">
        <app-root></app-root>
        <!-- <noscript>Please enable JavaScript to continue using this application.</noscript> -->
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
        <script src="runtime-es2015.0dae8cbc97194c7caed4.js" type="module"></script>
        <script src="runtime-es5.0dae8cbc97194c7caed4.js" nomodule defer></script>
        <script src="polyfills-es5.177e85a9724683782539.js" nomodule defer></script>
        <script src="polyfills-es2015.f332a089ad1600448873.js" type="module"></script>
        <script src="scripts.e3f1622784b881f14c87.js" defer></script>
        <script src="main-es2015.9ddbf650cf0e7f09b565.js" type="module"></script>
        <script src="main-es5.9ddbf650cf0e7f09b565.js" nomodule defer></script>
    </body>
</html>

及

ngsw.json（摘录）

我已经包括了下面的标题

当我查看“main-es2015.9ddbf650cf0ce7f09b565.js”请求的头时，我注意到响应头返回一个

application/problem+json；charset=utf-8

内容类型，不正确。“main-es2015.9ddbf650cf0ce7f09b565.js”文件是一个JavaScript文件。我的猜测是，它更多地与return.json格式的错误消息有关，而不是与JavaScript文件本身有关

我将感谢任何帮助和帮助。我想我错过了一些显而易见的东西，可能是从正面开始的。我花了太多时间试图弄清这一点，以至于我可能错过了显而易见的解决方案

编辑-解决方案

用于显示应用程序的解决方案位于.NET Core startup.cs文件中。谢谢你给我指明了正确的方向

在Configure方法中，我使用

app.UseEndpoints

将映射回退包括到控制器，该控制器在WWroot中返回一个名为index.html的

PhysicalFile

。我将这个中间件注释掉，然后再次运行

dotnet run

，这次我能够按预期查看应用程序

它包含在下面配置方法的startup.cs代码提取中。这是注释代码

startup.cs（摘录）

在我看来，问题在于.NET核心路由正在干扰角度路由。很难说，因为我不知道您是如何配置启动的，但请尝试在startup.cs文件的configure（）方法中，在授权/身份验证中间件之后，端点中间件之前添加此中间件：

  app.MapWhen(
                context =>
                {
                    var path = context.Request.Path.Value.ToLower();
                    return path.Contains("/") &&
                           !path.Contains(".js") &&
                           !path.Contains("/api/") &&
                           !path.Contains("/assets") &&
                           !path.Contains(".ico");
                },
                branch =>
                {
                    branch.Use((context, next) =>
                    {
                        context.Request.Path = new PathString("/index.html");
                        return next();
                    });

                    branch.UseStaticFiles();
            });

非常感谢。虽然您的回复不是答案，但它肯定会将我指向查找问题的正确位置（文件和代码）。现在我可以前进了。

{
  "name": "app",
  "installMode": "prefetch",
  "updateMode": "prefetch",
  "urls": [
    "/favicon.ico",
    "/index.html",
    "/main-es2015.9ddbf650cf0e7f09b565.js",
    "/main-es5.9ddbf650cf0e7f09b565.js",
    "/manifest.webmanifest",
    "/polyfills-es2015.f332a089ad1600448873.js",
    "/polyfills-es5.177e85a9724683782539.js",
    "/runtime-es2015.0dae8cbc97194c7caed4.js",
    "/runtime-es5.0dae8cbc97194c7caed4.js",
    "/scripts.e3f1622784b881f14c87.js",
    "/styles.7a6852d4635a483ded1e.css"
  ],
  "patterns": []
}

"hashTable": {
    "/assets/custom.css": "e81137cd383f52c600f10dabb84bd1484abc1181",
    "/assets/icons/icon-128x128.png": "dae3b6ed49bdaf4327b92531d4b5b4a5d30c7532",
    "/assets/icons/icon-144x144.png": "b0bd89982e08f9bd2b642928f5391915b74799a7",
    "/assets/icons/icon-152x152.png": "7479a9477815dfd9668d60f8b3b2fba709b91310",
    "/assets/icons/icon-192x192.png": "1abd80d431a237a853ce38147d8c63752f10933b",
    "/assets/icons/icon-384x384.png": "329749cd6393768d3131ed6304c136b1ca05f2fd",
    "/assets/icons/icon-512x512.png": "559d9c4318b45a1f2b10596bbb4c960fe521dbcc",
    "/assets/icons/icon-72x72.png": "c457e56089a36952cd67156f9996bc4ce54a5ed9",
    "/assets/icons/icon-96x96.png": "3914125a4b445bf111c5627875fc190f560daa41",
    "/assets/images/NewBigenLogo.ico": "1971185fbe08c46b54eb2bb81d5232e8951084d3",
    "/assets/images/TargetProLogo02.jpg": "df42312cbae197612480d8612796527459609d6d",
    "/assets/images/TargetProLogo02Transparent.png": "52e5ec097ff8107d5bbacd8f28e3ed6c46c91911",
    "/assets/images/bigen_horisontal_white_tagline.png": "9551491c578290df06600c6580c01bb21d71ade2",
    "/fa-brands-400.1776173e3b1af55eb455.ttf": "29f59b4eecc72052d9110a5d4030a10ad9bf73d7",
    "/fa-brands-400.28d8b8fcc41c3b7134ff.woff": "fddb95d7a0f48d2bf90a5ee3095e8264dca18053",
    "/fa-brands-400.37913cdf7cb0571dfac0.woff2": "62584b9868428fd75af3fc5ee2f9918dda428be5",
    "/fa-brands-400.63b566233f163d538cce.svg": "99dff0739882276ad6c434d73228efc7971b0a66",
    "/fa-brands-400.bfcc3384b8a317dc5de3.eot": "40c8f2a0dc154160fde50e0c27f694f12c7b1636",
    "/fa-regular-400.0c6f12b9eaa2ad444a6b.eot": "3306178c90d9df939d2a5eabf533ba3650fbe80e",
    "/fa-regular-400.1b536b782d09dd59dda8.svg": "51afca56e309df6fdc56b53fa6a7d3ce64826490",
    "/fa-regular-400.c3c2ab4f63b8d9973c78.woff2": "5e4d45052f43e55aaad7f14d13280215e39aa45b",
    "/fa-regular-400.c9c57c0f1f4eb34dbf57.ttf": "517a3b41c1e01b65898b5f1074434d43a361a54f",
    "/fa-regular-400.fcaa6c135683a3fa1b50.woff": "da17a9f1dcae379c8ba20f1089059c202216cba7",
    "/fa-solid-900.22aa6d4357cf74671bc4.woff": "f13e252f8a51a5279fd21e26ada0bd2f55bcefd8",
    "/fa-solid-900.3e2bc2ffd29f01066d23.svg": "5501fb62e20a89bdd89bf3fa147ca4dbcd2fc67f",
    "/fa-solid-900.4055b0575d40bfb3c7e8.woff2": "6290834672aba86d5b6c1c73b30b57c9c53996f7",
    "/fa-solid-900.a480ec972cb6bce30533.ttf": "874c650701d0cbfb8f1de48a496dabed3bbf22e6",
    "/fa-solid-900.dfaa060a451d978c2565.eot": "96a5637429426764ea9b28bf4d1eb55ae10de57e",
    "/favicon.ico": "22f6a4a3bcaafafb0254e0f2fa4ceb89e505e8b2",
    "/index.html": "3097d526717744c5c5546bb7e6bd6d8c568b75c7",
    "/main-es2015.9ddbf650cf0e7f09b565.js": "0fc7b0b2cc5f345d48a4b49d131facbc3129748d",
    "/main-es5.9ddbf650cf0e7f09b565.js": "23296d15033f49a1cbe2dbc68423698d2d685c9b",
    "/manifest.webmanifest": "2b9a2f8c92d7633e5cf15f0e60412ba827c7cb02",
    "/polyfills-es2015.f332a089ad1600448873.js": "72ad4ccc0a3916ae4598199447cdeadd6d380570",
    "/polyfills-es5.177e85a9724683782539.js": "8aa26ea87b9958c6bd13b7c257c0e9940438e684",
    "/runtime-es2015.0dae8cbc97194c7caed4.js": "a9aafcf49f49145093fc831efd9b8e2f6c71bb9c",
    "/runtime-es5.0dae8cbc97194c7caed4.js": "a9aafcf49f49145093fc831efd9b8e2f6c71bb9c",
    "/scripts.e3f1622784b881f14c87.js": "e6b3c356e5949695046c95858db71a303e633dd1",
    "/styles.7a6852d4635a483ded1e.css": "368e886c0e50a602803bedcee7c7bbb8c0583d5d"
  }

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }

    app.Use(async (c, next) =>
    {
        if (c.Request.Path == "/")
        {
            c.Response.Headers.Add("Cache-Control", "no-store,no-cache");
            c.Response.Headers.Add("Pragma", "no-cache");
        }
        await next();
    });

    app.UseRouting();
    app.UseAuthentication();
    app.UseAuthorization();
    app.UseCors(builder =>
    {
        AllowedToAllowWildcardSubdomains();
        builder.AllowAnyOrigin();
        builder.AllowAnyMethod();
        builder.AllowAnyHeader();
    });
    app.UseDefaultFiles();
    app.UseStaticFiles();
    app.UseMvc();
    // app.UseEndpoints(endpoints =>
    // {
    //     endpoints.MapControllers();
    //     endpoints.MapFallbackToController("Index", "Fallback");
    // });
}

  app.MapWhen(
                context =>
                {
                    var path = context.Request.Path.Value.ToLower();
                    return path.Contains("/") &&
                           !path.Contains(".js") &&
                           !path.Contains("/api/") &&
                           !path.Contains("/assets") &&
                           !path.Contains(".ico");
                },
                branch =>
                {
                    branch.Use((context, next) =>
                    {
                        context.Request.Path = new PathString("/index.html");
                        return next();
                    });

                    branch.UseStaticFiles();
            });