I deployed a Laravel 9 app (with Jetstream/Livewire) to DigitalOcean using their "App" service from GitHub. Deployment was smooth and CI/CD works fine.
When viewing the application in the browser, I noticed that the assets (CSS and JS) are being served with a HTTP URL. None of the modern browsers like this (called "mixed content"). So I configured Vite (/vite.config.js) to compile the assets using HTTPS. Now they work.
However, Laravel itself insists on using HTTP when building URL's within the Blade templates (url() and route()). For instance, on the login page, the login form action is http://mywebsite.com.
I have tried:
Editing AppServiceProvider.php and adding \Illuminate\Support\Facades\URL::forceScheme('https'); to the boot() method
Setting proxies to '*' in TrustProxies middleware
Adding all of the CloudFlare IP's to the proxies property of TrustProxies middleware
Setting APP_URL and ASSET_URL to https://mywebsite.com in .env
Clearing the caches after changing the settings by php artisan optimize:clear
But none of this has helped and the forms (and other URL's) are generated under the HTTP scheme. I am guessing that the reverse proxy setup is confusing Laravel. What are the right Laravel settings to help it play nicely with DigitalOcean App service (which uses Heroku and CloudFlare? for deployment)?
Turns out, forceScheme() should be added as
\URL::forceScheme('https');
and not as
\Illuminate\Support\Facades\URL::forceScheme('https');
Because it lives in the Illuminate\Routing\UrlGenerator class. Some answer in the internets has mislead me... Don't let is mislead you!
Related
The website my groupmates and I are working on is only locally available on my laptop. I want them to be able to open the website from their own homes, so that my frontend-focused members may edit and view the changes in the website right there and then. I also want my other group members to be able to test the website.
With all the ways I've tried to make our laravel app temporarily publically available through ngrok, they only show the basic HTML. No CSS and javascript.
First was from: https://vanrossum.dev/5-using-ngrok-with-laravel
which involved adding this in the app's AppServiceProvider.php:
public function boot(\Illuminate\Http\Request $request)
{
if (!empty( env('NGROK_URL') ) && $request->server->has('HTTP_X_ORIGINAL_HOST')) {
$this->app['url']->forceRootUrl(env('NGROK_URL'));
}
// other code
}
, running this on ngrok,
ngrok http -host-header=rewrite laravel-site.test:80
adding the received url to the .env file as NGROK_URL: url and then clearing all app caches after
Result: No CSS or js
Second way involved exposing port 9000 though ngrok, and running php artisan serve --port=9000 on my laravel app. (https://www.youtube.com/watch?v=s8efVe5c1Xg) Same thing, no CSS and js.
I also tried what's mentioned here: NGrok and Laravel
But it only loaded the XAMPP Welcome Page
Our CSS and js are mixed with CSS and js files linked using asset() and the use of CDNs.
What should I do to be able to share the website with my groupmates?
I just had to follow this article to the tee:
https://www.jobsity.com/blog/how-run-ngrok-test-share-your-local-development
Open your gitbash terminal in VSCode with your project added in the workspace. (To be sure make sure the path indicated in the gitbash terminal is your project's path)
Turn on artisan server by typing
php artisan serve
This will be using 127.0.0.1 instead of localhost (default).
Leave the console and the artisan server process running. This is the Webserver listening for requests.
Run ngrok, type
ngrok http 8000
A forwarding link will appear similar to the one here: (Note that the forwarding link will be different for you)
Tunnel Status online
Version 1.7/1.6
Forwarding http://284abb77.ngrok.com -> 127.0.0.1:8000
Copy the http link and send it to anyone you want to access the website for development or testing reasons.
(Copying the https link will lead to HTML-only pages with no css/js)
Well this error occurs because in some parts of your css or bootstrap the links are as http and what you need to do is force them to change into https and its pretty simple all you have to do is
1: Go to App->Providers->AppServiceProvider
2: Inside the Register Function write this down
if (env(key: 'APP_ENV') !=='local') {
URL::forceScheme(scheme:'https');
}
3: Reload your website and youre good to go 😉
I just added a new meta tag to app.blade.php:
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
I have a Laravel and VueJs application. I recently migrated the application to Laravel Vapor.
I am using webpack code splitting feature.
https://docs.vapor.build/1.0/projects/deployments.html#code-splitting-dynamic-imports
The problem is, whenever I push new changes to vapor, any change that I have made related to VueJs/Javascript, doesn't reflects in the new deployment.
As per my understanding, the problem might be due to CloudFront Cache as vapor moves all public assets to CloudFront or it might be something else.
Please let me know, how can fix this.
Thanks
It was due to my mistake in the code. I was using the wrong CloudFront URL, it was hardcoded in .env ASSET_URL but Vapor generates a new URL on each fresh deployment and automatically injects it in .env file and that we have to use as per docs https://docs.vapor.build/1.0/projects/deployments.html#assets
Thanks
I made a Swagger, and try to deploy it to Heroku.
This swagger has been made with this package swagger for laravel.
It works fine on my localhost (http://localhost:8000/api/documentation).
I tried to deploy this Swagger on Heroku. It works fine with HTTP, and failed with HTTPS.
The error, with HTTPS, is :
Mixed Content: The page at 'https://school-back.herokuapp.com/api/documentation' was loaded over HTTPS, but requested an insecure stylesheet 'http://school-back.herokuapp.com/docs/asset/swagger-ui.css?v=8db32e4681a17f1b67d7ae8ca54724eb'. This request has been blocked; the content must be served over HTTPS.
I understand the problem. My question is how to parameter the swagger, or the conf of this package, to not have this kind of problem ?
Update your APP_URL env variable to APP_URL=https://school-back.herokuapp.com. I suspect because you're not including a protocol the framework has to guess what you mean when referencing your static assets.
Fairly new to Laravel here and I'm struggling to understand how to make Laravel 5.2 aware of where it resides. Here's the issue:
I set up auth using php artisan make:auth, and can now see the lovely landing page, as well as login and register links in the menu. The problem is that these links don't go to the right place. They point to /login and /register in the code respectively, which translates into http://localhost/login or http://localhost/register. But since I'm not on a production site yet and am developing locally, my website resides at http://localhost/projectname/public.
I've gone into config/app.php and tried various values for the URL parameter, but these have no effect.
What can I do to get these links to reflect the full site URL, without manually entering it each time?
you can run the development server in laravel using this command
php artisan serve
Did you try that?
Use laravel url function:
{{ url().'/login' }}
I'm developing an application that will eventually need to be fully HTTPS but I'm temporarily developing locally on HTTP.
If I use URL::to_asset('path', false) locally then I'd have to go and change every instance of that to true when I switch to HTTPS.
At the moment I'm thinking a Config::get('app.https', true) as the second argument would be the easiest way around this but I was wondering whether there's a more system-wide approach for ensuring your assets follow the routes (for example if I had an application that had partial usage of HTTPS routes it would be nice if Laravel automatically worked out whether you're on a HTTPS route and returned the correct asset link).
Or is it possible to get assets to use the "//domain.tld/path/to/something" approach
instead of manually setting it through configs you could use Request::secure() to check, if the request is done over HTTPS.
reference: laravel request information
Set HTTPS 'on' or 'off' in your web server's environment. That should propagate to Laravel, and result in http: or https: URL generation.
It may be worth adding that we run our Laravel apps on Elastic Beanstalk. EB terminates SSL at the Load Balancer, so Laravel "thinks" it's HTTP, when it's not. We use redirects to ensure all traffic is HTTPS from the outside, and set HTTPS=ON in the EB Dashboard settings so that assets aren't subject to redirects.
Tested on Laravel 5x, you can do like this:
asset('path_to_file', \App::environment() == 'production')
If you're in production, it will return true and load the asset via https, while returning false in development, loading via http.
If you are using Laravel 5.3 you can just use the Laravel asset() helper function. It loads assets using the current scheme of the request (HTTP or HTTPS)
You can find more details here