Ionic 3 - HerokuエンドポイントへのPOSTデータ

Question

したがって、バックエンドサービスがエンドポイントhttps://sample.herokuapp.com/のHerokuで実行されています。私は/bug/エンドポイントに次のようなJSONオブジェクトをPOSTしようとしています：

{ 
    "email": "email@gmail.com", 
    "name": "Anthony", 
    "text": "Test Bug", 
    "picture": "Empty" 
} 

私はポストマン不眠症かで、このデータをPOSTした場合、それは完璧に動作し、解析された情報をHTMLレスポンスを返します。私はイオン3に次のコードを使用して、このデータを、投稿するときしかし、

sendMail(type:string, text:string):void { 
      this.nativeStorage.getItem('sample').then((sample) => { 
        var data = new Object(); 
        data["name"] = sample.name 
        data["email"] = sample.email; 
        data["picture"] = sample.picture; 
        data["text"] = text; 

        this.db.object('/general/sample').take(1).subscribe((sample) => { 
         var xhr = new XMLHttpRequest(); 
         var endpoint = sample.address + sample.endpoints[type]; 

         xhr.addEventListener("readystatechange", function() { 
         if (this.readyState === 4) { 
          console.log("Got response: " + this.responseText); 
         } 
        }); 

         xhr.open("POST", endpoint); 
         xhr.setRequestHeader("Accept", "application/json"); 
        xhr.setRequestHeader("Content-Type", "application/json"); 
         console.log("sample sending: " + JSON.stringify(data, undefined, 2)); 
         console.log("sample endpoint: " + endpoint); 

        xhr.send(JSON.stringify(data)); 
        }) 
      }) 
    } 

私はHerokuの中で、次のエラーログを受け取った：私はこの問題について多くの研究を行っている

2017-07-05T17:02:24.707431+00:00 heroku[router]: at=info method=OPTIONS path="/bug" host=sample.herokuapp.com request_id=5e679c8e-cac7-4ff2-9277-dec80a250c11 fwd="150.108.242.198" dyno=web.1 connect=1ms service=3ms status=200 bytes=215 protocol=https 

これはCORSの問題だと私は信じています。しかし、私はAccess-Control-Allow-...ヘッダーを使ってこの問題を解決しようとしましたが、同じエラーが発生しています。

Cordova whitelistプラグインがインストールされており、index.htmlにmetaタグが含まれています。

これはかなり複雑な問題ですので、私はすべての助けに感謝します！

Answer 1

英雄側にはコルスが設定されていますか？

var app = express(); 
/* cors conig */ 
var corOptions = { 
    "origin": "*", 
    "methods": "GET,HEAD,PUT,PATCH,POST,DELETE", 
    "preflightContinue": true, 
    allowedHeaders: 'Content-Type,Authorization,X-Requested-With' 
} 
app.use(cors(corOptions)); 

私のCORS依存性： "CORS"： "^ 2.8.1" の角度HTTPオブジェクトを使用しない理由