laravel, assests in public folder can't be accessed

Question

I downloaded a hosted project from the server, on the server the project works fine but when i tried to run it on local machine php artisan serve, the browser shows this error:

http://127.0.0.1:8000/public/assets/front-end/vendor/tiny-slider/dist/tiny-slider.css net::ERR_ABORTED 404 (Not Found)

for each file in the public folder, if i removed the public word from the URL and it works fine and i can't do that for each assest because there is about 300 links in different files. I am using laravel 8.6, PHP 8.0 and XAMPP 3.3.0 so i tried the following:

1.I tried changing the .htaccess file of the root folder to the following:

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>
    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]
    # Send Requests To Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ public/$1 [L]
    RewriteRule ^ index.php [L]</IfModule>
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>
<Files .env>
    Order allow,deny
    Deny from all
</Files>

and i tried the same for the .htaccess of the public folder, chat gpt discovers nothing that is preventing the access to the public folder.

2.Adding the document root in the httpd.confas the following:

</Directory>
DocumentRoot "C:/xampp/htdocs/OS/public"
<Directory "C:/xampp/htdocs/OS/public">
    AllowOverride All
    Require all granted
</Directory>

with the public word and without it, it does not work. and for the httpd-vhosts.conf:

<VirtualHost 127.0.0.1:*>
    ServerName localhost
    DocumentRoot "C:/xampp/htdocs/OS/public"
    <Directory "C:/xampp/htdocs/OS/public">
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

and I also tried with the public word and without it.

3.I changed the .env file related values as the following:

APP_ENV=local
APP_DEBUG=true
APP_MODE=local
APP_URL=127.0.0.1

I tried to change the APP_URL to 127.0.0.1:8000/public and it still doesn't work.

4.I tried this method from this question: https://stackoverflow.com/a/28735930/17761153.

5.I made sure that the folder is accessible from all users on windows (not just read only).

6.I tried adding a sub folder called public inside the public folder and move everything in it, some other issues shows up concerning the php.index and server.php links, I changed the links inside it and in the end i knew that it is not the best approach.

7.I tried using WAMP instead of XAMPP and to know if the problem is with the XAMPP, I also tried to downgrade Laravel, PHP, XAMPP.

8.I tried changing the filesystem.php to the following:

 'disks' => [

        'local' => [
            'driver' => 'local',
            'root' => storage_path('app/public'),
        ],

        'public' => [
            'driver' => 'local',
            'root' => storage_path('app/public'),
            'url' => env('APP_URL') . '/storage',
            'visibility' => 'public',
        ],

I also tried to remove the word public and adding an extra one, but it still the same error. I tried some other ways too like adding the local host IP to the hosts file in windows and it still doesn't work, I think this is the most important things I tried.

Answer 1

1. You can also run your project without php artisan serve cmd by using this simply http://localhost/project_name/public
2. Use laravel helper function asset() in correct way to include any external file like below --> in blade file <link href="{{ asset('css/bar.css') }}" rel="stylesheet">

Answer 2

The 404 (Not Found) error indicates that the CSS file you are trying to access was not found on the local server at the specified address (http://127.0.0.1:8000/public/assets/front-end/vendor/tiny-slider/dist/tiny-slider.css).

Please check the following:

1. Make sure that the CSS file actually exists at the specified location. Check the file path and make sure it is correct.

2. Check the permissions for the file. Make sure that the file has the right permissions to be accessible via the web server.

3. Make sure that the static resources (CSS files, JavaScript, images, etc.) are properly configured and accessible through the web server. Check your public or static file configuration in the framework.

4. Make sure the local web server is running and can be accessed at the specified address (http://127.0.0.1:8000). Verify that the server is properly configured and that port 8000 is being used to access the site.

5. In your .env file don't forget to change localhost to localhost:8000, if port 8000 is your listening port

do all this and let me know if it still doesn't work