As stated in the docs, you can create a component in a custom path, which is different from the default views/livewire/ and Http/Livewire. Just for the sake of better organization, I created subfolders:
$ php artisan make:livewire tutorial/counter
So I got my files in the following paths:
views/livewire/tutorial/counter.blade.php
Http/Livewire/Tutorial/Counter.php
To test the component in a view, I created a /livewire/tutorial/welcome.blade.php which has the following:
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Livewire tutorial: counter</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght#400;600;700&display=swap" rel="stylesheet">
<!-- Styles -->
<style>
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}a{background-color:transparent}[hidden]{display:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}a{color:inherit;text-decoration:inherit}svg,video{display:block;vertical-align:middle}video{max-width:100%;height:auto}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-t{border-top-width:1px}.flex{display:flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.justify-center{justify-content:center}.font-semibold{font-weight:600}.h-5{height:1.25rem}.h-8{height:2rem}.h-16{height:4rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.leading-7{line-height:1.75rem}.mx-auto{margin-left:auto;margin-right:auto}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.ml-2{margin-left:.5rem}.mt-4{margin-top:1rem}.ml-4{margin-left:1rem}.mt-8{margin-top:2rem}.ml-12{margin-left:3rem}.-mt-px{margin-top:-1px}.max-w-6xl{max-width:72rem}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.p-6{padding:1.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.pt-8{padding-top:2rem}.fixed{position:fixed}.relative{position:relative}.top-0{top:0}.right-0{right:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.text-center{text-align:center}.text-gray-200{--text-opacity:1;color:#edf2f7;color:rgba(237,242,247,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#e2e8f0;color:rgba(226,232,240,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.underline{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-5{width:1.25rem}.w-8{width:2rem}.w-auto{width:auto}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}#media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:items-center{align-items:center}.sm\:justify-start{justify-content:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:h-20{height:5rem}.sm\:ml-0{margin-left:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:pt-0{padding-top:0}.sm\:text-left{text-align:left}.sm\:text-right{text-align:right}}#media (min-width:768px){.md\:border-t-0{border-top-width:0}.md\:border-l{border-left-width:1px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}#media (min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem}}#media (prefers-color-scheme:dark){.dark\:bg-gray-800{--bg-opacity:1;background-color:#2d3748;background-color:rgba(45,55,72,var(--bg-opacity))}.dark\:bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.dark\:border-gray-700{--border-opacity:1;border-color:#4a5568;border-color:rgba(74,85,104,var(--border-opacity))}.dark\:text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.dark\:text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}}
</style>
<style>
body {
font-family: 'Nunito';
}
</style>
#livewireStyles
</head>
<body class="antialiased">
<livewire:counter />
#livewireScripts
</body>
</html>
When I hit the route, I get the following error:
Livewire\Exceptions\ComponentNotFoundException Unable to find
component: [counter]
I already have tried:
$ php artisan livewire:discover
But I still get that error.
What Am I missing?
Solved
Just like Najmus suggested, I tried:
<livewire:path.to.counter />
And that did the trick!
Try this in the welcome.blade.php file
<livewire:tutorial.counter />
instead of
<livewire:counter />
you can create components under subdirectory using php artisan make:livewire users.register User is your folder name and register is component...
and if you want to move existing component then simply you can run this command php artisan livewire:mv register users.register
ie : livewire:mv {your component name} {your folder name}.{component name}
instead of mv you can use move also
may this will help
-Check your class name propely(if any spelling mistake made).
-Check header in class defined or not.
-If component is not there then create one:
php artisan make:liveware component_name
In my case, i typed the extension along with the file name that why it was showing error.
<livewire:abandoned-property-case-list.blade.php/>
But this should be
<livewire:abandoned-property-case-list/>
I am using laravel version 5.5.45 and trying to learn Blade for first time. I created a file views/layout/app.blade.php. And want to extend that app.blade.php file in views/contact.blade.php. I extended the master blade file using #yield.
Do I need to do any change in route folder?
views/layout/views/layout/app.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
#yield('content')
#yield('footer')
</body>
</html>
views/contact.blade.php
#extends('layouts.app')
#section('content')
<h1>Contact Pafg</h1>
#endsection
When I hit the URL localhost/cms/public/contact I see the error in title.
You need to add custom route in web.php which is located in routes directory.
At the end of file add following code to connect the defined route to your view.
Route::get('contact', function () {
return view('contact');
});
Finally you can access it via localhost/contact
First of all you need to put the request to get view on browser. Now assuming that your project name: cms lets assume you are calling cms/contacts ( this is a get request just to get simple blade view ). Now this will go to web.php in routes directory, where you need to handle that request e.g.
Route::get('contact', function() {
return view('contact');
})
here assuming your contact.blade.php is in your resources/views/contacts.blade.php path. if it is within any another nested directory need to add that directory name e.g. return view('directory_name/contact');.
You can perform same action using controller method in which case you need to specify controller and method name in route file and return blade in that method. e.g.
Route::get('contact', 'controller#methodName');
To return blade you need to use view('blade_name') helper of laravel and you don't have to call you request like cms/public/contact, simply use cms/contact url.
Hope this helps.
I'm using struts2 framework running on tomcat 7.0.77.
In the common filter, I've added SameSite cookie with below code:
Cookie cookie = new Cookie("SameSite", "strict");
cookie.setMaxAge(-1);
res.addCookie(cookie);
I'm using latest version of Chrome (Version 60.0.3112.90 (Official Build) (64-bit)) to test if it can avoid CSRF.
Assume the server to be protected is 192.168.1.100. And the other server is running on 192.168.1.101, with a very simple test.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=
, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
Click me!
</body>
</html>
So, I open a Chrome tab and logged in 192.168.1.100.
Then I open another Chrome tab to access https://192.168.1.101/test.html and
click "Click me!".
What I'm expecting is that when the I click this "Click me!", the link redirects me to https://192.168.1.100/home.html but the cookies shouldn't be passed. So I need to login again.
but the actual fact is I'm still in logged in state and all the cookies are passed which I can see from Chrome Developer tools.
Really confused where I'm wrong, appreciate your help!
Finally spent a whole day to figure it out.
We need to understand SameSite as an option instead of a key.
So we need to set a cookie like this:
Cookie cookie = new Cookie("SomeKey", "SomeValue; SameSite=strict");
cookie.setMaxAge(-1);
res.addCookie(cookie);
I have a trivial app where I'm trying to redirect the favicon per:
http://flask.pocoo.org/docs/0.10/patterns/favicon/
app = flask.Flask(__name__)
app.add_url_rule('/favicon.ico', redirect_to=flask.url_for('static', filename='favicon.ico'))
But this fails with:
RuntimeError: Attempted to generate a URL without the application context being pushed. This has to be executed when application context is available.
So, guessing, I try this:
app = flask.Flask(__name__)
with app.app_context():
flask.current_app.add_url_rule('/favicon.ico', redirect_to=flask.url_for('static', filename='favicon.ico'))
But get a different error:
RuntimeError: Application was not able to create a URL adapter for request independent URL generation. You might be able to fix this by setting the SERVER_NAME config variable.
What is going on?
According to the doc:
Setting a SERVER_NAME also by default enables URL generation without a request context but with an application context.
since you're using app_context, you may set the SERVER_NAME Configuration Value.
By the way, as the doc:Adding a favicon says:
<link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
the above line should be enough for most browsers, we don't have to do any other things.
Late answer, I've just run into the same problem. I don't see a big downside in handling the redirect like this instead:
#app.route('/favicon.ico')
def favicon():
return redirect(url_for('static', filename='favicon.ico'))
This prevents url_for from being called before the application is ready.
To give a counterpoint to using a link in the HTML only, it's a good practice for every site to have a favicon.ico and robots.txt at the root level - even if they're empty. It avoids problems like this and other unnecessary errors that adds noise to logs.
Don't put this in the app but in the html file
<html lang="en">
<head>
<title>{{ title }}</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width/2, initial-scale=1">
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
gotemplates
Hello!
I'm learning Go language now and trying to port some simple WEB code (Laravel 4).
Everything was well, until I tried to reproduce Blade templates into text templates.
I found that Go can load my CSS and JavaScript files only from the catalog with a name "bootstrap" only.
Here is my catalog tree which I tried to use:
start-catalog
bootstrap (link to bootstrap-3.3.1)
bootstrap-3.3.1
css
bootstrap.min.css
js
bootstrap.min.js
jquery
jquery (link to jquery-2.1.1.min.js)
jsquery-2.1.1.min.js
go_prg.go
Here are my templates:
base_js.tmpl
{{define "base_js"}}
{{template "login_1"}}
<script src = "/bootstrap/js/jquery"></script>
<script src = "/bootstrap/js/bootstrap.min.js"></script>
{{end}}
base_header.tmpl
{{define "base_header"}}
<head>
<title>PAGE TITLE</title>
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
</head>
{{end}}
If the catalog name differs from "bootstrap" Go language or Firefox can't load files from the templates above: bootstrap.min.css, bootstrap.min.js, jquery.
If I use not the link but the catalog name directly "bootstrap-3.3.1" than Go or Firefox can't load.
If all required files are moved under "bootstrap" I'm getting the results I expected (exactly the same as in Laravel 4).
To launch go language code the command go run go_prg.go was used.
Environment: Ubuntu 14.04, go-1.3.3, Firefox 31.
Who's wrong: Go language, Firefox or me?
Any help will be highly appreciated!
The problem described was caused by
http.Handle("/bootstrap/", http.StripPrefix("/bootstrap/", http.FileServer(http.Dir("bootstrap"))))
before any template was handled. It allowed access files under the directory 'bootstrap' only.
The problem was fixed by changing to
http.Handle( , http.StripPrefix(, http.FileServer(http.Dir("."))))
and adding to pathes for CSS and JavaScript files. Like so
/bootstrap/js/jquery">.