Deploying Flutter Web App on server - 404 page not found

Question

Hi I deployed my Flutter app on a server but it has a routing issue.

(Note: It works perfectly on debug mode)

When accessing directly to roots works:

https://web.pointsoftango.app

but when indicating the URI, it is not found.

https://web.pointsoftango.app/login

Same with any other page, I need one page also to take parameters. I believe the issue is on the main.dart file? I share it here.

import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:package/utils/app_module.dart';
import 'package:package/utils/app_widget.dart';
import 'package:url_strategy/url_strategy.dart';

void main() {
  setPathUrlStrategy();
  runApp(ModularApp(module: AppModule(), child: AppWidget()));
}

import 'package:flutter_modular/flutter_modular.dart';
import 'package:package/main.dart';
import 'package:package/screens/loginPage.dart';
import 'package:package/screens/events.dart';

class AppModule extends Module {
  @override
  final List<Bind> binds = [];

  @override
  final List<ModularRoute> routes = [
    ChildRoute('/login', child: (_, __) => LoginPage()),
    ChildRoute('/events/manage', child: (_, args) => Events(id: args.queryParams['user'])),
  ];
}

This works, when I change initialRoute it opens another screen.

import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';

class AppWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: "/login",
    ).modular();
  }
}

I am really stuck here, I would appreciate any help! Thanks.

Answer 1

add .htaccess file in server. In that file add this line

RewriteEngine on
RewritwCond %{REQUEST_FILENAME} !-d
RewritwCond %{REQUEST_FILENAME} !-f
RewriteRule . /index.html [L]

The Flutter web is single html file so we push the url on same index html by using this line of code