Angular2。断点续传。无法使用正文发送帖子并设置内容类型

时间:2017-03-12 15:23:54

标签: angular typescript

我正在编写一个应用程序,使用Angular2作为前端部分(~2.4.0)和ASP.NET CORE作为后端部分。

发送帖子请求时遇到了一个非常大的问题。 Chrome告诉我,我的请求中没有正文,而且我也无法设置内容类型的请求。

我试过几个方面。但没有人工作

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

         let options = new RequestOptions({ headers: headers });
         this.http
         .post('http://localhost:5000/api/user/login', JSON.stringify(this.loginModel), options)
         .subscribe((result) => {
                     if (result) {
                         .......
                     }
                 });

第二

PostRequest(url:string,data:any) {
    var headers = new Headers();
    headers.append("Content-Type", 'application/json');

    var requestoptions = new RequestOptions({
        method: RequestMethod.Post,
        url: url,
        headers: headers,
        body: JSON.stringify(data)
    })

    return this.http.request(new Request(requestoptions))
        .map((res: Response) =>
        res.json()
    ).subscribe((result) => {
            if (result) {
                ....
            }
        });
}

第三个:

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


    let body = JSON.stringify(loginDto);
    let options = new RequestOptions({headers: headers});

    return this.http
        .post(
            '....',
            body,
            options
        )
        .map(res => res.json()).subscribe((result) => {
            if (result) {
                ....
            }
        });

UPD:

我已经尝试过@Akshay Khale方法但它仍然无法正常工作。我仍然会收到内容类型为

的标题

Headers of request

解决方案:

问题出在后端。 CORS配置以错误的方式进行。并且ASP.NET CORE阻止了所有自定义标头。感谢大家的帮助

3 个答案:

答案 0 :(得分:5)

问题出在后端。 CORS配置以错误的方式进行。并且ASP.NET CORE阻止了所有自定义标头。 感谢大家的帮助

P.S。

我在blog

中写了几行关于此问题的内容

答案 1 :(得分:2)

在您的代码中,第一个选项应该有效但在第二个参数中您不需要执行JSON.stringify

以下是正在运行的代码

它将使用Post请求和控制台转储返回的数据来命中给定的远程URL。

let body:any = { "parameter1": "value1", "parameter2": "value2" };
let url = "example.com";
let response:any;
let headers    = new Headers({ 'Content-Type': 'application/json' });
let options    = new RequestOptions({ headers: headers });
this.http.post(url, body, options).map((res:Response) => res.json()).subscribe(
                     data => { response = data },
                     err => console.error(err),
                     () => { console.log(response) });

很乐意帮助:) :) :)

答案 2 :(得分:-1)

由于您使用的是Angular 4 RequestOptionsArgs而不是RequestOptions,如下所示

此官方文档处于Experiemental状态

post(url: string, body: any, options?: RequestOptionsArgs) : Observable<Response>

将您的代码修改为,

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

let options : RequestOptionsArgs ={ 
    url: 'http://localhost:5000/api/user/login',
    method: RequestMethod.Post,
    search : '',
    headers : headers,
    withCredentials : 'false',
    responseType : ResponseContentType.Json
    }

this.http
.post('http://localhost:5000/api/user/login', 
             JSON.parse(this.loginModel), options)
             .subscribe((result) => {
                 if (result) {
                     .......
                 }
});