Question

我正在尝试使用angularJS 2 http。

的post方法

我的休息电话如下：

saveCourse(Course: any) {
    let url ='https://server/CoursesWebApi/api/courses/insert';
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('Accept', 'application/json');
    let options = new RequestOptions({ headers: headers});
    return this._http.post(url, { data: Course }, options)
        .toPromise()
        .then(res => res.json().data)
        .catch((err: any) => {
            console.log(err);
            return Promise.reject(err);
        });
}

课程对象在进行字符串化时，如下所示：

＆＃34; {＆＃34; Title＆＃34;：＆＃34; Test title＆＃34;，＆＃34; AuthorId＆＃34;：＆＃34; scott-allen＆＃34;，＆＃34 ;分类＆＃34;：＆＃34;软件架构＆＃34;＆＃34; CourseLength＆＃34;：＆＃34; 2＆＃34;＆＃34; CourseId＆＃34;：＆＃34;测试-ID＆＃34;}＆＃34;

我已尝试过字符串化和非字符串化版本。当我在chrome中调试时，我得到两个版本的以下错误：

状态响应：URL为0：null

据我所知，状态为0（零）意味着它甚至从未进入过webapi服务器。我启用了CORS，我在示例reactJS应用程序中使用类似的方法，使用axios并调用相同的webapi，它可以工作。我安装了失眠的json工具，并使用以下json格式执行了帖子，它起作用了：

{ ＆＃34; CourseId＆＃34;：＆＃34;史蒂夫＆＃34;，＆＃34; AuthorId＆＃34;：＆＃34; cory-house＆＃34;，＆＃34;标题＆＃34;：＆＃34;测试标题＆＃34;，＆＃34; CourseLength＆＃34;：＆＃34; 12：40＆＃34;，＆＃34;类别＆＃34;：＆＃34;测试类别＆＃34; }

我不确定我做错了什么。我的asp.net webapi看起来像这样：

[HttpPost]
[Route("CoursesWebApi/api/courses/insert/")]
public IActionResult PostCourse([FromBody] Course course)
{
    if (!ModelState.IsValid)
    {
        return HttpBadRequest(ModelState);
    }

    _context.Course.Add(course);
    try
    {
        _context.SaveChanges();
    }
    catch (DbUpdateException)
    {
        if (CourseExists(course.CourseId))
        {
            return new HttpStatusCodeResult(StatusCodes.Status409Conflict);
        }
        else
        {
            throw;
        }
    }

    return Ok();
}

最后，当我使用fiddler时，我在web api上看到以下错误：

HTTP / 1.1 400 Bad Request Content-Type：application / json;字符集= utf-8的   服务器：Kestrel X-Powered-By：ASP.NET Access-Control-Allow-Origin：*   Access-Control-Allow-Headers：Content-Type，Accept，X-Requested-With，   X-File-Name访问控制允许方法：GET，POST日期：Sun，01 Jan   2017 16:15:15 GMT内容长度：37

{＆＃34;＆＃34;：[＆＃34;不支持的内容类型＆＃39;＆＃39;。＆＃34;]}

我尝试了很多不同的post方法配置无济于事。已经工作了三天，所以感谢任何帮助。

修改我无法解决问题。我的web api使用的是新的asp.net核心和EF 7.我使用EF 6和ASP.Net 4.5.2重写了它，并且它有效。我怀疑我的网络API中缺少一些导致问题的东西。

Answer 1

对数据进行字符串化

var body = JSON.stringify(Course);

发送前

_http.post(url, body, options)

同时删除[FromBody]属性。它用于从复杂对象中提取简单类型。

参考：Parameter Binding in ASP.NET Web API

行动将像这样结束

[HttpPost]
[Route("CoursesWebApi/api/courses/insert/")]
public IActionResult PostCourse(Course course) { ... }

Answer 2

您需要发送正文中的数据，因为您的PostCourse api方法将在[FromBody]中查看

            //public IActionResult PostCourse([FromBody] Course course)

以下是使用Observable的示例：

            public saveCourse(Course: any): Observable<Course> {
                    let url ='https://server/CoursesWebApi/api/courses/insert';
                    let body: string = JSON.stringify(Course);
                    let  headers = new Headers();
                    let headers.append('Content-Type', 'application/json');
                    let options = new RequestOptions({ headers: this.headers });

                    return this.authHttp.put(this.url, body,options)
                        .map((res: Response) => {
                                    return res;
                                })
                            .catch((error: any) => {
                                // Error on post request.
                                return Observable.throw(error);
                        });
                }

Answer 3

如果您已经在Chrome中启用了CORS，请尝试添加 Access-Control-Allow-Origin，*到你的标题。有类似的问题，这有帮助。

angular 2 http post方法失败

3 个答案: