代码之家 › 专栏 › 技术社区 › Scott Vercuski

VAU.JS和.NETWebAPI2从AXIOS 405或415错误发布

axios asp.net-web-api2 vue.js rest c#

Scott Vercuski · 技术社区 · 8 年前

我在发布到WEBAPI时遇到问题。

[RoutePrefix("api/Test")]
   public class TestController : ApiController
   {
       // GET: api/Test
       [Route]
       public IEnumerable<string> Get()
       {
           return new string[] { "value1", "value2" };
       }

       [Route]
       public void Post([FromBody]string value)
       {
           Debugger.Break();
       }

我的Vu.JS应用程序通过AXIOS调用如下:

   PostTest(){
       alert("Post Test Starting");
       var data = new FormData();
       data.set('value','test');
       //var data = {'value': 'test'};
       this.CallAxios('post', 'http://localhost:10000/api/Test/', data, axiosHeaders);
   },
   CallAxios(callMethod, callURL, callData, callHeaders)
   {
     axios({
       method: callMethod,
       url: callURL,
       data: callData,
       headers: callHeaders
     }).then((response) => {
       alert(response.data)
     })
   }

如果我使用FormData部分调用postest Vue方法,并在.NET API Post方法上保留[FromBody]属性,则会收到以下415“不支持的媒体类型”错误:

{“Message”:“请求实体的媒体类型‘multipart/form data’是此资源不支持。“,”ExceptionMessage“:”否 MediaTypeFormatter可用于读取“String”类型的对象来自媒体类型为“multipart/form data”的内容,

如果我将Vue.js代码切换为使用“var data={'value':'test'}”,并从.NET Post参数中删除[FromBody]属性,则会收到以下405“Method Not Allowed”错误:

{“Message”:“请求的资源不支持http方法” “发布”。“}

我已经和这个斗争了一段时间了。看来我可以做以下选择之一:

使用JSon字符串如何在API调用中支持POST动词?

1 回复 | 直到 8 年前

Visualize 7 年前

有两种方法可以实现这一点(它们都不使用FormData)

(一) 以内容类型发送:application/x-www-form-urlencoded . 为此,您需要使用类似qs的库对参数进行URL编码。但是,请注意这个特殊的WebAPI警告(空密钥名)

import qs from 'qs';
let myValue = 'FontSpace'
let options = {
    url: '/api/fonts'
    , method: 'post'
    , data: qs.stringify({ '': myValue })
}
let response = await this.$http(options)

=字体空间

2个) . 为此,只需JSON.stringify值(无键),并在头中显式指定内容类型

let myValue = 'FontSpace'
let options = {
    headers: { 'Content-Type': 'application/json' }
    , url: '/api/fonts'
    , method: 'post'
    , data: JSON.stringify(myValue)
}
let response = await axios(options)

在devtools中检查,您将看到参数得到JSON编码

只要编码和内容类型匹配,WebAPI2就会接受您的请求。

This documentation was helpful

当参数有[FromBody]时,Web API使用内容类型头来选择格式化程序。在本例中,内容类型是“application/json”,请求体是原始json字符串(而不是json对象)。