Html表单 - 路由错误

时间:2012-11-07 20:10:19

标签: asp.net-mvc-4 asp.net-web-api

我正在使用asp.net教程中的FileUpload示例。当我把它作为独立构建时,它工作正常。但是,每当我尝试将该功能添加到新的MVC4网站时,路由都是错误的。我可能没解释这个,所以这里是代码:

[HttpPost]
public async Task<HttpResponseMessage> PostFile()
{
    // Check if the request contains multipart/form-data.
    if (!Request.Content.IsMimeMultipartContent())
    {
        throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
    }

    string root = HttpContext.Current.Server.MapPath("~/App_Data");
    var provider = new MultipartFormDataStreamProvider(root);

    try
    {
        var sb = new StringBuilder(); // Holds the response body

        // Read the form data and return an async task.
        await Request.Content.ReadAsMultipartAsync(provider);

        // This illustrates how to get the form data.
        foreach(var key in provider.FormData.AllKeys)
        {
            var strings = provider.FormData.GetValues(key);
            if (strings != null) foreach(var val in strings)
            {
                sb.Append(string.Format("{0}: {1}\n", key, val));
            }
        }

        // This illustrates how to get the file names for uploaded files.
        foreach(var file in provider.FileData)
        {
            var fileInfo = new FileInfo(file.LocalFileName);
            sb.Append(string.Format("Uploaded file: {0} ({1} bytes)\n", fileInfo.Name, fileInfo.Length));
        }
        return new HttpResponseMessage
        {
            Content = new StringContent(sb.ToString())
        };
    }
    catch (System.Exception e)
    {
        return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
    }
}

这是我正在使用的页面:

<div style="height:400px;">
<h3>File Upload</h3>
<form name="trip_search" method="post" enctype="multipart/form-data" action="api/upload">
    <div>
        <input type="radio" name="trip" value="round-trip"/>
        Round-Trip
    </div>
    <div>
        <input type="radio" name="trip" value="one-way"/>
        One-Way
    </div>

    <div>
        <input type="checkbox" name="options" value="nonstop" />
        Only show non-stop flights
    </div>
    <div>
        <input type="checkbox" name="options" value="airports" />
        Compare nearby airports
    </div>
    <div>
        <input type="checkbox" name="options" value="dates" />
        My travel dates are flexible
    </div>

    <div>
        <label for="seat">Seating Preference</label>
        <select name="seat">
            <option value="aisle">Aisle</option>
            <option value="window">Window</option>
            <option value="center">Center</option>
            <option value="none">No Preference</option>
        </select>
    </div>
    <div>
        <input type="submit" value="Submit" />
    </div>

</form>

当我直接导航到localhost:13927api/upload时,我看到了来自web api方法的回复。我在WebApiConfig中注册了DefaultApi路由。

但当我在页面localhost/Home/About上并点击提交按钮时,它会尝试转到localhost/Home/api/upload - 这不存在。

我错过了什么?

修改

马里奥的建议解决了我的问题。我表单上的操作方法与root无关。

action="api/upload" vs. action="/api/upload"

这解决了我的问题。

对这个问题进行了一些阐述:

当您处于默认路径(例如yoursite / Home / Index - &gt;如果这是您的默认路径)时,action =“api / myaction”将起作用,因为当前路径仍然被视为网站。但是,一旦你实际导航到路径(比如yoursite / Home / About),当前路径现在位于“Home”下,所以我遗漏的“/”自然是相对于我当前的路径而不是根目录。这就是为什么样本在没有前导“/”的情况下工作的原因,因为有问题的视图是默认视图。

1 个答案:

答案 0 :(得分:2)

添加了答案,如果这也可以帮助其他人:

您的表单action="api/upload"与根目录无关。尝试action="/api/upload"或使用其中一个帮助程序指定路线。