配置 Web 应用的 URL 策略
Flutter Web 应用支持两种基于 URL 的路由的配置方式:
Hash(默认)
路径使用 # + 锚点标识符 读写,例如:flutterexample.dev/#/path/to/screen
。
Path
路径使用非 # 读写,例如:flutterexample.dev/path/to/screen
。
配置 URL 策略
#让 Flutter 使用 path 策略,请使用 flutter_web_plugins
库中提供的 setUrlStrategy
方法。
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 Hosting 托管,在初始化项目时选择 "配置单页应用" 选项。更多信息请查看 Firebase 中的 配置重写。
当你通过 flutter run -d chrome
创建并运行本地开发服务器时,它的默认配置会处理好所有的路径,并回退到应用程序的 index.html
文件。
将 Flutter 应用部署在子目录下
#更新 web/index.html
中的 <base href="/">
标签为你的应用部署路径。例如:如果你期望将 Flutter 应用部署在 myapp.dev/flutter_app
,则更改此标签为 <base href="/flutter_app/">
。
除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2024-09-04。 查看文档源码 或者 为本页面内容提出建议。