2016-08-29 13 views
5

मैंने कोणीय 2 का उपयोग करके एक लॉगिन पृष्ठ लागू किया है। लॉगिन के बाद, मुझे सर्वर से jsonwebtoken, userId, userRole, userName मिलता है। मैं स्थानीय जानकारी में यह जानकारी संग्रहीत कर रहा हूं ताकि उपयोगकर्ता इसे किसी भी समय एक्सेस कर सके और उपयोगकर्ता को पृष्ठ रीफ्रेश करते समय लॉगिन स्थिति बनाए रख सके।कोणीय 2 प्रमाणीकृत राज्य

AuthService.ts

import {Injectable} from "@angular/core"; 

@Injectable() 
export class AuthService { 
    redirectUrl: string; 

    logout() { 
    localStorage.clear(); 
    } 

    isLoggedIn() { 
    return localStorage.getItem('token') !== null; 
    } 

    isAdmin() { 
    return localStorage.getItem('role') === 'admin'; 
    } 

    isUser() { 
    return localStorage.getItem('role') === 'user'; 
    } 

} 

लॉगिन स्थिति जांचने के लिए, मैं सिर्फ अगर टोकन LocalStorage में मौजूद है की जाँच कर रहा हूँ। चूंकि स्थानीय स्टोरेज संपादन योग्य है इसलिए स्थानीय स्टोरेज में किसी भी टोकन को जोड़ना लॉगिन पृष्ठ को बाईपास करेगा। इसी तरह, यदि ग्राहक स्थानीय स्टोरेज में उपयोगकर्ता भूमिका संपादित करते हैं, तो क्लाइंट आसानी से व्यवस्थापक या उपयोगकर्ता पृष्ठों तक पहुंच सकता है।

मैं इन समस्याओं को कैसे हल करूं?

यह एक सामान्य समस्या की तरह है, मैं जानना चाहता हूं कि वेबसाइटें लॉगिन स्थिति कैसे बनाए रखती हैं?

पीएस NodeJS सर्वर साइड लॉगिन कोड jsonwebtoken

const jwt = require('jsonwebtoken'); 
const User = require('../models/User'); 

/** 
* POST /login 
* Sign in using username and password 
*/ 
exports.postLogin = (req, res, next) => { 
    User.findOne({username: req.body.username}) 
     .then(user=> { 
      if (!user) { 
       res.status(401); 
       throw new Error('Invalid username'); 
      } 
      return user.comparePassword(req.body.password) 
       .then(isMatch=> { 
        if (isMatch != true) { 
         res.status(401); 
         throw new Error('Invalid password'); 
        } 
        let token = jwt.sign({user: user}, process.env.JWT_SECRET, { 
         expiresIn: process.env.JWT_TIMEOUT 
        }); 
        return res.status(200).json({ 
         success: true, 
         token: token, 
         userId: user._id, 
         role:user.role, 
         name:user.name 
        }); 
       }); 
     }) 
     .catch(err=>next(err)); 
}; 

शुक्रिया उत्पन्न करने के लिए

उत्तर

0

1) टोकन (एक बड़ा लंबाई के रूप में) अद्वितीय और लिखना कठिन हो करने वाले हैं। इसके अलावा, उन्हें कुछ आवृत्ति के साथ ताज़ा किया जाना चाहिए। oAuth docs पढ़ने के लिए बेहतर

2) भूमिकाओं को ग्राहक पक्ष पर संग्रहीत नहीं किया जाना चाहिए। केवल सर्वर पर जांच। इसके अलावा, ओएथ का उपयोग करते समय स्कोप का उपयोग करने पर विचार करें।

jwt.sign({user: user}, process.env.JWT_SECRET, { 
    expiresIn: process.env.JWT_TIMEOUT 
}) 

तो यह हस्ताक्षर अनुवर्ती अनुरोधों पर सर्वर साइड द्वारा सत्यापित किया जाना चाहिए:

0

आप डिजिटल रूप से सर्वर साइड पर प्रमाणीकरण टोकन करें। क्लाइंट टोकन की सामग्री को बदलता है जब यह अमान्य हो जाता है।

0

स्थानीय स्टोरेज/सत्र स्टोरेज में स्टोर टोकन और जब भी आवश्यक हो सर्वर के साथ टोकन मान्य करें। मैं निम्नलिखित कार्यान्वयन टोकन

UserProfileService.ts मान्य

@Injectable() 
export class UserProfileService { 
    private isLoggedIn: boolean = false; 
    private apiEndPoint: string; 
    constructor(private http: Http) { 
    this.apiEndPoint = environment.apiEndpoint; 
    } 

    login(token: string) { 
    localStorage.setItem('auth_token', token); 
    this.isLoggedIn = true; 
    } 

    logout(){ 
    localStorage.removeItem('auth_token'); 
    this.isLoggedIn = false; 
    } 

    isAuthorized(): Observable<boolean> { 
    if (!this.isLoggedIn) { 
     let authToken = localStorage.getItem('auth_token'); 
     if(authToken){ 
     let headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     headers.append('Accept', 'application/json'); 
     headers.append('Authorization', `Bearer ${authToken}`); 
     return this.http.get(`${this.apiEndPoint}/validate-token`, { headers: headers }) 
     .map(res => { 
      let serverResponse = res.json(); 
      this.isLoggedIn = serverResponse['valid']; 
      if (!this.isLoggedIn) { 
      localStorage.removeItem('auth_token'); 
      } 
      return this.isLoggedIn; 
     }) 
     .catch(this._serverError); 
     } 
    } 
    return Observable.of(this.isLoggedIn); 
    } 

    private _serverError(err: any) { 
    localStorage.removeItem('auth_token'); 
    if(err instanceof Response) { 
     console.log(err.json()); 
     return Observable.of(false); 
    } 
    return Observable.of(false); 
    } 

} 

AuthService.ts

@Injectable() 
export class CanActivateAuthGuard implements CanActivate, CanActivateChild, CanLoad { 
    constructor(private userProfileService: UserProfileService, private router: Router) { } 

    canLoad(route: Route) { 
    return this.userProfileService.isAuthorized().map(authorized => { 
     if(authorized) { 
     return authorized; 
     } else { 
     let url = `/${route.path}`; 
     this.router.navigate(['/login'], { queryParams: { redirectTo: url } }); 
     return authorized; 
     } 
    }); 
    } 

    canActivate(
    next: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
) { 
    return this.userProfileService.isAuthorized().map(authorized => { 
     if(authorized) { 
     return authorized; 
     } else { 
     this.router.navigate(['/login'], { queryParams: { redirectTo: state.url } }); 
     return authorized; 
     } 
    }); 
    } 

    canActivateChild(
    route: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
) { 
    return this.canActivate(route, state); 
    } 
} 
को हो रहा है