আমি একটি সুন্দর ডেমো তৈরির পাশাপাশি এই কয়েকটি পরিষেবা একটি ব্যবহারযোগ্য মডিউল হিসাবে পরিষ্কার করার প্রক্রিয়াধীন, তবে আমি এখানে যা এলাম তা এখানে। কিছু ক্যাভেটকে ঘিরে কাজ করার এটি একটি জটিল প্রক্রিয়া, সুতরাং সেখানে স্থির থাকুন। আপনাকে এটিকে কয়েকটি টুকরো টুকরো করে ফেলতে হবে।
এই নিমজ্জন একবার দেখুন ।
প্রথমত, ব্যবহারকারীর পরিচয় সংরক্ষণ করার জন্য আপনার একটি পরিষেবা প্রয়োজন। আমি এই কল principal
। এটি ব্যবহারকারীর লগ ইন হয়েছে কিনা তা যাচাই করা যেতে পারে এবং অনুরোধের পরে এটি এমন কোনও বিষয় সমাধান করতে পারে যা ব্যবহারকারীর পরিচয় সম্পর্কে প্রয়োজনীয় তথ্য উপস্থাপন করে। এটি আপনার যা প্রয়োজন তা হতে পারে তবে প্রয়োজনীয়গুলি হ'ল প্রদর্শন নাম, ব্যবহারকারীর নাম, সম্ভবত একটি ইমেল এবং কোনও ব্যবহারকারী যে ভূমিকা পালন করে (যদি এটি আপনার অ্যাপ্লিকেশনে প্রয়োগ হয়)। অধ্যক্ষেরও ভূমিকা চেক করার পদ্ধতি রয়েছে।
.factory('principal', ['$q', '$http', '$timeout',
function($q, $http, $timeout) {
var _identity = undefined,
_authenticated = false;
return {
isIdentityResolved: function() {
return angular.isDefined(_identity);
},
isAuthenticated: function() {
return _authenticated;
},
isInRole: function(role) {
if (!_authenticated || !_identity.roles) return false;
return _identity.roles.indexOf(role) != -1;
},
isInAnyRole: function(roles) {
if (!_authenticated || !_identity.roles) return false;
for (var i = 0; i < roles.length; i++) {
if (this.isInRole(roles[i])) return true;
}
return false;
},
authenticate: function(identity) {
_identity = identity;
_authenticated = identity != null;
},
identity: function(force) {
var deferred = $q.defer();
if (force === true) _identity = undefined;
// check and see if we have retrieved the
// identity data from the server. if we have,
// reuse it by immediately resolving
if (angular.isDefined(_identity)) {
deferred.resolve(_identity);
return deferred.promise;
}
// otherwise, retrieve the identity data from the
// server, update the identity object, and then
// resolve.
// $http.get('/svc/account/identity',
// { ignoreErrors: true })
// .success(function(data) {
// _identity = data;
// _authenticated = true;
// deferred.resolve(_identity);
// })
// .error(function () {
// _identity = null;
// _authenticated = false;
// deferred.resolve(_identity);
// });
// for the sake of the demo, fake the lookup
// by using a timeout to create a valid
// fake identity. in reality, you'll want
// something more like the $http request
// commented out above. in this example, we fake
// looking up to find the user is
// not logged in
var self = this;
$timeout(function() {
self.authenticate(null);
deferred.resolve(_identity);
}, 1000);
return deferred.promise;
}
};
}
])
দ্বিতীয়ত, আপনার এমন একটি পরিষেবা প্রয়োজন যা ব্যবহারকারীরা যে অবস্থাতে যেতে চায় তা যাচাই করে, তারা লগ ইন করেছে কিনা তা নিশ্চিত করে (যদি প্রয়োজন হয়; সাইন ইন, পাসওয়ার্ড পুনরায় সেট করা ইত্যাদির প্রয়োজন হয় না) এবং তারপরে একটি ভূমিকা পরীক্ষা করে (যদি আপনার অ্যাপ্লিকেশনটি থাকে তবে) এটি প্রয়োজন)। যদি এগুলি প্রমাণীকৃত না হয় তবে সাইন ইন পৃষ্ঠাতে তাদের প্রেরণ করুন। যদি এগুলি প্রমাণীকরণ করা হয় তবে কোনও ভূমিকা চেক করতে ব্যর্থ হয় তবে তাদের অ্যাক্সেস প্রত্যাখাত পৃষ্ঠায় প্রেরণ করুন। আমি এই পরিষেবা কল authorization
।
.factory('authorization', ['$rootScope', '$state', 'principal',
function($rootScope, $state, principal) {
return {
authorize: function() {
return principal.identity()
.then(function() {
var isAuthenticated = principal.isAuthenticated();
if ($rootScope.toState.data.roles
&& $rootScope.toState
.data.roles.length > 0
&& !principal.isInAnyRole(
$rootScope.toState.data.roles))
{
if (isAuthenticated) {
// user is signed in but not
// authorized for desired state
$state.go('accessdenied');
} else {
// user is not authenticated. Stow
// the state they wanted before you
// send them to the sign-in state, so
// you can return them when you're done
$rootScope.returnToState
= $rootScope.toState;
$rootScope.returnToStateParams
= $rootScope.toStateParams;
// now, send them to the signin state
// so they can log in
$state.go('signin');
}
}
});
}
};
}
])
এখন সব তুমি কি শুনতে যা করতে হবে ui-router
এর $stateChangeStart
। এটি আপনাকে বর্তমান অবস্থা, তারা যে রাজ্যে যেতে চায় সেগুলি পরীক্ষা করতে এবং আপনার অনুমোদনের চেক sertোকানোর সুযোগ দেয় gives যদি এটি ব্যর্থ হয়, আপনি রুট স্থানান্তর বাতিল করতে পারেন, বা অন্য কোনও রুটে পরিবর্তন করতে পারেন।
.run(['$rootScope', '$state', '$stateParams',
'authorization', 'principal',
function($rootScope, $state, $stateParams,
authorization, principal)
{
$rootScope.$on('$stateChangeStart',
function(event, toState, toStateParams)
{
// track the state the user wants to go to;
// authorization service needs this
$rootScope.toState = toState;
$rootScope.toStateParams = toStateParams;
// if the principal is resolved, do an
// authorization check immediately. otherwise,
// it'll be done when the state it resolved.
if (principal.isIdentityResolved())
authorization.authorize();
});
}
]);
যদি আপনি ইতিমধ্যে প্রমাণীকরণ করেছেন (বলুন, আপনি আগের সেশনের পরে পৃষ্ঠাটি পরিদর্শন করেছেন, এবং একটি কুকিতে একটি লেখক টোকেন সংরক্ষণ করেছেন, অথবা আপনি সম্ভবত কোনও পৃষ্ঠা সতেজ করে রেখেছেন, অথবা কোনও ব্যবহারকারীর পরিচয় সন্ধান করার কৌশলগত অংশটি এটির সন্ধান করছে) কোনও লিঙ্ক থেকে কোনও URL এ ফেলে দেওয়া হয়েছে)। যেভাবে ui-router
কাজ করে, আপনার লেখক পরীক্ষার আগে আপনাকে একবার নিজের পরিচয় সমাধান করতে হবে। আপনি resolve
আপনার রাষ্ট্রের কনফিগারেশনের বিকল্পটি ব্যবহার করে এটি করতে পারেন । সমস্ত রাজ্যের উত্তরাধিকার সূত্রে উত্তরাধিকার সূত্রে প্রাপ্ত সাইটটির জন্য আমার একটি প্যারেন্ট স্টেট রয়েছে, যা অধ্যক্ষকে অন্য কিছু হওয়ার আগেই সমাধান করতে বাধ্য করে।
$stateProvider.state('site', {
'abstract': true,
resolve: {
authorize: ['authorization',
function(authorization) {
return authorization.authorize();
}
]
},
template: '<div ui-view />'
})
এখানে আরও একটি সমস্যা আছে ... resolve
কেবল একবার কল করা হবে। পরিচয় অনুসন্ধানের জন্য আপনার প্রতিশ্রুতি একবারে শেষ হয়ে গেলে, এটি পুনরায় সমাধানের প্রতিনিধিটিকে চালায় না। সুতরাং আমাদের দুটি স্থানে আপনার লেখক চেকগুলি করতে হবে: একবার আপনার পরিচয়ের প্রতিশ্রুতি অনুসারে সমাধান হওয়া resolve
, যা আপনার অ্যাপ্লিকেশনটি প্রথমবার লোড হয় এবং একবার আপনি $stateChangeStart
যদি রেজোলিউশনটি সম্পন্ন করেন তবে একবার এটি রাজ্যের আশেপাশে নেভিগেট করার সময় কভার করে।
ঠিক আছে, তো আমরা এখন পর্যন্ত কী করেছি?
- ব্যবহারকারী লগ ইন থাকলে অ্যাপটি লোড হয় কিনা তা আমরা পরীক্ষা করে দেখি।
- আমরা লগ ইন ব্যবহারকারী সম্পর্কে তথ্য ট্র্যাক।
- আমরা তাদের সেই রাজ্যে সাইন ইন করতে পুনর্নির্দেশ করি যা ব্যবহারকারীদের লগ ইন করা প্রয়োজন।
- যদি তাদের কাছে এটি অ্যাক্সেসের অনুমোদন না থাকে তবে আমরা তাদের অ্যাক্সেস প্রত্যাখ্যানিত স্থিতিতে পুনর্নির্দেশ করি।
- আমাদের যদি লগ ইন করার প্রয়োজন হয় তবে তাদের অনুরোধ করা মূল স্থানে ব্যবহারকারীদের পুনরায় ডাইরেক্ট করার একটি ব্যবস্থা রয়েছে।
- আমরা কোনও ব্যবহারকারীকে সাইন আউট করতে পারি (আপনার লেখকের টিকিট পরিচালনা করে এমন কোনও ক্লায়েন্ট বা সার্ভার কোডের সাথে সংগীত সংযোজন করতে হবে)।
- আমরা না প্রত্যেক সময় তারা তাদের ব্রাউজার পুনরায় লোড করুন বা একটি লিঙ্কে ড্রপ সাইন-ইন পৃষ্ঠাতে ফিরে ব্যবহারকারীদের পাঠাতে হবে।
আমরা কোথায় এখানে থেকে যান? হ্যাঁ, আপনি অঞ্চলে যে সাইন ইন প্রয়োজন, আপনার রাজ্যের সাজাতে পারেন। আপনাকে জুড়তে দ্বারা প্রমাণীকৃত / অনুমোদিত ব্যবহারকারীদের প্রয়োজন হতে পারে data
সঙ্গে roles
(আপনি উত্তরাধিকার ব্যবহার করতে চান, অথবা তাদের একটি পিতা বা মাতা) এই রাজ্যের। এখানে, আমরা অ্যাডমিনগুলিতে একটি সংস্থান সীমাবদ্ধ করি:
.state('restricted', {
parent: 'site',
url: '/restricted',
data: {
roles: ['Admin']
},
views: {
'content@': {
templateUrl: 'restricted.html'
}
}
})
ব্যবহারকারীরা কোনও রুট অ্যাক্সেস করতে পারে তা আপনি এখন রাষ্ট্র-দ্বারা-নিয়ন্ত্রণ করতে পারেন। অন্য কোন উদ্বেগ? তারা লগ ইন করা হয়েছে বা না তার উপর ভিত্তি করে কোনও দৃশ্যের কেবলমাত্র অংশে ভিন্ন হতে পারে? সমস্যা নেই. আপনি শর্তাধীনভাবে কোনও টেম্পলেট বা কোনও উপাদান প্রদর্শন করতে পারেন এমন অসংখ্য উপায়ের সাথে principal.isAuthenticated()
বা এমনকি ব্যবহার করুন principal.isInRole()
।
প্রথমে principal
একটি নিয়ামক বা যেকোন কিছুতে ইনজেক্ট করুন এবং এটিকে স্কোপে আটকে দিন যাতে আপনি এটিকে আপনার দৃষ্টিতে সহজেই ব্যবহার করতে পারেন:
.scope('HomeCtrl', ['$scope', 'principal',
function($scope, principal)
{
$scope.principal = principal;
});
একটি উপাদান দেখান বা লুকান:
<div ng-show="principal.isAuthenticated()">
I'm logged in
</div>
<div ng-hide="principal.isAuthenticated()">
I'm not logged in
</div>
ইত্যাদি, ইত্যাদি। যাইহোক, আপনার উদাহরণ অ্যাপ্লিকেশনটিতে, আপনার হোম পেজের জন্য একটি রাজ্য থাকবে যা অরক্ষিত ব্যবহারকারীদের ছাড়তে দেবে। তাদের সাইন-ইন বা সাইন-আপ রাজ্যের লিঙ্ক থাকতে পারে বা সেই ফর্মগুলি সেই পৃষ্ঠাটিতে অন্তর্নির্মিত থাকতে পারে। যাই হোক না কেন আপনার মামলা।
ড্যাশবোর্ড পৃষ্ঠাগুলি সমস্তই এমন এক রাজ্যের উত্তরাধিকার সূত্রে প্রাপ্ত হতে পারে যার জন্য ব্যবহারকারীদের লগ ইন করা এবং বলা, একজন User
ভূমিকা সদস্য হতে হবে । আমরা যে সমস্ত অনুমোদনের বিষয়ে আলোচনা করেছি সেগুলি সেখান থেকে প্রবাহিত হবে।