Level 1
What framework are you using for the stylings? Is it tailwind? Maybe run the command in the heroku console npm run prod. See if it fixes your styling issues.
Dec 5, 2022
48
Level 1
Heroku completely messed up my Laravel login (Laravel 9)
I am currently trying to host my Laravel 9 project on Heroku. Everything works more or less fine, until it comes to the Login. The first thing which is horrible is the fact that the login style is completely messed up, my login has been fully made with the laravel default login implementation and in local everything works as it should.
In addition to all of that, whenever I try to login, I get the 419 page error. And yes, I did setup properly the postgre database and added all the migrations.
I tried everything I possibly could. I looked everywhere online, but no one is able to help me out....
Level 1
@reneec indeed it seems like it is tailwind
Level 1
@reneec Hmm these are the outputs in the heroku run bash whenever I am trying to run nom run prod
~ $ npm run prod npm ERR! Missing script: "prod" npm ERR! npm ERR! To see a list of scripts, run: npm ERR! npm run
npm ERR! A complete log of this run can be found in: npm ERR! /app/.npm/_logs/2022-12-05T10_38_08_150Z-debug-0.log
Any idea how you can help me out?
Level 1
@iLuca how about npm run production?
Level 102
Link ?
Level 1
@Sinnbeck Cannot post link unfortunately (since I have just signed up), if you send me your email I could send it trough there!
Level 102
@iLuca just leave out the https:// part. Like foobar.com
Level 1
@Sinnbeck Here it is vrloki.herokuapp.com
Level 102
@iLuca Seems to look correct, and work fine for me: http://vrloki.herokuapp.com/login
Level 1
@Sinnbeck I mean can you not see that the CSS is completely broken?
Level 102
@iLuca I dont know how its meant to look? But looks fine to me https://i.imgur.com/4a5XLQD.png
Level 1
@Sinnbeck Wowww, this is definitly not what it looks like to me! Take a look imgur.com/a/xajOyNP. This is what I am seeing...
Level 1
@Sinnbeck I have also sent to my business partner and he sees it the same exact way.
PS: I have also tried it on many different browsers
Level 102
@iLuca My guess is that you are visiting it on https, but your urls are set to use http https://vrloki.herokuapp.com/login
Generally your webserver should automatically upgrade to https (I assume you can enable that on heroku some how)
Level 102
Level 1
@Sinnbeck Ok ok indeed with http it works, however now the user area in vrloki.herokuapp.com/user/profile (once you create an account) is messed up xD Same exact issue the CSS is broken...
Level 102
@iLuca Look at the link for how to fix http => https. Or show how you are adding the links to css/js
Level 1
@Sinnbeck Adding the css/js in the user area section (Btw that section has also been fully made with the laravel implementation)?
Level 1
@sinnbeck Hmmm really can't seem to understand why the user area is now messed up... The protocol is still HTTP but the use area seem to be broken (if it is not the login, it has to be the user area....)
Level 102
@iLuca Hard to say. But open the dev tools in the browser and check the Console tab. Thats how I debugged the page
Level 1
@Sinnbeck This is what I am getting imgur.com/a/KJUcxrU
Level 102
@iLuca Old asset url? The current one is http://vrloki.herokuapp.com/build/assets/app.ba9ab83d.css
But so far I have seen 0 lines of code, so its hard to advice. Old cache ? php artisan view:clear
Level 1
@Sinnbeck What code would you like to see?
Level 102
show how you are adding the links to css/js
Level 1
@Sinnbeck I haven't really understood that to be honest. Since Laravel created the login and the user area all by itself, maybe the manifest.json is what you mean?
"resources/js/app.js": {
"file": "assets/app.79fca726.js",
"src": "resources/js/app.js",
"isEntry": true
},
"resources/sass/app.scss": {
"file": "assets/app.5005f49e.css",
"src": "resources/sass/app.scss",
"isEntry": true
},
"resources/css/app.css": {
"file": "assets/app.5005f49e.css",
"src": "resources/css/app.css",
"isEntry": true
}
}```
Level 102
@iLuca Ah ok. Is it inertia based ?
Maybe start by focusing on one problem at a time? Fixing one might fix the other. Did you get http to https redirect working in htaccess?
Level 1
@Sinnbeck I haven't really found a solution, Heroku is quite of a mess to be honest...
Level 102
@iLuca Sorry to hear that. Never used heroku myself. I use digital ocean or hetzner together with ploi.io
Anyways. Https guide: https://stackoverflow.com/questions/1329647/force-ssl-https-with-mod-rewrite/34065445#34065445
Level 1
@Sinnbeck And where should I put what you just sent me?
Level 102
@iLuca You edit the .htaccess in /public
Level 1
@Sinnbeck ok ok currently pushing to heroku!
Level 102
@iLuca Ok the page is redirecting. Can you show your app.blade.php file?
Level 1
@Sinnbeck Sure (BTW now that I have just logged out, I get also the following error The GET method is not supported for this route. Supported methods: POST.)
here is the app.blade.php:
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Loki') }}</title>
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.bunny.net/css2?family=Nunito:wght@400;600;700&display=swap">
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
<!-- Styles -->
@livewireStyles
</head>
<body class="font-sans antialiased">
<x-jet-banner />
<div class="min-h-screen bg-gray-100">
@livewire('navigation-menu')
<!-- Page Heading -->
@if (isset($header))
<header class="bg-white shadow">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
{{ $header }}
</div>
</header>
@endif
<!-- Page Content -->
<main>
{{ $slot }}
</main>
</div>
@stack('modals')
@livewireScripts
</body>
</html>
Level 1
@sinnbeck The error is related to the kernel:
Kernel->handle()
in /app/public/index.php (line 52)
$app = require_once __DIR__.'/../bootstrap/app.php';$kernel = $app->make(Kernel::class);$response = $kernel->handle( $request = Request::capture())->send();$kernel->terminate($request, $response);```
Level 102
@iLuca Ah wait. I just recalled that heroku might use a load balancer. Try trusting all proxies
https://github.com/laravel/laravel/blob/9.x/app/Http/Middleware/TrustProxies.php#L15
Change this line in your project to
protected $proxies = '*';
Level 1
@Sinnbeck Where exactly should I change the line?
Level 102
@iLuca In the file I showed you? app/Http/Middleware/TrustProxies.php
Level 1
@Sinnbeck Ok ok sorry i misunderstood that. Currently pushing!
Level 102
@iLuca No worries :)
Level 102
And bingo! login page is working!
Level 1
@Sinnbeck Amazing!!! One quick thing that I have just noticed, somehow I did set an admin account on my local db (with the seed) and I have also created a db on heroku ( postgre). However I can't seem to login with that admin account?
Level 102
@iLuca But did you run that seeder on heroku ? Check the database there
Level 102
If the original problem is solved then please mark the thread as solved by marking a best answer
Level 1
@Sinnbeck I did exported all the migrations on heroku. However I am not sure what you mean by running the seeder on heroku?
Level 102
@iLuca Maybe make a new thread explaining what you did and what isnt working then we will try solving it :)
Level 1
@Sinnbeck Gothu will do so, however I really do hope that you will be on that thread, because you have been tremendously helpful :D
Level 102
@iLuca Hehe I will try :) But happy to head that
Level 1
@Sinnbeck Post created !
Please or to participate in this conversation.