由于不允许的 MIME 类型（“text/html”）而被阻止：部署在 tomcat 9.0.30 上的 Angular 8 无法提供资产

Question

由于不允许的 MIME 类型（“text/html”）而被阻止：部署在 tomcat 9.0.30 上的 Angular 8 无法提供资产

Ana*_*han 13 spring spring-boot angular tomcat9 angular8

我有一个项目，其中用户界面基于 angular 8，后端是 springboot java 服务。整个项目是一个多模块项目，其中 angular 部分是一个单独的模块，front-end builder用于将 angular 代码构建到单个可执行 jar 中。使用嵌入式 tomcat 时，应用程序运行良好。我有一个新要求，即尝试在外部 tomcat 上单独部署 angular ui 部分。但是当我将 dist 文件夹复制到 webapps 文件夹并尝试为其提供服务时，浏览器会阻止请求说：

Loading module from “http://localhost:8080/polyfills-es2015.js” was blocked because of a disallowed MIME type (“text/html”).

Run Code Online (Sandbox Code Playgroud)

做了一些谷歌搜索后，我才明白发生的问题，因为角8个CLI未能在添加type属性到script的标签index.html。当我手动添加类型时，一切正常。任何人都可以帮助我理解为什么会发生这种情况，以及手动编辑以外的问题的可能解决方案。

生成index.html：

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>My Application</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <i class="fas fa-chart-area"></i>
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>

<body style="margin: 0;">
  <app-root></app-root>
<script src="runtime-es2015.js" type="module"></script><script src="runtime-es5.js" nomodule defer></script><script src="polyfills-es5.js" nomodule defer></script><script src="polyfills-es2015.js" type="module"></script><script src="styles-es2015.js" type="module"></script><script src="styles-es5.js" nomodule defer></script><script src="scripts.js" defer></script><script src="vendor-es2015.js" type="module"></script><script src="vendor-es5.js" nomodule defer></script><script src="main-es2015.js" type="module"></script><script src="main-es5.js" nomodule defer></script></body>

</html>

Run Code Online (Sandbox Code Playgroud)

因此，总结一下所有有效的方法，如下所示：

在 HTML5 中 type 属性不再是强制性的，因此 angular cli 不再将其添加为属性。在嵌入式 tomcat 中，资产被复制到ROOT完美运行，因为当我部署在外部 tomcat 中时，我将资产保存在 webapps 的一个文件夹下，这意味着我必须修改该baseHref字段（在使用命令构建期间或手动构建之后） ) 来反映相同。以下工作：
将资源保存在 webapps 中的 ROOT 文件夹下（一切正常，因为 js 文件现在位于根目录 / 下）。
保持文件下的文件夹例如说MyApp，并指定为 baseHref在index.html。

相关链接