1
resposta

Consumindo minha própria API

Olá, estou tenta realizar o curso utilizando minha própria API e ela tem o content-Type: application/x-www-form-urlencoded no header e não sei como fazer a requisição no autenticação service.

1 resposta

Olá Hugo, tudo bem com você?

Peço desculpas pela demora em obter um retorno.

Para realizar uma requisição com o cabeçalho Content-Type: application/x-www-form-urlencoded em Angular, você precisa importar o serviço HttpClient fornecido pelo Angular para fazer a requisição HTTP e utilizar o método POST. No código abaixo, um exemplo de como realizar este consumo da API:

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class AuthenticationService {
  private apiUrl = 'http://suaapi.com.br';

  constructor(private http: HttpClient) {}

  authenticate(username: string, password: string) {
    const headers = new HttpHeaders({
      'Content-Type': 'application/x-www-form-urlencoded',
    });

    const body = `username=${username}&password=${password}`;

    return this.http.post(`${this.apiUrl}/auth`, body, { headers });
  }
}

Todavia, vale ressaltar que como não tenho acesso ao cenário completo do projeto incluindo a estrutura da sua API, outros testes terão de ser feitos a fim de obter o resultado esperado. Além disso, se me permite, recomendo que em um primeiro momento você siga o passo a passo apresentado durante as aulas, inclusive a mesma API utilizada, pois isso ajudará a evitar possíveis erros que possam dificultar seu progresso no curso. A API utilizada no curso pode ser baixada através deste link, descompacte a pasta, instale as dependências através do comando npm i dentro da pasta api e execute npm start para que a API seja iniciada.

Espero que esta resposta seja um bom ponto de partida para a resolução do seu objetivo.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!