اعتبارسنجی در Angular 2 توسط JWT
نویسنده: علی یگانه مقدم
تاریخ: ۱۳۹۶/۰۲/۰۳ ۲۳:۴۵
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
login():any{
let urlSearchParams = new URLSearchParams();
urlSearchParams.append('username', 'Vahid');
urlSearchParams.append('password', '1234');
urlSearchParams.append('grant_type', 'password');
let body = urlSearchParams.toString();
let headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post('http://localhost:9577/login', body, { headers: headers })
.map(res => res.json());
} username=vahid&password=1234
ApiAdmin(token:any):any{
let headers = new Headers();
headers.append('Authorization', 'bearer ' + token);
return this._http.get('http://localhost:9577/api/MyProtectedApi', { headers: headers })
.map(res => res.json());
} import { Http, Headers, URLSearchParams } from '@angular/http';
import { Injectable } from '@angular/core';
import { Observable } from "rxjs/Observable";
import "rxjs/Rx";
@Injectable()
export class MemberShipService {
constructor(private _http: Http) { }
ApiAdmin(token: any): any {
let headers = new Headers();
headers.append('Authorization', 'bearer ' + token);
return this._http.get('http://localhost:9577/api/MyProtectedApi', { headers: headers })
.map(res => res.json());
}
login(): any {
let urlSearchParams = new URLSearchParams();
urlSearchParams.append('username', 'Vahid');
urlSearchParams.append('password', '1234');
urlSearchParams.append('grant_type', 'password');
let body = urlSearchParams.toString();
let headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
return this._http.post('http://localhost:9577/login', body, { headers: headers })
.map(res => res.json());
}
} Login(){
this._service.login()
.subscribe(res => {
localStorage.setItem('access_token', res.access_token);
localStorage.setItem('refresh_token', res.refresh_token);
}
, error => console.log(error));
} CallApi()
{
let item = localStorage.getItem("access_token");
if (item == null) {
alert('please Login First.');
return;
}
this._service.ApiAdmin(item)
.subscribe(res => {
alert(res);
}
, error => console.log(error));
} import { CanActivate } from '@angular/router';
import { Injectable } from '@angular/core';
@Injectable()
export class LoginGuard implements CanActivate {
constructor() { }
canActivate() {
let item = localStorage.getItem('access_token');
if (item == null)
return false;
return true;
}
} { path: 'component-one/:id', component: Component1Component,canActivate:[LoginGuard]} { path: 'component-one/:id', component: Component1Component,canActivate:[LoginGuard,SecondGuard]} import { Router } from '@angular/router';
import { CanActivate } from '@angular/router';
import { Injectable } from '@angular/core';
@Injectable()
export class LoginGuard implements CanActivate {
constructor(public router: Router) { }
canActivate() {
let item = localStorage.getItem('access_token');
if (item == null) {
this.router.navigate(['/app']);
return false;
}
return true;
}
} import { Router } from '@angular/router';
import { CanActivate, ActivatedRouteSnapshot } from '@angular/router';
import { Injectable } from '@angular/core';
@Injectable()
export class SecondGuard implements CanActivate {
constructor(public router: Router) { }
canActivate(route: ActivatedRouteSnapshot) {
let id = route.params['id'];
if (id == 1) {
return false;
}
return true;
}
} { path: 'component-one/:id', component: Component1Component,canActivate:[LoginGuard,SecondGuard] } if (tokenNotExpired('currentUser')) return true; public static void Register(HttpConfiguration config)
{
var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
config.Formatters.JsonFormatter.SupportedMediaTypes
.Add(new MediaTypeHeaderValue("application/json"));
} <system.webServer>
<modules runAllManagedModulesForAllRequests="true"></modules>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="*" />
<add name="Access-Control-Allow-Credentials" value="true" />
</customHeaders>
</httpProtocol>
<handlers>
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<!--<remove name="OPTIONSVerbHandler" />-->
<remove name="TRACEVerbHandler" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
</system.webServer> [EnableCors(origins: "*", headers: "*", methods: "*")]
public class ApiSettingsController : ApiBase
{
} public override async Task GrantResourceOwnerCredentials(OAuthGrantResourceOwnerCredentialsContext context)
{
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
} public override Task GrantRefreshToken(OAuthGrantRefreshTokenContext context)
{
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
} dotnet new --install Aro.SolutionTemplates::1.0.0