I m facing one issue i.e when I try to refresh flutter web app page from server it is giving me below mention error.

404 Not Found - "The requested URL was not found on this server."

I went through my .htaccess file here below is what I have added in it.

      <IfModule mod_rewrite.c>
    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.html [L]
</IfModule>

Here is my default.conf file code

    # Default server configuration
server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /var/www/html/appname;
  index index.html index.htm;

  server_name _;

  location / {
    try_files $uri $uri/ /index.html;
  }
}

Also I have added web.config file looking at other same issue but seems like it doesn't work still adding the code here

<?xml version="1.0"  encoding="utf-8" ?>

<configuration>
  <system.webServer>
    <staticContent>
      <!-- JSON Manifests -->
      <mimeMap fileExtension=".json" mimeType="application/json" />
      <!-- Fonts -->
      <mimeMap fileExtension=".otf" mimeType="application/octet-stream" />
      <mimeMap fileExtension=".ttc" mimeType="application/octet-stream" />
      <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
      <mimeMap fileExtension="woff" mimeType="application/font-woff" />
      <mimeMap fileExtension="woff2" mimeType="application/font-woff2" />
    </staticContent>
  </system.webServer>
</configuration>

I m facing one issue i.e when I try to refresh flutter web app page from server it is giving me below mention error.

404 Not Found - "The requested URL was not found on this server."

I went through my .htaccess file here below is what I have added in it.

      <IfModule mod_rewrite.c>
    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.html [L]
</IfModule>

Here is my default.conf file code

    # Default server configuration
server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /var/www/html/appname;
  index index.html index.htm;

  server_name _;

  location / {
    try_files $uri $uri/ /index.html;
  }
}

Also I have added web.config file looking at other same issue but seems like it doesn't work still adding the code here

<?xml version="1.0"  encoding="utf-8" ?>

<configuration>
  <system.webServer>
    <staticContent>
      <!-- JSON Manifests -->
      <mimeMap fileExtension=".json" mimeType="application/json" />
      <!-- Fonts -->
      <mimeMap fileExtension=".otf" mimeType="application/octet-stream" />
      <mimeMap fileExtension=".ttc" mimeType="application/octet-stream" />
      <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
      <mimeMap fileExtension="woff" mimeType="application/font-woff" />
      <mimeMap fileExtension="woff2" mimeType="application/font-woff2" />
    </staticContent>
  </system.webServer>
</configuration>

in index.html I have changed this <base href="/">

Note: also my url the app is Hosted Under a Subdirectory which may need me to add <base href="/myapp/"> but it doesn't seems to be practical as there are 2 main subdirectory in url so it is not feasible to add the /myapp1/ or /myapp2/ after the Base Domain url for the path.

Tried every possible ways to remove the 404 not found error but nothing seems to work even after many changes using fillZilla and ftp host, in local it is perfectly working but on server something is not working as expected also I m not using firebase host I m using apache let me know if anything needs to be added or needs to update. Your help could be great.

• flutter
• dart
• server
• http-status-code-404
• flutter-web-browser

• This question is similar to: flutter web built release but nginx route 404. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. – Reza Farjam Commented Feb 17 at 8:54
• Here another related post: stackoverflow/q/72071757/13993137 – Reza Farjam Commented Feb 17 at 8:56
• hi @RezaFarjam I went through this but still getting same 404 – j23 Commented Feb 17 at 10:00

1 Answer 1

configuration looks good overall. If on the first load your website has /#/ or not, than I suggest you add this line of code:

void main() {
   WidgetsFlutterBinding.ensureInitialized();
   usePathUrlStrategy(); // <-- This line
   ...
   runApp(...);
}

to your main() function before runApp.

You also need to add

  flutter_web_plugins:
    sdk: flutter

to your dependencies and import it in the main.dart via

import 'package:flutter_web_plugins/url_strategy.dart';.

More infos here: https://docs.flutter.dev/ui/navigation/url-strategies

I hope this can fix your issue? =)