Search code examples
flutterflutter-webflutter-routes

Flutter Web Page Routing Issue

I need web app with base url as

https://example.com/mojjo-test/index.html#/

I updated my base url as documented in flutter website: https://flutter.dev/docs/development/ui/navigation/url-strategies

 <base href="/mojjo-test/">

in index.html

As per flutter documentation Hashing is already enabled

Observations:

1.Flutter web app loads, shows url while loading,

    http://example.com/mojjo-test/index.html

2.And after some seconds it redirects to

    http://example.com/mojjo-test/#/
  1. Now if we do a refresh, browser will try to load http://example.com/mojjo-test/#/ and shows an access denied

I am assuming that instead of redirecting to http://example.com/mojjo-test/#/, it should redirect to http://example.com/mojjo-test/index.html#/

Please provide suggestions on how to achieve it. I would like to keep the initial path to be https://example.com/mojjo-test/index.html#/ (with index.html)

Solution

  • I'd advice you commenting out href in 'web/index.html' (platform project automatically generated when adding Web). That's how I did it: https://github.com/maxim-saplin/flutter_web_spa_sample/blob/main/web/index.html

    And here's the example of this app working under virtual directory: https://maxim-saplin.github.io/flutter_web_spa_sample/html/#/

    Flutter Web somehow has these silly issues in scaffolding for the web project (href in index.html, wrong paths for service worker etc.) - discovered this while playing with GitHub pages.