在 Web 上配置 URL 策略

Flutter Web 应用程序支持在 Web 上配置基于 URL 的导航的两种方式

哈希（默认）

路径读写到哈希片段。例如，flutterexample.dev/#/path/to/screen。

路径

路径读写时没有哈希。例如，flutterexample.dev/path/to/screen。

配置 URL 策略

要将 Flutter 配置为使用路径，请使用 usePathUrlStrategy 函数，该函数由 SDK 中的 flutter_web_plugins 库提供

import 'package:flutter_web_plugins/url_strategy.dart';

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

配置 Web 服务器

PathUrlStrategy 使用 History API，这需要对 Web 服务器进行其他配置。

要配置 Web 服务器以支持 PathUrlStrategy，请查看 Web 服务器的文档以将请求重写为 index.html。查看 Web 服务器的文档以了解有关如何配置单页应用的详细信息。

如果您使用 Firebase 托管，请在初始化项目时选择“配置为单页应用”选项。有关更多信息，请参阅 Firebase 的 配置重写 文档。

通过运行 flutter run -d chrome 创建的本地开发服务器配置为优雅地处理任何路径并回退到应用的 index.html 文件。

在非根位置托管 Flutter 应用

将 <base href="/"> 标记中的 web/index.html 更新为应用托管到的路径。例如，要在 my_app.dev/flutter_app 中托管 Flutter 应用，请将此标记更改为 <base href="/flutter_app/">。