Далее. js & Ant Design Dragger: при развертывании файла происходит сбой загрузки файла - PullRequest
2 голосов
/ 26 февраля 2020

Я пытаюсь создать загрузку файла с помощью Next. js и Ant Design с использованием React.

На localhost все работает нормально. Когда я развернул экземпляр и попытался загрузить файл, я получил следующую ошибку:

Request URL: https://my-app.my-team.now.sh/url/for/test/
Request Method: POST
Status Code: 405 
Remote Address: 34.65.228.161:443
Referrer Policy: no-referrer-when-downgrade

Интерфейс, который я использую, выглядит следующим образом:

<Dragger {...fileUploadProps}>{renderImageUploadText()}</Dragger>

где fileUploadProps являются:

const fileUploadProps = {
  name: 'file',
  multiple: false,
  showUploadList: false,
  accept: 'image/png,image/gif,image/jpeg',
  onChange(info) {
    const { status } = info.file;
    if (status === 'done') {
      if (info.file.size > 2000000) {
        setUploadSizeError('File size is too large');
      } else {
        handleFieldValue(API_FORM_FIELDS.PICTURE, info);
      }
    } else if (status === 'error') {
      setUploadSizeError(`${info.file.name} file upload failed.`);
    }
  },
};

Я полагаю, это связано с рендерингом Next на стороне сервера. js? С другой стороны, это может и не произойти, поскольку ко времени перехода к url/for/test он должен отобразиться на клиенте.

Как вы реализовали загрузку файлов с помощью Ant Design и Next. js?

1 Ответ

0 голосов
/ 01 апреля 2020

Чтобы это работало, нужно пропустить action="https://www.mocky.io/v2/5cc8019d300000980a055e76" для компонента <Upload/>.

Компонент ANTD Upload должен отправить запрос POST для загрузки файла. Это либо делает этот запрос POST к текущему URL, что приводит к 405, либо к URL, указанному в action prop. https://www.mocky.io/v2/5cc8019d300000980a055e76 работает как этот URL.

...