Я пытаюсь отправить запрос POST-выборки конечной точке API.
Запросы почтальона отлично работают с ожидаемыми результатами, но когда я использую asyn c fetch в моем angular приложении, целевой URL-адрес возвращается к компонентному маршруту, а не к URL-адресу, созданному с использованием переменной среды.
Вызов API происходит при отправке формы.
Переменная окружения apiUrl = 'http://localhost:8000'
Запрос указывает на http://localhost:4200/login
, но должен указывать на http://localhost:8000/api/auth/login
Компонент
import {Component, OnInit} from '@angular/core';
import {FormControl, FormBuilder, FormGroupDirective, NgForm, Validators} from "@angular/forms";
import {ErrorStateMatcher} from "@angular/material/core";
import {User} from "../models/user";
export class CustomErrorStateMatcher implements ErrorStateMatcher {
isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {
const isSubmitted = form && form.submitted;
return !!(control && control.invalid && (control.dirty || control.touched || isSubmitted));
}
}
@Component({
selector: 'app-login-page',
templateUrl: './login-page.component.html',
styleUrls: ['./login-page.component.scss']
})
export class LoginPageComponent implements OnInit {
email: string;
password: string;
loginForm;
emailFormControl = new FormControl('', [
Validators.required,
Validators.email
]);
matcher = new CustomErrorStateMatcher();
hide = true;
constructor(private formBuilder: FormBuilder) {
this.loginForm = this.formBuilder.group({
email: '',
password: '',
});
}
ngOnInit(): void {
}
async onSubmit(userData) {
await (new User()).login(userData.email, userData.password);
}
}
Класс пользователя
import {environment} from "../../environments/environment";
export class User {
email: string;
constructor() {}
async login(email, password) {
const user = await fetch( environment.apiUrl + '/api/auth/login', {
method: 'POST',
body: JSON.stringify({
email: this.email,
password: password
})
});
console.warn(user);
}
}