在網頁上設定 URL 策略

Flutter 網路應用程式支援兩種在網路上設定基於 URL 導覽的方式

雜湊(預設)
路徑會讀取並寫入 雜湊片段。例如,flutterexample.dev/#/path/to/screen
路徑
路徑會在沒有雜湊的情況下讀取和寫入。例如,flutterexample.dev/path/to/screen

設定 URL 策略

若要設定 Flutter 使用路徑,請使用 SDK 中 usePathUrlStrategy 函式,該函式由 flutter_web_plugins 函式庫提供

import 'package:flutter_web_plugins/url_strategy.dart';

void main() {
  usePathUrlStrategy();
  runApp(ExampleApp());
}

設定您的網路伺服器

PathUrlStrategy 使用 歷程記錄 API,這需要為網路伺服器進行額外的設定。

若要設定您的網路伺服器以支援 PathUrlStrategy,請查看網路伺服器的文件,以改寫對 index.html 的要求。查看網路伺服器的文件,以取得有關如何設定單頁式應用程式的詳細資訊。

如果您使用 Firebase Hosting,請在初始化專案時選擇「設定為單頁式應用程式」選項。如需更多資訊,請參閱 Firebase 的 設定改寫文件。

透過執行 flutter run -d chrome 建立的本機開發伺服器已設定為優雅地處理任何路徑,並回退到應用程式的 index.html 檔案。

將 Flutter 應用程式主機在非根目錄位置

<base href="/"> 標籤在 web/index.html 中更新為應用程式主機的路徑。例如,若要將您的 Flutter 應用程式主機在 my_app.dev/flutter_app,請將此標籤變更為 <base href="/flutter_app/">