Angular 4 webapp 中的节点红色 HTTP GET 请求

Question

我正在构建一个使用 Node-red 的服务，仅在向 127.0.0.1:1880/hello[=53] 发送 GET 请求时发送电子邮件=] (node-red port) 被触发并且 Angular 4 webapp (127.0.0.1:3000) 到客户端访问。

当我从 浏览器 访问 thr /hello 页面时，我在我的个人电子邮件帐户中收到一封来自 node-red 的电子邮件。

问题是当按下按钮以测试对 node-red 的 http get 请求时，没有任何反应。

使用 Ubuntu 16.04 LTS

节点 8.15

npm 6.4

Node-RED 0.20.2

节点红流：

NODE-RED FLOW SEND EMAIL IMAGE

[{"id":"35dcdbd9.a99684","type":"tab","label":"Flow 1","disabled":false,"info":""},{"id":"dcdb9a4e.db2eb8","type":"debug","z":"35dcdbd9.a99684","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","x":450,"y":180,"wires":[]},{"id":"aa98d38f.846af","type":"e-mail","z":"35dcdbd9.a99684","server":"smtp.gmail.com","port":"465","secure":true,"tls":true,"name":"andre.def93@gmail.com","dname":"","x":500,"y":320,"wires":[]},{"id":"f1aea493.ec0e78","type":"http response","z":"35dcdbd9.a99684","name":"","statusCode":"","headers":{},"x":670,"y":260,"wires":[]},{"id":"747c3f58.892dd","type":"http in","z":"35dcdbd9.a99684","name":"","url":"/hello","method":"get","upload":false,"swaggerDoc":"","x":120,"y":260,"wires":[["dcdb9a4e.db2eb8","aa98d38f.846af","f1aea493.ec0e78"]]}]

Angular 4.1.3 应用

我的component.ts:

[...]
import { Http } from '@angular/http';
[...]
    constructor(
        private http: Http,
        [...]
    ) { }
[...]
    test(){
       this.http.get('http://127.0.0.1:1880/hello');
    }
[...]

我的component.html:

[...]
<button class="primary" (click)="test()">
    <div *ngIf="!issueInProgress">
        <span>TEST</span>
    </div>
</button>
[...]

谢谢大家！

Answer 1

有很多可能的问题。 首先，我推荐你使用http客户端。

（在应用程序模块中）：

import { HttpClientModule } from '@angular/common/http';
imports: [ .. ,HttpClientModule, .. ]

(在Component.ts（服务更好）

import { HttpClient } from '@angular/common/http';

.... 

 constructor(private http: HttpClient){}

test(){
 this.http.get<any>('http://127.0.0.1:1800/hello').subscribe(data=>{
 console.log("Work, recive: " + data);
},
err =>{
 console.log("Err, recive: " + err);
},
() => {
 console.log("Finish");
});
}

通过这种方式，您将能够看到错误是什么以及为什么它不起作用。

如果是 CORS 错误，请尝试：
https://github.com/node-red/node-red/issues/1347#issuecomment-363451534
或
https://thefrinkiac7.wordpress.com/node-red/enable-cors-with-node-red/

:)再见！