Angular 5 - 动态基础引用导致捆绑|块的重复加载

2024-02-06

我在项目中使用 Angular 5.2 版本。我在index.html 中动态设置基本引用以满足不同客户端的不同URL。

应用程序主页网址如下所示:-

http://example.com/client1/app/login
http://example.com/client2/app/login
http://example.com/client3/app/login

client1、client2 等是虚拟目录在 IIS 中。

当我在浏览器中运行应用程序时,我可以从检查窗口看到重复的块正在加载并导致应用程序页面变慢。

我观察到重复块的 Web 请求 url 的一件事。假设 script.xxxxxxxxxxxxxxxxxxxxx.bundles.css。

第一个网络请求:-https://example.com/client1/scripts.7186135389ca4b63fab4.bundle.js https://example.com/client1/scripts.7186135389ca4b63fab4.bundle.js

第二个网络请求(重复):-https://example.com/scripts.7186135389ca4b63fab4.bundle.js https://example.com/scripts.7186135389ca4b63fab4.bundle.js

第二个 Web 请求是不需要的。我无法判断它是如何发生的。

Index.html 在我的项目中看起来像这样:-

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

    <head>
        <meta charset="utf-8">
        <title>Web</title>
        <link href="/assets/Images/favicon.ico" rel="shortcut icon" type="image/x-icon">
        <base id="baseHref" href="/">
        <script>
            (function () {
                if (window.location.hostname !== 'localhost') document.getElementById('baseHref').href = "/" + window.location.pathname.split('/')[1] + "/";
            })();
        </script>
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
      <app-root></app-root>
    </body>
    </html>

请建议如何纠正此问题。


问题出在 ng 构建参数期间。

早些时候是

ng build --prod -e=dev --base-href=/Client1

在我将结尾 / 添加到 ng build 语句后,它工作得很好。

ng build --prod -e=dev --base-href=/Client1/

重复的角块消失了。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular 5 - 动态基础引用导致捆绑|块的重复加载 的相关文章

随机推荐