Я занимаюсь разработкой Angular Project ... Бэкэнд работает должным образом ... Но я не могу получить ответ в угловом формате. Я включил ответ json при использовании через почтальон (ниже)
{"token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdHJVc2VySUQiOiJBRE1JTiIsImlhdCI6MTU1NTk0NzI3MywiZXhwIjoxNTU1OTU4MDczfQ.6NA_8hh6bXQ83UC5EwizKca_uo9VCxTvZR-aS9MMcmE",
"auth":true}
Но вместо того, чтобы регистрировать ответ json ... он показывает ошибку cors ... Я включил ошибку, которую я получаю из консоли (ниже)
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:5000/login/ADMIN/QSKJBCVIHQ/. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).[Learn More]
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:5000/login/ADMIN/QSKJBCVIHQ/. (Reason: CORS request did not succeed).[Learn More]
ERROR
Object { headers: {…}, status: 0, statusText: "Unknown Error", url: "http://localhost:5000/login/ADMIN/QSKJBCVIHQ/", ok: false, name: "HttpErrorResponse", message: "Http failure response for http://localhost:5000/login/ADMIN/QSKJBCVIHQ/: 0 Unknown Error", error: error }
core.js:15724
import { Observable } from 'rxjs';
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HttpErrorResponse, HttpClient } from '@angular/common/http';
import { Form, FormBuilder } from '@angular/forms';
import { CommonService } from '../CommonService/common.service';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
LoginForm: Form;
private router: Router;
strIP: string;
loginStatus: boolean;
loginTokenMessage: any;
constructor(private ClsCommon: CommonService, private http: HttpClient) {
this.http.get<{ ip: string }>('https://jsonip.com')
.subscribe(data => {
console.log('ip', data);
this.strIP = data.ip;
})
}
ngOnInit() {
}
private loginApiURL: string;
OnSubmit(UserID: string, UserPwd: string) {
this.loginApiURL = 'http://localhost:5000/login/' + UserID.toUpperCase() + '/' + UserPwd.toUpperCase() + '/'
this.http.get<Observable<{ token: string, auth: boolean }>>(this.loginApiURL, { headers: { 'Content-Type': 'application/json' } })
.subscribe(response => {
console.log(JSON.stringify(response));
})
}
}
Я добавил необходимый заголовок в app.js экспресс-бэкэнда
app.use(function (err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
res.setHeader('Access-Control-Allow-Credentials', true);
// render the error page
res.status(err.status || 500);
res.render('error');
});