角度のあるhttp投稿がヘッダーを送信していない

Question

private handleError (error: any) { 
    // In some advance version we can include a remote logging of errors 
    let errMsg = (error.message) ? error.message : 
     error.status ? `${error.status} - ${error.statusText}` : 'Server error'; 
    console.error(errMsg); // Right now we are logging to console itself 
    return Observable.throw(errMsg); 
    } 
    startCrawlJob(crawlvalues,username,password) { 
    let headers = new Headers({ 'Accept': 'application/json' }); 
    headers.append('Authorization', 'Basic ' + 
     btoa(username+':'+password)); 

    let options = new RequestOptions({ headers: headers }); 
    return this.http 
     .post('http://localhost:8090/Crawler_p.html',crawlvalues, options).map(res => 

     res.json() 

    ).catch(this.handleError); 

    } 

私の投稿要求でヘッダーを送信しようとしていますが、私の要求にヘッダーが見つかりません。上記のコードでは間違いの可能性があります。以下の はクロムの添付リクエストです。

Answer 1

@ Vivekの回答が正しいです。

あなたは何が起こっているかをよりよく理解するように、私は細部にもっと行くことを許可：

ブラウザはXHRオブジェクトは必ず、それが実際に許可されています作ることになり、追加の要求であるOPTIONS HTTP動詞を使用して、プリフライトリクエストを行い、要求を行う。

カスタムヘッダーを設定しない限り、プリフライトはありません。これらを設定するときは、承認ヘッダーと同様に、OPTIONS要求が実行されます。これには、@ Vivekが回答で指定した税関ヘッダは含まれていません。エンドポイントがプリフライト要求に応答しない理由を突き止め、その要求が成功すると、基本認証資格情報の値とともにAuthorizationヘッダーが表示されます。

ここにはjsfiddleがあります。ダミーのAPIにリクエストを行い、プリフライトリクエストが成功した後に動作することがわかります。 app.ts

Hereのコードを参照してください。このプリフライトリクエストの詳細については、こちらをご覧ください。 Chromeのネットワークモニタで

ルック：

そうで、ちょうど@Vivekが述べたように、あなたのは、うまく動作するはずができ、あなたのAPIリソースと間違っているものは何でも解決します。

Answer 2

添付した画像はOPTIONリクエストです。ヘッダはPOSTリクエストで表示されます。

オプションのリクエストが承認されると、その後に投稿リクエストが行われます。

問題は、許可されていません。サーバ側からコードを確認してください。角度からの問題ではありません。コードは良好です。

それが動作します。