javascript - example - .then angular

cómo enviar una solicitud posterior usando http desde @ angular/http

Question

Estoy usando el siguiente código para enviar una solicitud de publicación

import { Http, Headers, Response } from ''@angular/http'';

@Injectable()
export class AuthenticationService {
    private _options = new Headers({''Content-Type'': ''application/json''});
    
    constructor(private http: Http) { }

    login(username: string, password: string) {
           return this.http.post(''http://localhost:56451/map'',
              { "username": username, "password": password },
              this._options);
    }
}

sin embargo, estoy obteniendo un error de seguimiento en vscode

Argument of type ''{ headers: HttpHeaders; }'' is not assignable to parameter of type ''RequestOptionsArgs''. Types 
 of property ''headers'' are incompatible. Type ''HttpHeaders'' is not assignable to type ''Headers''. Property ''forEach'' 
 is missing in type ''HttpHeaders''.

Por favor, ayuda a aclarar los conceptos asociados

Answer 1

Está mezclando clases: HttpHeaders va con HttpClient , que reemplaza a Http desde 4.3.

Los otros comentarios sobre 403 valen la pena investigar, pero como mínimo, haz esto:

import { HttpClient, HttpHeaders } from "@angular/common/http";
import { Observable } from ''rxjs/Observable'';
import ''rxjs/add/operator/map''

@Injectable()
export class AuthenticationService {
    private _options = { headers: new HttpHeaders({ ''Content-Type'': ''application/json'' }) };

    // Inject HttpClient, not Http
    constructor(private http: HttpClient) { }

    login(username: string, password: string) {
           return this.http.post(''http://localhost:56451/map'',
              { username, password },
              this._options);
    }
}

Tenga en cuenta que puede utilizar una asignación de desestructuración en el cuerpo de la publicación (cuando el nombre de la clave de objeto es el mismo que el nombre de la variable con el que lo está reemplazando).

Answer 2

Mi problema se debió a CORS, aunque habilité el complemento CORS chrome, aún porque estaba especificando opciones, se envió una respuesta previa al servidor que fue rechazada

La solución que ayudó fue poner la anotación CORS en mi controlador de reposo en Java, por lo que probablemente solo el código del servidor pueda ayudar aquí.

@CrossOrigin(origins = "*")  <------ this solved the issue of post request getting failed
@RestController
public class ProductController {...