502 Bad Gateway Error on Laravel Vapor

Hi there, recently I pushed my project via Laravel Vapor to production but I quickly realized that I'm receiving a "502 Bad Gateway" error on a very critical javascript file (app.js) of Filament.

I've been trying to solve this issue but I can't seem to be able to. See the attachment of the error I'm receiving.

Now what I understood up to this point is that Laravel Vapor uploads the assets found in the public directory to CDN and serves the files from there. But that's not the case for Filament's app.js file found at

/vendor/filament/filament/dist

/vendor/filament/filament/dist

because Filament serves its app.js file within its vendor directory rather than from the public directory of Laravel.

I also tried the following as well and it didn't work:
1. Copy the

dist

dist

folder to the public directory so that Laravel Vapor uploads it CDN and then
2. Add the following piece of code into the

boot

boot

method of my

AppServiceProvider

AppServiceProvider

class:

Filament::serving(function() {
    Filament::registerScripts([asset('PATH_TO_THE_APPJS_FILE_IN_THE_PUBLIC_DIRECTORY')]);
});

Filament::serving(function() {
    Filament::registerScripts([asset('PATH_TO_THE_APPJS_FILE_IN_THE_PUBLIC_DIRECTORY')]);
});

Didn't work! The file was loaded with no 502 error BUT the filament was constantly returning 404 errors. Example: If i went to https://DOMAIN/admin it aborts with 404. And when i revert back the above mentioned changes, everything works again apart from the loading of the app.js file.

So.... i'm not sure how to proceed now....

Solution

Never mind, problem solved by upgrading Filament to v3.
Filament v3 handles assets in the way that Laravel Vapor wants; aka, it publishes its assets to the public directory by default.

Jump to solution

502 Bad Gateway Error on Laravel Vapor

/vendor/filament/filament/dist

/vendor/filament/filament/dist

because Filament serves its app.js file within its vendor directory rather than from the public directory of Laravel.

I also tried the following as well and it didn't work:
1. Copy the

dist

dist

folder to the public directory so that Laravel Vapor uploads it CDN and then
2. Add the following piece of code into the

boot

boot

method of my

AppServiceProvider

AppServiceProvider

class:

Filament::serving(function() {
    Filament::registerScripts([asset('PATH_TO_THE_APPJS_FILE_IN_THE_PUBLIC_DIRECTORY')]);
});

Filament::serving(function() {
    Filament::registerScripts([asset('PATH_TO_THE_APPJS_FILE_IN_THE_PUBLIC_DIRECTORY')]);
});

Solution

Never mind, problem solved by upgrading Filament to v3.
Filament v3 handles assets in the way that Laravel Vapor wants; aka, it publishes its assets to the public directory by default.

Jump to solution

502 Bad Gateway Error on Laravel Vapor

502 Bad Gateway Error on Laravel Vapor

Similar Threads

Similar Threads

Similar Threads