我在Azure中托管了一个非常简单的.NET Web API,有两个非常简单的方法:
[EnableCors(origins: "http://simpleapiearl.azurewebsites.net", headers: "*", methods: "*")]
public class EnvelopesController : ApiController {
// GET: api/Envelopes
public IEnumerable<string> Get() {
return new string[] { "value1", "value2" };
}
// POST: api/Envelopes
public string Post([FromBody]Envelope env) {
return "rval: " + env + " (and my addition to env)";
}
}
我创建了一个simple plunk来调用这些方法。在我的AngularJS代码中,我正在进行两个非常简单的$ http调用。 GET工作正常。但是,POST总是返回“400(错误请求)”,紧接着在我的WebStorm控制台中“XMLHttpRequestion无法加载......无效的HTTP状态代码400”。
赞赏所有建议!
EDIT !!
您好,感谢非常快速的回复。我刚刚意识到我忘了添加一些非常相关的细节。
我的POST方法的参数就是我称之为Envelope的对象,它包含两个属性:listingId (int)
和Description (string)
。当我添加urlencoded Content-Type标头,并传递'{"listingId":1234, "Description":"some description"}'
作为我的POST数据时,我在服务器上的POST方法中的env参数是NULL(也就是说,它似乎无法解析我提供的JSON) 。对不起,原帖子中省略了这一点。
答案 0 :(得分:17)
我认为这篇文章会有所帮助。
How do I POST urlencoded form data with $http in AngularJS?
默认情况下,$ http服务将转换传出请求 将数据序列化为JSON,然后将其与内容一起发布 - 类型,“application / json”。当我们想要将值作为FORM发布时 发布后,我们需要更改序列化算法并发布数据 使用内容类型“application / x-www-form-urlencoded”。
这是你的修改过的plnkr。您的代码缺少JSON到已编码网址的转换。
http://plnkr.co/edit/4aeEDz73qgHSfOv1sBgn?p=preview
$http({
method: 'POST',
url: 'http://simpleApiEarl.azurewebsites.net/api/envelopes',
data: env,
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
transformRequest: function(obj) {
var str = [];
for(var p in obj)
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
return str.join("&");
}
}).
答案 1 :(得分:1)
我发现了一篇纠正我的问题的博文:
http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/
感谢大家帮助我!
答案 2 :(得分:0)
使用AngularJS,您可以更轻松地完成。
您可以注入$httpParamSerializer
,然后通过$httpParamSerializer(data)
准备您的数据。
所以你的电话应该是这样的:
$http({
method: 'POST',
url: 'http://simpleApiEarl.azurewebsites.net/api/envelopes',
data: $httpParamSerializer(env),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})