How can I change the url in Flutter web?

Question

I need to change the content of this web page

for this content

And also change the url from "localhost:49318/#/home/inicio" to "localhost:49318/#/home/other".

All of this without using the Navigator.

In a mobile app I would change the widget shown with a set state, but doing that on a web page wouldn't change the url.

score 17 · Answer 1 · edited Apr 22 '21 at 20:33

17

I use Fluro (a package) to control my routes, but eventually I need to change the URL without redirecting.

The solution is pretty simple

Import this:

import 'dart:html' as html;

Then in your code, use this to change the URL without affecting the current page

html.window.history.pushState(null, 'home', '#/home/other');

edited Apr 22 '21 at 20:33

Brandon

68,708
30
194
223

answered Apr 22 '21 at 20:08

Fernando Herrera

552
1
6
16

Thanks for letting us know about this package. It looks really awesome and I am going to use it in my own project. – Windbox Nov 24 '22 at 05:00

score 0 · Answer 2 · answered Apr 15 '21 at 18:15

0

The url in browser won't change unless you navigate it to specific one.
Yes, setState((){}) will work in mobile(here too) but it will change/replace the widget to the new one it won't navigate to your target.

answered Apr 15 '21 at 18:15

Pathik Patel

1,347
1
9
22

score 0 · Answer 3 · answered Dec 16 '21 at 14:35

0

If you use Flutter Navigator 2.0 you can use a RouteNavigationParser which handles URL parsing for you.

answered Dec 16 '21 at 14:35

v1lling

1

score 0 · Answer 4 · answered Apr 08 '22 at 15:43

If you want to change the url to a html page, you can just use:

Import

import 'dart:html' as html;
// or even better: import 'package:universal_html/html.dart' as html;

final myPath = 'payment.html';
html.window.location.href = myPath;

(considering your file located at web/payment.html)

How can I change the url in Flutter web?

4 Answers4