fast-csv pug - PullRequest
       16

fast-csv pug

0 голосов
/ 29 ноября 2018

Я пытаюсь загрузить файл, используя pug, multer и express.

Форма pug выглядит следующим образом

form(method='POST' enctype="multipart/form-data")
    div.form-group
    input#uploaddata.form-control(type='file', name='uploaddata' )
    br
    button.btn.btn-primary(type='submit' name='uploaddata') Upload

Код сервера выглядит следующим образом (вырвано из контекста)

.post('/uploaddata', function(req, res, next) {
    upload.single('uploaddata',function(err) {
    if(err){
      throw err;
      } else {
    res.json({success : "File upload sucessfully.", status : 200});
    }
  });
})

Моя проблема заключается в том, что при успешной загрузке файла сообщение об успехе не отображается на той же странице, т. Е. Загружается новая страница, показывающая

{success: "Загрузка файла успешно завершена. ", status: 200}

В качестве примера для других элементов (нажатие ссылки) сообщение отображается с помощью такого javascript:

$("#importdata").on('click', function(){
        $.get( "/import", function( data ) {
            $("#message").show().html(data['success']);
        });
    });

Я попытался сделать чистый javascript, чтобы обойтиповедение формы по умолчанию, но не повезло.

1 Ответ

0 голосов
/ 29 ноября 2018

Ваша проблема связана со смешением представлений форм и концепций AJAX.В частности, вы отправляете форму, а затем возвращаете значение, соответствующее API AJAX.Вам нужно выбрать одно или другое, чтобы это работало должным образом.

Если вы решите отправить это как форму, которую вы не можете использовать res.json, вам нужно переключиться на res.render или res.redirectвместо этого, чтобы сделать страницу снова.Вы точно видите, что вы указываете узлу / экспрессу делать с res.json - выводом JSON.Рендеринг или перенаправление - вот что вы хотите сделать здесь.

Вот учебник по MDN для форм , а также учебное пособие, специфичное для express.js .

В качестве альтернативы, если вы решите обрабатывать это с помощью AJAX API, вам нужно использовать jquery, fetch, axios или аналогичные в браузере для отправки запроса и обработки ответа.Это не приведет к перезагрузке страницы, но вам нужно как-то обработать ответ и изменить страницу, иначе пользователь просто будет сидеть и удивляться, что произошло.

MDN имеет отличный учебникна AJAX , который поможет вам начать там.Если вы идете по этому пути, также убедитесь, что вы читали о restful API design .

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

...