Skip to content
  • Home
  • Entertainment
    • 4cgandhi
    • pakainfo
    • Sports
    • Make Money
    • Jobs
  • News
    • Insurance
      • Auto Car Insurance
      • Business Insurance
    • Donate
    • California
  • About Us
  • Contact Us
  • Privacy Policy
  • Site Map
  • Terms
Angularjs Session Management with Login Authentication using PHP

Angularjs Session Management with Login Authentication using PHP

April 27, 2019 by admin

Angularjs Session Management with Login Authentication using PHP

In this Post We Will Explain About is Angularjs Session Management with Login Authentication using PHP With Example and Demo.Welcome on infinityknow.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to User authentication using AngularJS, PHP, MySQLExample

In this post we will show you Best way to implement How To Handle User Authentication With AngularJS, hear for Simple Angularjs login and logout script using php session and databasewith Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

Implementing Authentication in Angular Applications

index.html



  
  <title>Your Demo</title>
  
  
  
  <a href="http://live/app/js/jquery.min.js">http://live/app/js/jquery.min.js</a>
  <a href="http://live/app/js/bootstrap.min.js">http://live/app/js/bootstrap.min.js</a>



  <div></div>

  <a href="http://lib/angular/angular.js">http://lib/angular/angular.js</a>
  <a href="http://lib/angular/angular-route.js">http://lib/angular/angular-route.js</a>
  <a href="http://live/app/js/Chart.min.js">http://live/app/js/Chart.min.js</a>
  <a href="http://live/app/js/angular-chart.js">http://live/app/js/angular-chart.js</a>
  <a href="http://live/app/js/app.js">http://live/app/js/app.js</a>
  <a href="http://live/app/js/directives/loginDrc.js">http://live/app/js/directives/loginDrc.js</a>
  <a href="http://live/app/js/controllers/loginCtrl.js">http://live/app/js/controllers/loginCtrl.js</a>
  <a href="http://live/app/js/controllers/homeCtrl.js">http://live/app/js/controllers/homeCtrl.js</a>
  <a href="http://live/app/js/services/loginService.js">http://live/app/js/services/loginService.js</a>
  <a href="http://live/app/js/services/sessionService.js">http://live/app/js/services/sessionService.js</a>



live_check_session.php

live_destroy_session.php

employer.php

mail=='[email protected]' && $employer->pass=='123456789') 
		session_start();
		$_SESSION['empid']=uniqid('ang_');
		print $_SESSION['empid'];
?>

homeCtrl.js

'use strict';

app.controller('homeCtrl', ['$scope','$http','loginService', function($scope,$http,loginService){
	$scope.txt='infinityknow.com Page Home';
	$scope.logout=function(){
		loginService.logout();
	}
}])

loginCtrl.js

'use strict';

app.controller('loginCtrl', ['$scope','loginService', function ($scope,loginService) {
	$scope.msgtxt='infinityknow.com Login';
	$scope.login=function(data){
		loginService.login(data,$scope); //infinityknow.com call login service
	};
}]);

app.js

E-junkie: Sell digital downloads online

E-junkie Provides a Copy-paste buy-now, and cart buttons for selling downloads, codes and tangible products on any website, blog, social media, email and messenger!

Also see:

  1. The Top 10+ Best Webinar Software Platforms For 2020-2021
  2. Build Your Future Godaddy Careers And Jobs
  3. Introduction To Web Hosting Services

'use strict';
var app= angular.module('liveApp', ['ngRoute','chart.js']);
app.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/login', {templateUrl: 'partials/login.html', controller: 'loginCtrl'});
  $routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'homeCtrl'});
  $routeProvider.otherwise({redirectTo: '/login'});
}]);


app.run(function($rootScope, $location, loginService){
	var routespermission=['/home']; 
	var routesloginpermission=['/login'];
	$rootScope.$on('$routeChangeStart', function(){
		if( routespermission.indexOf($location.path()) !=-1)
		{
			var connected=loginService.islogged();
			connected.then(function(msg){
				if(!msg.data) $location.path('/login');
			});
		}
		if( routesloginpermission.indexOf($location.path()) !=-1)
		{
			var connected=loginService.islogged();
			connected.then(function(msg){
				if(msg.data) $location.path('/home');
			});
		}
	});
});

loginService.js

'use strict';
app.factory('loginService',function($http, $location, sessionService){
	return{
		login:function(data,scope){
			var $promise=$http.post('data/employer.php',data); //send data to employer.php
			$promise.then(function(msg){
				var empid=msg.data;
				if(empid){
					sessionService.set('empid',empid);
					$location.path('/home');
				}	       
				else  {
					scope.msgtxt='infinityknow.com incorrect information';
					$location.path('/login');
				}				   
			});
		},
		logout:function(){
			sessionService.destroy('empid');
			$location.path('/login');
		},
		islogged:function(){
			var $checkSessionServer=$http.post('data/live_check_session.php');
			return $checkSessionServer;
		}
	}

});

sessionService.js

'use strict';

app.factory('sessionService', ['$http', function($http){
	return{
		set:function(key,value){
			return sessionStorage.setItem(key,value);
		},
		get:function(key){
			return sessionStorage.getItem(key);
		},
		destroy:function(key){
			$http.post('data/live_destroy_session.php');
			return sessionStorage.removeItem(key);
		}
	};
}])

loginDirective.js

'use strict';
app.directive('loginDirective',function(){
	return{
		templateUrl:'partials/tpl/login.tpl.html'
	}

});

login.html

<div class="wrap">Call directive login form</div>

home.html

  <div class="container">
	<h2 class="text-center title-text">Your Demo</h2>
  </div>
  <nav class="navbar navbar-inverse">
    <div class="container">  
      <div class="container-fluid">
        <div class="navbar-header">
          <!-- <a class="navbar-brand" href="#">yourDemo</a> -->
        </div>
        <ul class="nav navbar-nav">
          <li class="active"><a title="Dashboard">Dashboard</a></li>
          <li><a title="Add Customer">Add Customer</a></li>
          <li><a title="Search">Search</a></li>
        </ul>
		<ul class="nav navbar-nav navbar-right">
		  <li><a title="Logout"> 
				<img src="partials/logout-button-icon.png" alt="logout" />
			</a>
		</li>
		</ul>
      </div>
    </div>
  </nav>  

  <div class="container">  
    <div class="row">
      <div class="col-sm-3">
		<div class="row">
			<div class="chart_box">
				
				
				<h4 class="text-center">Demo Chart</h4>
			</div>
		</div>

      </div>
      <div class="col-sm-8">
		<div></div>
        <ul id="dataSearchContent">
          <li id="quickLinkItem1623">
              <div class="card card0 ablue-grey adarken-1">
                  <div class="card-content awhite-text">
                      <div><span class="json-data">1623</span>
                      </div>
                      <div class="json-data" id="data-website_link1623"></div><span class="card-title black-text"><span class="json-data" id="data-title1623"><a class="search_page_popup_check myLink-parent" href="void(0)">{{glink.title}}</a></span></span>
                      <p id="data-description1623" class="json-data">{{glink.description}}</p><span class="json-data" id="data-is_quicklink1623">0</span>
                     
                      </p>
                  </div>      
                  <div class="card-action"><a class="btn btn-success">Edit</a>          <a class="btn btn-danger">DELETE</a></div>     
              </div>
          </li>

      </ul>
      </div>
      <div class="col-sm-1">
      </div>
    </div>

  <div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close">×</button>
          <h4 class="modal-title">Add Customers</h4>
        </div>
        <div class="modal-body">
			
				<form name="contactform" method="post" action="" class="form-horizontal" role="form">
   <div class="form-group">
	   <label for="website_link" class="col-lg-2 control-label">Website Link</label>
	   <div class="col-lg-10">
		   
	   </div>
   </div>
   <div class="form-group">
	   <label for="title" class="col-lg-2 control-label">Title</label>
	   <div class="col-lg-10">
		   
	   </div>
   </div>
   <div class="form-group">
	   <label for="description" class="col-lg-2 control-label">Descriptions</label>
	   <div class="col-lg-10">
		   <textarea class="form-control" rows="4" id="description" name="description"></textarea>
		   
	   </div>
   </div>
   <div class="form-group">
	   <div class="col-lg-offset-2 col-lg-10">
		   <button type="submit" class="btn btn-default">
			   Add Customer
		   </button>
	   </div>
   </div>
</form>

<p style="padding: 15px;margin: 0">{{ resultMessage }}</p>
				
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default">Close</button>
        </div>
      </div>

    </div>
  </div> 
  
<div class="modal fade" id="myModal" role="dialog">
	<div class="modal-dialog">
	  <!-- Modal content-->
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close">×</button>
				<h4 class="modal-title">{{datamodal}}</h4>
			</div>
			<div class="modal-body">
				<p>{{modelbody}}</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default">Lukk</button>
			</div>
		</div>
	</div>
</div> <!--model popup-->  

login.tpl.html

<div class="bs-example">
<form role="form" name="form1">
  <div class="form-group">
  	<!-- <p>Welcome : <span>{{employer.mail}}</span></p> -->
    <label for="exampleInputEmail1">Mail</label>
    
  </div>
  <div class="form-group">
    <label for="exampleInputPassword1">Password</label>
    
  </div>
  <button class="btn btn-default" type="submit">Submit</button>
  <p>{{msgtxt}}</p>
</form>
</div>

Example

READ :  Laravel Routing GET and POST Route parameters controller

I hope you have Got What is Simple Angularjs login and logout script using php session and database And how it works.I would Like to have FeadBack From My Blog(infinityknow.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(infinityknow.com) Are Most Always Welcome.

Categories AngularJs, MySQL, PHP, Technology Tags angular 6, angular 6 login authentication example, angular 6 login form with mysql, angular 6 login using php, angular 6 php login session, angular 6 session management php, angular 6 with php backend example, mysql, PHP, simple session with angular 6 and php, user authentication using angular 6 Leave a comment
Post navigation
Client side pagination in ng-repeat using Angularjs
Angular routeprovider pass multiple parameters
  • whatismyscreenresolution
  • tamilrockers new link 2019 free download
  • tamilrockers website link
  • tamilrockers new link 2019
  • tamilrockers url
© 2021 InfinityKnow • Powered by GeneratePress
Scroll back to top
↞
↠