Ionic 3 角 http.post 连接被拒绝来自 Firebase

Question

我在Firebase Static Hosting上部署了一个Ionic 3 Angular应用程序。 有问题的作品看起来像：

var data = {"message" : time,
"user_id" : user};
return new Promise((resolve, reject) => {
this.http.post(this.apiUrl+'/push', JSON.stringify(data))
.subscribe(res => {
resolve(res);
}, (err) => {
alert('error:' + err);
console.log('error is:' +  err);
reject(err);
});
});

apiUrl 是 Amazon EC2 托管的 REST 服务。此操作失败并显示错误： url 的状态为 0 的响应：null 和更多详细信息控制台日志显示：

POST https://ec2-XXX-XXX.compute-1.amazonaws.com/push net::ERR_CONNECTION_REFUSED

请求标头如下所示：

Request URL:https://ec2-XX-XXX-XX.compute-1.amazonaws.com/push
Referrer Policy:no-referrer-when-downgrade
Request Headers
Provisional headers are shown
Accept:application/json, text/plain, */*
content-type:text/plain
Origin:https://myapp.firebaseapp.com
Referer:https://myapp.firebaseapp.com/
User-Agent:Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1

我在 Oracle 计算基础服务器上有另一个部署。 在那里，这很好用。该服务器上的请求如下所示：

Request URL:http://ec2-XX-XXX-XX.compute-1.amazonaws.com/push
Request Method:POST
Status Code:200 OK
Remote Address:34.228.152.99:80
Referrer Policy:no-referrer-when-downgrade
Response Headers
(12)
Request Headers
view source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:39
content-type:text/plain
Host:ec2-XX-XXX-XX.compute-1.amazonaws.com
Origin:http://my-server-ip
Referer:http://my-server-ip/osc/
User-Agent:Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1

Answer 1

很可能是 CORS 问题，运行函数时浏览器检查器中可能会显示警告。

您需要一个名为poxy.conf.json的顶级文件，并用类似以下内容填充它

{
"/api/*": {
"target": "https://xxxx.com",
"secure": true,
"pathRewrite": {
"^/api": ""
},
"changeOrigin": true,
"logLevel": "debug"
}
}

然后在你的函数中做

let params = new HttpParams();
params = params.append('name', encodeURI(name));
params = params.append('email', encodeURI(email));
this._http.get('/api/mypageorfolder', { params: params }).subscribe(
data => {
//console.log("data",data);
});

因此，您执行查询字符串以https://xxxx.com/mypageorfolder/?name=&email=

和参考

import { HttpParams, HttpClient } from '@angular/common/http';
import {RequestOptions, Request, Headers } from '@angular/http';

记得重新启动您的应用程序