Angular 5 或 6 个订阅在使用代理时不起作用

Angular 5 or 6 subscriptions don’t work when using proxy

我已经构建了一个 Java Restful API 我想从 Angular 访问它 5. 为了开发我有 angular 服务器 运行ning 在端口 4200 上,而我的后端 运行s 在 8080 上。我正在尝试在 angular 中设置代理以便与后端通信。 所以我创建了以下 proxy.conf.json 文件:

{
  "/**": {
    "target": "http://localhost:8080",
    "changeOrigin": true,
    "secure": false,
    "logLevel": "debug"
  }
}

然后我在终端运行

ng serve --proxy-conf proxy.conf.json

我收到消息

Proxy created: /**  ->  http://localhost:8080
[HPM] Subscribed to http-proxy events:  [ 'error', 'close' ]      

所以到目前为止一切都很好。

当我在浏览器中输入 url 例如

http://localhost:4200/incidents/all

一切正常,我收到了回复

[{"id":55,"protocolNo":121212222,"date":1525122000000,"isPayed":真,"yliko":"fdasdfasfsaf" ,"makro":"fdsa","anoso":"fdsa","mikro":"fdsafds","symperasma":"dfsdfsadf","klinikesPlirofories":"fsdafds","histo":"dfsadffga","simpliromatikiEkthesi":"fdsadfsdfa","patient":{"id":1, "firstName":"Μιχαήλ","lastName":"Τουτουδìκης","birthday":"1975-08-19","fatherName":"Δημήτριος","telephone": "6948571893","email":"mixtou@gmail.com","sex":true,"city":{"id":1,"name":"Γανιì"}} ,"doctor":{"id":1,"firstName":"όνομα","lastName":"επίθετο","telephone":"2821074737","email":"papa@papa.com","fatherName":"πατέρας","specialty":{"id":1,"name":"αγειοχειρουργική"},"city": {"id":1,"name":"Γανιì"}},"clinic":{"id":1,"name":"Λινική Τσεπέτη","telephone":"123456789","address":"Παπαναστασίου","email":"test@test.com"},"signingDoctor":{"id":1,"lastName" :"Δασκαλìκη","firstName":"^ννα"},"mikroskopikaSymperasma":null,"anosoEkthesi":null,"cancer":true},{"id":56, "protocolNo":11111,"date":1525640400000,"isPayed":false,"yliko":"dfsadfs","makro":"dfsfsdfdsdfsadfsa","anoso":"dfsdfsfdssfafasd","mikro":"dsfdfsadfsadfssdf","symperasma":"σδγσδγσαδγσγσασδγ","klinikesPlirofories":"δδφφγφγαφαγ","histo":"fdsasdfd","simpliromatikiEkthesi":"γαγσαδσγσδγσδαγ","patient":{"id":5,"firstName":"Στέφανος","lastName":"Μαριόλος","birthday":"2018-03-26" ,"fatherName":"","telephone":"4838583845","email":"","sex":true,"city":{"id": 2,"name":"Pέθυμνο"}},"doctor":{"id":3,"firstName":"Γαραλαμπος","lastName":"Πρωτοπαπαδìκης","telephone":"4343454345","email":"","fatherName":"","specialty":{"id":29,"name":"Πνευμονολογια - Φυματιολογία"},"city":{"id":1,"name":"ανιì"}},"clinic":{"id":1,"name":"Кλινική Τσεπέτη","telephone":"123456789","address":"Παπαναστασίου","email":"test@test.com"},"signingDoctor":{"id":1,"lastName":"Δασκαλìκη","firstName":"Λννα"},"mikroskopikaSymperasma":"γσαγδσασαδγδασγαγσγσ","anosoEkthesi":"φδαφγφγφδσγ","cancer":真}]

但是从 angular 访问后端端点我什么也没得到。 例如,对于事件,我有以下服务:

getIncidents(): Observable<Incident[]> {
    console.log('getting incidents');
    const incidentsUrl = '/incidents/all';
    return this.http.get<Incident[]>(incidentsUrl)
      .pipe(catchError(ErrorHandler.handleError));
  }

在 javascript 控制台中生成以下错误:

core.js:1440 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'push' of undefined
TypeError: Cannot read property 'push' of undefined

在以下行:

this.subscriptions.push(this.incidentsService.getIncidents().subscribe((results) => {
              this.comService.sendIncidents(results);
              this.spinner.hide();
            }));

这意味着 this.incidentsService.getIncidents() 什么都不返回?

有什么想法吗??

我删除了 this.subscriptions.push(...) 操作,一切正常。为什么在使用订阅时会发生这种情况。我需要它们,因为我调用 onDestroy subscription.unsubsribe() 来避免内存泄漏。 请注意,使用代理时会发生这种情况。如果我不使用代理并将项目部署到 tomcat 一切正常。我没有在 push() 中得到 null。 有什么想法吗???

问题出在订阅声明中。一开始是:

subscriptions: Subscription[];

我改成了

subscriptions: Subscription[] = [];

一切正常。

subscriptions

未初始化。