Đầu đề Angular2/Http (POST)

Question

Tôi không thể thay đổi tiêu đề khi thực hiện yêu cầu POST. Tôi đã thử một vài điều:

Simple lớp:

export class HttpService { 
    constructor(http: Http) { 
     this._http = http; 
    } 
} 

tôi đã cố gắng:

testCall() { 
    let body = JSON.stringify(
     { "username": "test", "password": "abc123" } 
    ) 

    let headers = new Headers(); 
    headers.append('Content-Type', 'application/json'); // also tried other types to test if its working with other types, but no luck 

    this._http.post('http://mybackend.local/api/auth', body, { 
     headers: headers 
    }) 
    .subscribe(
     data => { console.log(data); }, 
     err => { console.log(err); }, 
     {} => { console.log('complete'); } 
    ); 
} 

2:

testCall() { 
    let body = JSON.stringify(
     { "username": "test", "password": "abc123" } 
    ) 

    let headers = new Headers(); 
    headers.append('Content-Type', 'application/json'); // also tried other types to test if its working with other types, but no luck 

    let options = new RequestOptions({ 
     headers: headers 
    }); 

    this._http.post('http://mybackend.local/api/auth', body, options) 
    .subscribe(
     data => { console.log(data); }, 
     err => { console.log(err); }, 
     {} => { console.log('complete'); } 
    ); 
} 

không ai trong số hai đang làm việc. Tôi không quên nhập bất kỳ lớp nào.

Tôi đang sử dụng Google Chrome. Vì vậy, tôi kiểm tra tab 'Mạng', yêu cầu của tôi ở đó và nội dung của tôi là Loại văn bản/đồng bằng.

Đây có phải là lỗi hoặc tôi đang làm điều gì sai?

CẬP NHẬT Tôi quên để import lớp Headers từ Angular2/http:

import {Headers} from 'angular2/http'; 

Answer 1

Tôi nghĩ rằng bạn đang sử dụng sự hỗ trợ HTTP của Angular2 đúng cách. Xem bài viết này: https://plnkr.co/edit/Y777Dup3VnxHjrGSbsr3?p=preview.

Có thể, bạn đã quên nhập lớp Headers. Tôi đã mắc lỗi này một thời gian trước đây và không có lỗi trong bảng điều khiển JavaScript nhưng các tiêu đề mà tôi đã cố gắng đặt chưa thực sự được đặt. Ví dụ: về tiêu đề Content-Type tôi đã có text/plain thay vì application/json. Bạn có thể tái sản xuất này trong plunkr tôi cung cấp cho bạn bằng cách bình luận Headers trong nhập khẩu ...

Đây là một mẫu hoàn toàn làm việc (hàng nhập khẩu bao gồm):

import {Component} from 'angular2/core'; 
import {Http,Headers} from 'angular2/http'; 
import 'rxjs/Rx'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div (click)="executeHttp()"> 
     Execute HTTP 
    </div> 
    ` 
}) 
export class AppComponent { 
    constructor(private http:Http) { 

    } 

    createAuthorizationHeader(headers:Headers) { 
    headers.append('Authorization', 'Basic ' + 
     btoa('a20e6aca-ee83-44bc-8033-b41f3078c2b6:c199f9c8-0548-4be79655-7ef7d7bf9d20')); 
    } 

    executeHttp() { 
    var headers = new Headers(); 
    this.createAuthorizationHeader(headers); 
    headers.append('Content-Type', 'application/json'); 

    var content = JSON.stringify({ 
     name: 'my name' 
    }); 

    return this.http.post(
     'https://angular2.apispark.net/v1/companies/', content, { 
     headers: headers 
     }).map(res => res.json()).subscribe(
     data => { console.log(data); }, 
     err => { console.log(err); } 
    ); 
    } 
} 

Hy vọng nó giúp bạn, Thierry