Как загрузить файл с помощью веб-api в ASP.NET MVC 4 и jquery

Я новичок в использовании ASP.NET MVC 4 с Web Api.

Я хочу разрешить пользователю загружать файл, этот файл я создам на стороне сервера. Для создания файла мне удалось получить следующий код

[ActionName("Export")]
public HttpResponseMessage PostExportData(SomeModel model)
{           
    string csv = _service.GetData(model);
    HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK);
    result.Content = new StringContent(csv);
    //a text file is actually an octet-stream (pdf, etc)
    result.Content.Headers.ContentType = new MediaTypeHeaderValue("application/octet-stream");
    //we used attachment to force download
    result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
    result.Content.Headers.ContentDisposition.FileName = "file.csv";
    return result;            
}

КАК ПРИЗЫВАТЬ ЭТО МЕТОД ВЕБ-API С ИСПОЛЬЗОВАНИЕМ JQUERY?

Но я не уверен, как вызвать этот веб-api с помощью jquery и заставить его вернуть мне файл с опцией "сохранить как/открыть", которую вы обычно получаете при загрузке любого файла.

Может кто-нибудь, пожалуйста, помогите мне и проведет меня в том, как сделать звонок и загрузить файл. Спасибо.

Ответы

Ответ 1

Вы можете сделать что-то подобное внутри представления, где вы хотите использовать jquery. Я предполагаю, что имя контроллера - ExportController. Вы также должны разбить модельные переменные или, альтернативно, собрать модель внутри HttpResponseMessage PostExportData(SomeModel model) каким-либо другим способом.

HTML:

<a class="export">export</a>

JavaScript:

<script>
$('a.export').click(function(e) {
    e.preventDefault();  //stop the browser from following
    window.location.href = '@Url.Action('Export', 'ExportController', new { property = model.property, property = model.property2 })';
});
</script>

Чтобы использовать POST

function UpdateForm(modelObject) {
   if ($('#hidden-form').length < 1)
   {
       $('<form>').attr({
           method: 'POST',
           id: 'hidden-form',
           action: '@Url.Action('Export', 'Export')'
       }).appendTo('body');
   }
   $('#hidden-form').html('');
   for(var propertyName in modelObject) {
       $('<input>').attr({
            type: 'hidden',
            id: propertyName,
            name: propertyName,
            value: modelObject[propertyName]
       }).appendTo('#hidden-form');
    }
}

$('a.export').click(function(e) {
    e.preventDefault();
    var modelObject = { property1 : "property1" };
    UpdateForm(modelObject);
    $('#hidden-form').submit();
});

Затем вы можете просто отправить #hidden-form через js, который будет запускать загрузку файла

Обновление:. Это полный пример для публикации, а его не проверяется на наличие опечаток и т.д., поэтому отлаживайте любые незначительные ошибки.