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
未初始化。
我已经构建了一个 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
未初始化。