******* IMPORTANTE!!!! El httpinterceptor se dispara solo si se utiliza la clase HttpClient para invocar al servicio, si se utiliza Http, no se dispara!!! *******
Servidor
app.js
var express = require("express"),
app = express(),
bodyParser = require("body-parser"),
methodOverride = require("method-override");
app.use(function (req, res, next) {
res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With, content-type, x-access-token, Authorization');
res.setHeader('Access-Control-Allow-Credentials', true);
if (req.header('Authorization') == undefined)
return next();
if (req.header('Authorization') == "Bearer #112222")
{
console.log("Autorizado");
next();
} else
{
console.log("NO autorizado");
res.sendStatus(401);
}
});
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(methodOverride());
var router = express.Router();
app.use(router);
router.get('/prueba', function(req, res) {
var p = [{nombre: 'carlos', apellido: 'russo'},
{nombre: 'karina', apellido: 'ortiz'}];
res.send(p);
});
app.listen(8080, function() {
console.log("Node server running on http://localhost:8080");
});
Cliente
app.component.html
<div style="text-align:center">
<h1>Prueba de authentication con token</h1>
<button (click)="metodo1()">Method 1</button>
</div>
app.component.ts
import { Component } from '@angular/core';
import { HttpClient } from "@angular/common/http";
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
constructor(private httpClient: HttpClient) { }
metodo1(): void {
this.httpClient.get("http://localhost:8080/prueba").subscribe(
success => {
console.log("Ok!");
console.log(success);
}
);
}
}
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { InterceptorHttp } from './interceptorhttp'
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
HttpClientModule
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: InterceptorHttp,
multi: true
}
],
bootstrap: [AppComponent]
})
export class AppModule { }
interceptorhttp.ts
import {Injectable} from "@angular/core";
import {HttpEvent, HttpHandler, HttpInterceptor} from "@angular/common/http";
import {HttpRequest} from "@angular/common/http";
import {Observable} from "rxjs/Observable";
//import {Http, Headers, RequestOptions } from '@angular/http';
@Injectable()
export class InterceptorHttp implements HttpInterceptor {
constructor() {
}
intercept(req: HttpRequest<any>,
next: HttpHandler):Observable<HttpEvent<any>> {
console.log("interceptando!!!");
const customHeaderRequest = req.clone({
headers: req.headers.set('Authorization', 'Bearer #112222')
});
console.log(req);
return next.handle(customHeaderRequest);
}
}
No hay comentarios:
Publicar un comentario