如何在angular2中將標題設置為application/json

Question

我正在嘗試在 Angular2 中發送 HTTP post 請求，但無法將標頭設置為內容類型應用程序 JSON。

我的代碼是：

login(url,postdata)
{
    var headers = new Headers({'Content-Type': 'application/json'});
    return this._http.post(url,JSON.stringify(postdata),this.headers)
    .map(res => res.json())    
}

當我檢查網絡時，我發現 Content-Type 設置為文本/純文本，因此服務器沒有接收任何數據。 任何建議將不勝感激。

Answer 1

試試這個代碼：

private _getHeaders():Headers {
   let header = new Headers({
     'Content-Type': 'application/json'
   });

   return header;
}



public login(url, postdata){
   let options = new RequestOptions({
      headers: this._getHeaders()
   });
   return this.http.post(url, JSON.stringify(postdata),options).map(res => res.json());
}

Answer 2

更改_http.post參數：

login(url,postdata) {
    var headers = new Headers({'Content-Type': 'application/json'});
    return this._http.post(url,postdata,{headers:headers})
                .map(res => res.json())    
}

Answer 3

參考 Angular 2 Angular Http 指南@angular/http 已被棄用，@angular/common/http 應該是您在 Angular 2 應用程序中使用的那個。 因為如果您不指定 http 標頭，默認請求將作為 Content-Type text/plain 發送，修改 http 標頭的方法是：

import { HttpClient, HttpHeaders } from '@angular/common/http';
.....
const req = this.http.post('/api/PostRequest/',
                            JSON.stringify(object),
                            {
                             headers:new HttpHeaders()
                             .set('Content-Type','application/json')
                             }).subscribe();

Answer 4

你應該使用這樣的代碼

let headers = new Headers();
headers.append('Content-Type', 'application/json');

let options = new RequestOptions({ headers: headers });
return this.http.post(url, JSON.stringify(postdata), options).map(res => res.json());

Answer 5

2020 年的 Angular 9 版本

export class ApiService {

  private headers = new HttpHeaders({
    'Content-Type': 'application/json',
  });

  constructor(
    private http: HttpClient) {
  }

  get(path: string, params: HttpParams = new HttpParams()): Observable<any> {
    return this.http.get(`${environment.apiUrl}${path}`, {params, headers: this.headers});
  }
}