重新部署Web應用程序會導致看似隨機的JavaScript函數和對象未定義

Question

我們有一個由.NET MVC應用程序提供的Aurelia SPA。 SPA使用Webpack捆綁。

在某些條件下，看似隨機的JavaScript函數和對象將是未定義的。 由於這個原因，我們無法導航到某些路線。 刷新瀏覽器可修復這些問題。

我們發現重現此行為的步驟並不總是可靠的。

1. SPA在瀏覽器中打開（在本例中為Chrome）。
2. 我們將新版本的代碼部署到我們的服務器; .NET和JavaScript。
3. 之前打開的瀏覽器保持打開狀態大約12小時

然后我們將看到這樣的問題Cannot read property 'split' of undefined 。 導航到某些路線時。 防止路徑導航的未定義對象並不總是相同。

我無法在我的localhost上重現此行為。

在沒有部署新代碼的情況下，我將瀏覽器打開了一個周末並返回到正常運行的應用程序。

任何建議將不勝感激。 我不確定部署是如何相關的，因為瀏覽器應該不知道任何服務器更改。

Answer 1

我已經通過向我的塊文件添加contenthash解決了這個問題。

        path: path.resolve(bundleOutputDir),
        publicPath: "dist/",
        filename: "[name].js",
        chunkFilename: "[name].[contenthash].js",
      },

我們的webpack構建輸出了幾個文件。 其中大多數是在啟動時需要的，並包含在我們的MVC應用程序的家庭控制器的index.cshtml中。

例如<script type="text/javascript" src="~/dist/app.js" asp-append-version="true"></script>

asp-append-version="true"將一個版本附加到這些文件中，以便瀏覽器知道它是否應該從緩存中加載它們。

問題是webpack輸出的其他塊文件沒有以這種方式引用。 它們是從index.cshtml引用的文件中引用的。

這就是我認為正在發生的事情。

1. Web應用程序將在瀏覽器中打開。
2. 我們會向服務器發布新代碼。
3. 瀏覽器空閑。
4. 用戶返回瀏覽器。
5. 瀏覽器從空閑狀態喚醒並再次請求文件。
6. 使用asp-append-version="true"那些更新，而具有靜態名稱的那些從緩存中獲取。
7. 由於webpack捆綁文件的方式，對該緩存文件的任何微小更改都會拋棄應用程序。