Grails Simple Login
-
Upload
moniguna -
Category
Self Improvement
-
view
49.106 -
download
1
description
Transcript of Grails Simple Login
![Page 1: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/1.jpg)
Grails tutorialSimple login/logout
http://khomkrit.wordpress.com
![Page 2: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/2.jpg)
Part ICreate View
![Page 3: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/3.jpg)
Prepare Artifact
Create Grails Application
> grails create-app simple-login
and Create a Controller named user, used to handle user activity such as login and logout.
> grails create-controller user
![Page 4: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/4.jpg)
Prepare Artifact
Create a file named “index.gsp” in
grails/views/user/ Directory
![Page 5: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/5.jpg)
Custom Login PageCustom the “index.gsp” file created recently
![Page 6: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/6.jpg)
Custom Login Page
Create HTML textfield for username/password
add some style
Custom the “index.gsp” file created recently
![Page 7: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/7.jpg)
Custom Login Pagecreate a form using <g:form> tag
![Page 8: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/8.jpg)
Custom Login Page
if you don’t want to use <g:form> tag you can use HTML form instead! Because in finally, Grails will generate plain HTML form to you.
I prefer to use <g:form> tag, it’s make sense and give more semantic and info about what controller and what action will accepts from form request.
<g:form action=”login”/>
![Page 9: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/9.jpg)
Custom Login Page
send form request to action named “login”
and What Controller? If you don’t specify a controller name it will send request to default controller corresponding with the name of file directory.
In this situation, index.gsp is in /grails-app/user/ directory. So, It will send request to user controller.
<g:form action=”login”/>
![Page 10: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/10.jpg)
Custom Login Page
Anyway, You can add the specific controller to which you want to sent request.
<g:form controller=”user” action=”login”/>
![Page 11: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/11.jpg)
Start Grails Application by using this command
> grails run-app
Go to http://localhost:8080/simple-login/user
![Page 12: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/12.jpg)
Now, you cannot do anything with the form. If you click the Login button, the error will occurs. Why?
Because the target action specified by you in the previous is not created.
![Page 13: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/13.jpg)
What is the action specified by you?
Back to the login.gsp you will see this...
![Page 14: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/14.jpg)
What is the action specified by you?
Back to the login.gsp you will see this...
Yes, action named “login” will get the form request.
![Page 15: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/15.jpg)
Part IILet’s create the Action
![Page 16: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/16.jpg)
Tip
You can make most changes, including changes to the domain and controller classes, without having to restart the web server.
Sometimes, however, change require a restart. Creating a new controller sometimes requires a restart
![Page 17: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/17.jpg)
Let’s create the action
All action is declared in the controller file. In this case, you want to send request to controller named “user” and action named “login”
go to UserController.groovy to create the “login” action.
![Page 18: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/18.jpg)
Custom Controller
all Controller is in
/grails-app/controllers/ directory
![Page 19: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/19.jpg)
Custom Controller
Open UserController.groovy
and Create an action named “login”
![Page 20: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/20.jpg)
Custom Controller
Go to http://localhost:8080/simple-login/user/
and Click the Login Button
![Page 21: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/21.jpg)
Custom ControllerOOP! Grails sent 404 back! Why?
![Page 22: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/22.jpg)
Custom ControllerBy Default, When you call any action, Grails try to search for a file which has name corresponding with the action name called by client.
In this case you try to http://localhost:8080/simple-login/user/login, this url means you try to call action named “login” in the user controller
So, Grails try to find a file named “login.gsp” in /grails-app/views/user/ directory for render to client.
you don’t have that file!
![Page 23: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/23.jpg)
Custom Controller
You don’t have the login.gsp file for Grails, It’s make Grails don’t know what should to render back to client.
You can use “render” method for tell Grails what it should to render back.
![Page 24: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/24.jpg)
Custom Controller
Go to http://localhost:8080/simple-login/user/
and Click the Login Button again.
![Page 25: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/25.jpg)
Custom Controller
Good Responding :)
![Page 26: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/26.jpg)
Custom ControllerYou can add some your logic to handle login such as keep login status in the session and send some message back to user like “you have logged in” or “your login failed” in the login action.
You can add some logic to handle login here
![Page 27: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/27.jpg)
Part IIIAdd some Logic to Handle the Login
![Page 28: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/28.jpg)
ValidationAdd simple validation to check username and password sent from client
all parameters sent from client is stored in variable named “params”
So, the code will look like this...
![Page 29: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/29.jpg)
Validation
For testing, go to login page and try to login again.
If username is “admin” and password is “pass” then you can login, else cannot.
![Page 30: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/30.jpg)
ValidationDon’t You want to use ugly responding when user try to login?
Next, After user has logged in, the Grails application will redirect user to the login page again and give some info using “flash” variable.
About flash scope is out of this tutorial topic but you can investigate that how to use flash through this tutorial.
![Page 31: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/31.jpg)
Using flash
use flash variable to store some message as the following code and redirect to the login page (index.gsp) .
![Page 32: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/32.jpg)
Using flash
redirecting user to action named “index” .By default, Grails will search for file named “index.gsp” in grails-app/views/user/ directory.
flash message sent to action named “index” by the last command in login action and also through to index.gsp
So, You can access the flash message in action named “index” and also access it in “index.gsp”
![Page 33: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/33.jpg)
Using flashAdd ${flash.message} in login page If it has something in, it will show message
To display value in a variable you can use this pattern ${variable-name}
![Page 34: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/34.jpg)
Using flashTesting, Go to login page and try to login again.
After try to login, you will see value in flash.message sent from login action.
![Page 35: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/35.jpg)
Keep Status
You can use “session” to keep information about login status.
Keep some info by using session variable
![Page 36: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/36.jpg)
Handle LogoutCreate a new action named “logout” to handle when user want to logout.
session.user keep status that the user has logged in, so you should clear all info about logged in user.
New action
![Page 37: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/37.jpg)
Custom Login pageAdd some logic more, if user has logged in then do not show login form and show a logout link instead.
Use <g:if>, <g:else> tag to test something.
![Page 38: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/38.jpg)
Custom Login pageUsing <g:if> tag
<g:if test=”${boolean-logic}”>
<g:if test=”${5 == 6}”>
Example:
![Page 39: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/39.jpg)
Custom Login page
Creating a link to logout action, you can use <g:link> as the following.
![Page 40: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/40.jpg)
Custom Login pageAnyway, you can use HTML link tag - <a href=””> , instead. But I prefer to use <g:link> with the same reason of why I prefer to use <g:form>
<g:link controller=”” action=””>
<g:link action=””>
If you do not specify controller name, Grails will automatic search for controller like <g:form> behavior.
![Page 41: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/41.jpg)
Check Point!Now you have a login page.
If you login succeed, You can see a logout link and the login form has thrown away.
If you login fail, the login form still be with you.
After you try to login, Whatever the result is fail or succeed have you got. You always see a flash message.
![Page 42: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/42.jpg)
Add some more thingGrails has a default CSS and you can use its like the following.
Use build in CSS, class=”message”
![Page 43: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/43.jpg)
Add some more thingAs you can see, the style has applied to flash.message value
![Page 44: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/44.jpg)
Add some more thing
For another style, you can see in the /web-app/css/ directory
Other resource is in /web-app/images/ and web-app/js directory
![Page 45: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/45.jpg)
Q/AHave any Question?
![Page 46: Grails Simple Login](https://reader034.fdocuments.us/reader034/viewer/2022051107/53fc28fc8d7f7288518b45bf/html5/thumbnails/46.jpg)
Thank You
Sorry about many wrong grammar in this slide :D