Session Expired
Session Expired
In Web Application development, many times we come across a situation where we need to check if our session is expired or not.
What is session expired?
Session_Expired is a server-side event, meaning it is triggered on the web server and has nothing to do with a request by the client.
1. On each client request, check if a specific Session variable is set. If it is not, it means the previous Session has expired and the new Session must be populated.
2. Have a javascript call on the client that periodically goes back to the server to check if the Session is still valid. If the Session has expired, you can warn the user that their Session is about to expire.
3. On each client request, we can check if our session is valid or not.
In my demo I am going with third step where on each client request I am calling a method to check that if my session is still available or not.
I have a SAP Gateway response were we get a popup to enter our system username and password for validation.
SAP Gateway server asks to login again if we have crossed some time limit that means our session has been expired.
In many web based developments we force our users to login again to the website if they are victim of session expired event. 🙂
I have created a simple SAPUI5 application. This is the structure. For demo purpose I have created three html files for navigation. You can do it with views also.
Now this is the code in my Index.html.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons,sap.m"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
sap.ui.localResources("sessionexpired");
var view = sap.ui.view({id:"idview11", viewName:"sessionexpired.view1", type:sap.ui.core.mvc.ViewType.JS});
view.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Now this is the code in my Index2.html. Simply I have kept buttons in both index2.html and index3.html file.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons,sap.m"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
var oButton = new sap.m.Button({
text: "Expired"
});
oButton.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>Now this is the code in my Index3.html.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons,sap.m"
data-sap-ui-theme="sap_bluecrystal">
</script>
<!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->
<script>
var oButton = new sap.m.Button({
text: "NOT EXPIRED"
});
oButton.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>This is my view’s code.
sap.ui.jsview("sessionexpired.view1", {
/** Specifies the Controller belonging to this View.
* In the case that it is not implemented, or that "null" is returned, this View does not have a Controller.
* @memberOf sessionexpired.view1
*/
getControllerName : function() {
return "sessionexpired.view1";
},
/** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed.
* Since the Controller is given to this method, its event handlers can be attached right away.
* @memberOf sessionexpired.view1
*/
createContent : function(oController) {
var oButton = new sap.m.Button({
text: "Check Session Expired",
press: oController.checkForSession
});
return oButton;
}
});This is my controller’s code.
sap.ui.controller("sessionexpired.view1", {
checkForSession : function(){
var str="chksession=true";
jQuery.ajax({
type: "GET",
url: "proxy/http/HOST:PORT/sap/opu/odata/sap/ZDC_TEST_SRV/",
data: str,
cache: false,
success: function(res){
if(res == "1") {
alert('Your session has been expired!');
window.location.replace("index2.html");
}else{
alert('Your session has not been expired!');
window.location.replace("index3.html");
}
}
});
}
});References:-
http://stackoverflow.com/questions/12502295/redirect-to-login-page-after-session-timeout
http://w3lessons.info/2014/01/01/how-to-check-expired-sessions-using-php-jquery-ajax/
I generally use simple codes for better understanding. You may always go with complicated ones.
Regards
Dhananjay
Hello Dhananjay, Does this mean that with every service request you first call the session check service and if the response is true, you call your application service? Would this not lead to an increase in the number of round trips per request?
What we have done is handle the global ajax error handler where we regex for our application service end point. If the error response has this path and if the error code happens to be:
302/303 (redirect), or 4xx/5xx with the response header having x-sap-origin-location (as this is the case in an OP HANA System where the redirect URL in case of session timeout is the form login page) or we also handle window.onerror and here we check for specific regex messages that deal with Network not reachable (as this is the case in HCP + XS stack), we fire our Timeout event which is our custom event. Here we handle, maybe a dialog with the message. Just our experience.
How are you dealing with OData timeouts? If you do an OData binding to a control and if the session has timed out, there are no ajax events fired.
Thanks,
Niranjan
Code samples using Comic Sans? Brrr....
It's most likely a good blog on a very valid topic, but I couldn't read further since my eyes are bleeding 😐
Hi experts Dhananjay Choubey and Robin van het Hof
Can you please elaborate on option #2:
I have a requirement to display timeout warning to user and upon press of the "extend" button make a call to backend to keep gateway session alive and to reset timer. this should be done in Component.js?
Hello,
I'm facing the same requirement as Shanir Tvaija. I'm following this SAP wiki but I can't keep anything clear to do the task. ¿Any advice? Thanks!