Я новичок в Angular (2,4). Я пытался подключиться к прокси-серверу.
Добавлен proxy.config.json
в корневой каталог проекта
{
"/api/*": {
"target": "http://<server_ip_address>:<port>",
"secure": false,
"changeOrigin": true,
"logLevel": "debug"
}
}
Затем добавили конфигурацию прокси в start
в package.json
"scripts": {
"ng": "ng",
"start": "ng serve --proxy-config proxy.config.json",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
Теперь в компоненте у меня есть метод входа для подключения к серверу.
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { AlertService, AuthenticationService } from '../services/index';
@Component({
moduleId: module.id.toString(),
templateUrl: 'login.component.html'
})
export class LoginComponent implements OnInit {
model: any = {};
loading = false;
returnUrl: string;
constructor(
private route: ActivatedRoute,
private router: Router,
private authenticationService: AuthenticationService,
private alertService: AlertService) { }
login() {
this.loading = true;
this.authenticationService.login(this.model.email, this.model.password)
.subscribe(data => {
localStorage.setItem('currentUser', JSON.stringify(data));
this.router.navigate([this.returnUrl]);
},
error => {
this.alertService.error(error);
this.loading = false;
},
() => {
console.log("Subscribed Else");
});
}
}
В службе аутентификации у меня есть следующий код.
import { Injectable } from '@angular/core';
import { Http, Headers, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
@Injectable()
export class AuthenticationService {
headers = new Headers();
constructor(private http: Http) {
this.headers.append("Content-Type", "application/json");
}
login(email: string, password: string) {
return this.http.post('/api/v1/login', { email: email, password: password }, { headers: this.headers })
.map(this.extractData)
.catch(this.handleError);
}
private extractData(response: Response) {
let user = response.json();
return user;
}
private handleError(error: Response | any) {
// In a real world app, you might use a remote logging infrastructure
let errMsg: string;
let resMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
resMsg = body['message'];
console.log(body);
console.log(resMsg);
} else {
resMsg = error.message ? error.message : error.toString();
}
return Observable.throw(resMsg);
}
}
Соединение работает нормально. Сервер отвечает надлежащими данными JSON. Но я бы мог войти в систему.
Реальная проблема
Это странно. Иногда он работает нормально, но в основном он показывает проблему даже после правильного подключения к серверу. Сервер отвечает данными JSON. Затем в терминальной консоли отображается
[HPM] Ошибка при попытке прокси-запроса/api/v1/login из localhost: 4200 в http://: (ECONNRESET) (https ://nodejs.org/api/errors.html#errors_common_system_errors)
Если я проверю консоль хром-сети, статус запроса ОК. Но на вкладке предварительного просмотра он показывает JSON с сервера, а затем добавляет следующую строку: "Ошибка при попытке прокси-сервера to: localhost: 4200/api/v1/login"
{"name":"something","id":"12sde"}Error occured while trying to proxy to: localhost:4200/api/v1/login
Из-за этого разбор JSON получает ошибку.
Почему выпуск происходит иногда и не всегда? И какова актуальная проблема?
P.S.: я использую angular - 4.0.0, angular -cli 1.0.2