Not able to load logo on the web - laravel

Hope you can clarify this issue:
I am trying to ad a favicon to my website in the head of my html layout, the link i am using is :
href="{{ asset('assets/public/images/favicon-32x32.png') }}"
I have my file in the following route:
backend/public/images/icon.png
the icon is not displaying on the web anyway, any idea about what can be the issue here?
thanks

as in laravel documentation
The asset function generates a URL for an asset using the current
scheme of the request (HTTP or HTTPS):
$url = asset('img/photo.jpg');
You can configure the asset URL host by setting the ASSET_URL variable
in your .env file. This can be useful if you host your assets on an
external service like Amazon S3:
// ASSET_URL=http://example.com/assets
$url = asset('img/photo.jpg'); // http://example.com/assets/img/photo.jpg
so if you use default ASSET_URL value in .env file and your favicon file in file structure like :
project_Folder/public/images/favicon.ico
so you need to make your link like
{{-- favicon --}}
<link rel="shortcut icon" href="{{ asset('images/favicon-32x32.png') }}">

Related

Laravel CSS asset function doesn't point to correct URL

I am using Laravel, in my layout blade template file (used by all my views) I have the following code to generate my stylesheet URL:
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
When the page is generated this appears like this: http://myapp.test/css/app.css which looks like its correct, I have a file in the following directory \resources\css\app.css.
When I try and access the css file directly via the URL, laravel throws a 404 error, can someoen tell me what I'm doing wrong?
If you aren't using mix.css or tailwind or anything, and are writing your own css, put it in /public/css/app.css
When you use {{ asset('css/app.css') }} , laravel points to public/app.css.
Browser can only access contents of inside public folder.
Laravel uses webpack which complies css file located inside resources/css and saves into public/css.
If you look inside webpack.mix.js located in root folder of your project you can see following:
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [
//
]);
So, if you access http://myapp.test/css/app.css , you should get css located in your public folder. you can confirm this from source tab of your browser's developer tools (i.e. page inspect).

How to use single css in a multi-tenant application

i'm developing a multi-tenant application with laravel & livewire.
I've a bootstrap template mounted such as a laravel project and i've integrated this template in my project.
For how the template is built, when I am on the localhost:8000/... views I get the correct rendering of the template, while when I go to the domain of a tenant, example: tenant.localhost:8000/... I completely lose the template.
I noticed that in resources/layout/default.blade to load all css and js there is a for loop that takes the css from the configuration file and loads them into the page
{{-- Global Theme Styles (used by all pages) --}}
#if(!empty(config('dz.public.global.css')))
#foreach(config('dz.public.global.css') as $style)
<link href="{{ asset($style) }}" rel="stylesheet" type="text/css"/>
#endforeach
#endif
using asset($style) when I go to the tenant domain, it looks for the css in a location that does not exist (the css are under localhost).
I thought of inserting an if-else inside the foreach loop in order to check the domain in the asset($style) and make sure that when in the tenant domain the css are searched as if we were in the localhost domain.
It's a good idea? do you have any advice or suggestions?
Now the asset location is changed for each tenant. You could 'hardcode' it.
Something like:
<link href='{{ env('APP_URL') }}/location/style.css'>
Another solution is to use the url() helper function instead of asset(), since it would generate an absolute path for the assets, this way you can use it in the same way as you use asset() function

css not working after passing id in url in laravel 5.6

My CSS is not working after passing an ID in an URL in Laravel 5.6
My route
Route::any('productdetail/{id?}','AdminController#productdetail');
The ID URL
<i class="icon-eye"></i>
I am using Laravel 5
This is the script tag:
<link rel="stylesheet" href="{{URL::asset('/css/style.css')}}">
Just use what #demo suggested.
asset('/css/style.css')
Or just
href="/css/style.css"
But never
href="../css/style.css"
Because if you later on change your current URL from 127.0.0.1:8000/productdetail/{id} to , let's say, 127.0.0.1:8000/productdetail/something/{id}, the asset will not be loaded properly anymore.
By using "/" in front of a source, you are telling the browser to start looking from the base URL, which is 127.0.0.1:8000/ in your case.
By omitting "/" in front of a source you are telling the browser to start looking from the current URL, which would be 127.0.0.1:8000/productdetail in your case, or even 127.0.0.1:8000/productdetail/{id} when you add your ID to it.
This problems occurs because we are using the relative path in our blade template and the solution is so simple, We have to use only the asset function to overcome this problem.
So change your code like this:
<link href="{{ asset('css/bootstrap.min.css') }}" rel='stylesheet' type='text/css' />
<script src="{{ asset('js/jquery.min.js') }}"> </script>

Mixed Content (laravel)

I get the following error (on every page)
app.js:703 Mixed Content: The page at 'https://sitename.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://sitename.com/index.php/getMessages'. This content should also be served over HTTPS.
The site is build with Laravel.
Is there anybody who knows how to fix this error?
In my case it's because I wasn't aware that the asset() function didn't handle https automatically (as pointed out by frankfurt-laravel's answer).
To get around this, since I don't use SSL in dev, I set ASSET_URL in the .env to the https url:
APP_URL=https://example.com
ASSET_URL="${APP_URL}"
This overrides the asset() function to use the https url, without having to modify the function at all. See the docs for more context.
If you are moving the website from HTTP to HTTPS, and it's was working perfectly on HTTP, and if you have added the new URL with https in config/app.php and also in the .env file then you may need to add the below snippet in your app/Providers/AppServiceProvider.php file's boot function and do not forget to add "use Illuminate\Support\Facades\URL;" at the top of the file to fix this error.
Please check attached for better sample code
use Illuminate\Support\Facades\URL;
public function boot()
{
URL::forceScheme('https');
}
I had same problem few days ago. Do you use Cloudflare? Change flexible SSL to Full.
I suggest to use the method argument $secure Laravel (5.6 has it definitely) provides:
When you use asset loading, e.g.
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
You can lookup the definition for asset(), if you have some kind of advanced IDE. If not, please check this file helpers.php.
However, the documentation says
/**
* Generate an asset path for the application.
*
* #param string $path
* #param bool $secure
* #return string
*/
So you just need to pass true as the second argument, and then the resource is loaded in a secure way. For above examples it would be
<!-- Scripts -->
<script src="{{ asset('js/app.js',true) }}" defer></script>
<!-- Styles -->
<link href="{{ asset('css/app.css', true) }}" rel="stylesheet">
Please note, this will cause conflict if you use php artisan serve, as artisan is not capable to serve via HTTPS protocol. Thus you need HTTPS setup e.g. with Valet on MacOS or Homestead on Windows. Follow the links for setup details.
Hope this helps, please let me know if it worked.
Make sure to remove trailing slashes from XMLHttpRequest endpoint URL.
If you are using Laravel Octane, I figured the fix by looking at octane.php config file.
Set your env to let octane inform upstream framework to use HTTPS.
OCTANE_HTTPS=true
Fixed the issues I was having with mixed-content and email verification signature failure.
In your .env file set your url to https APP_URL=https://sitename.com and in your config/app.php set url to 'url' => env('APP_URL', 'APP_URL=https://sitename.com'), that should solve your problem
I'm using Laravel 8 and Livewire 2. I created the app on Digital Ocean and to fix those issues, I had to do it like this:
<!-- Tailwind CSS -->
<link href="{{ secure_asset('css/app.css') }}" rel="stylesheet">
<!-- Alpine -->
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine#v2.x.x/dist/alpine.min.js" defer></script>
<!-- Scripts -->
<script src="{{ secure_asset('js/app.js') }}" defer></script>
#livewireStyles
I had to used secure_asset instead. That's on the Laravel Documentation.
I also had to change all "route" references for secure_url like this:
<form method="POST" action="{{ route('logout') }}">
<form method="POST" action="{{ secure_url('/logout') }}">
Hopefully this will help.
You opened the page 'https://sitename.com/' . But the javascript of this page sent an http request, not https.
You should change your javascript code to send https request.
There are two ways to send https request:
Put the protocol together with path.
$.get('http://sitename.com/index.php/getMessages')
Ignore the protocol, but put '//' before the path
$.get('//sitename.com/index.php/getMessages')

flask blueprint for custom static folder not working in templates using url_for

I am trying to use a blueprint to serve some of my js and css files from a folder than /static. I want these files to be available from the root. I have registered the following blueprint with the app:
custom = Blueprint('/', __name__, static_folder='custom', static_url_path='/custom')
app.register_blueprint(custom)
I can find the desired files in the expected place, ie. /custom/custom.css by putting this url directly into the browser, however, I am not able to access them in templates using url_for like this:
<link href="{{ url_for('custom', filename='style.css') }}" rel="stylesheet">
I get: BuildError: ('custom', {'filename': 'style.css'}, None)
I have tried any number of combinations ie.:
custom = Blueprint('custom', __name__, static_folder='custom', static_url_path='/custom')
with
<link href="{{ url_for('custom.custom', filename='style.css') }}" rel="stylesheet">
etc but nothing is working for me.
You need to use the blueprint's static endpoint.
url_for('custom.static', filename='custom.css')

Resources