===================================
為什么SPA 需要設置 fallback ?
===================================

簡單講: 就是用來支持瀏覽器直接訪問非主頁url.

詳細說明: 以blazor模版項目為例, 先訪問首頁, 然后點擊主頁上的 counter 鏈接, 瀏覽器地址變?yōu)?http://localhost:5000/counter. 但如果直接在瀏覽器訪問 counter 的url, 會報 404 錯誤, 原因是:

1.前一個方法, 瀏覽器輸入首頁地址, 瀏覽器會向服務器端發(fā)成訪問 index.html 請求,這個文件在服務器端存在, 是可以正常訪問的,  然后瀏覽器渲染完主頁, 點擊主頁上的counter 鏈接, 瀏覽器端直接切到 counter 視圖, 因為 blazor web assembly是 SPA 頁面, 所以真實的頁面還是在 index.html, 瀏覽器地址上的變化是 blazor 框架修改的.

2.后一個方法, 直接在瀏覽器輸入 http://localhost:5000/counter 后, 瀏覽器會向server 端請求 counter 資源, 因為 server 端并沒有 counter.html 文件, 所以就會報 404 錯誤, 這個問題是所有SPA 框架都需要解決的, 即client side router 都有這個問題,  主流的 SPA 框架都是通過web server的 fallback 實現work-around.

===================================
blazor-devserver.exe 的特點
===================================

開發(fā)環(huán)境有時候需要用于demo, 這里介紹使用官方提供的 blazor-devserver.exe, 特別適合作為demo用,

優(yōu)點有:

⒈ 使用非常方便, 開發(fā)環(huán)境自帶該工具, 不需要額外安裝nginx 或 配置 IIS

2. 自動支持fallback, 支持瀏覽器直接訪問非主頁url.

3. 自動支持資源壓縮.  在IDE開發(fā)模式下, 對于官方模板項目, 瀏覽器一般需要下載多達10M的資源, 如果使用壓縮方式, 可以節(jié)省4M以上流量

缺點:

1. 不支持遠程訪問, 只能在localhost上訪問.

2. 不支持設置端口設置.

==============================

blazor-devserver.exe 的步驟

==============================

blazor-devserver.exe 不需要做任何配置即支持url rewrite,  假設項目名為 blazor2app , 完整步驟如下:

1. 進入項目根目錄, 使用發(fā)布命令進行編譯 , 按照 release 配置模式編譯

    dotnet publish -c Release

   加上 Release 選項后,  進入publish 輸出目錄,  可以看到wwwroot目錄,  

wwwroot目錄下有多個子目錄, 其中文件會有壓縮版和非壓縮版本

 2. 命令行 cd 到 publish 目錄, 然后啟動 blazor-devserver

  blazor-devserver.exe serve --applicationpath ".\wwwroot\_framework\blazor2app.dll"

 如果是subdirectory子目錄形式, 還可以加上 --pathbase="/CoolApp" 參數

=====================

更多參考

=====================

更多部署優(yōu)化, 可參考 https://www.meziantou.net/optimizing-a-blazor-webassembly-application-size.htm

https://docs.microsoft.com/en-us/aspnet/core/blazor/host-and-deploy/webassembly