При попытке отправить сгенерированный PDF-файл из React Js в запрос Django-Rest Post файл не был отправлен - PullRequest
0 голосов
/ 09 апреля 2019

Попытка сгенерировать pdf-файл в реакции js и затем отправить его в бэкэнд отдыха django.

Я успешно создал файл pdf с использованием jsPDF и html2canvas, но теперь не могу отправить остальные API, когда я отправляю его, я получаю ответ «Файл не был отправлен». Я проверил API-интерфейс django-rest и его работоспособность , PDF не собирается остальные API. Вот мой код ниже:

genPDF=(evt)=>{
    evt.preventDefault();
   html2canvas(document.getElementById("pdfid")).then(canvas=>{
       let img=canvas.toDataURL('img/png');
       let doc=new JsPDF();
       doc.addImage(img,'JPEG',30,30);
       //doc.save('test.pdf');
       let file=doc;
       const formdata=new FormData();
       formdata.append("file",file);
       this.postpdf(formdata)
   });

};

postpdf=(payload)=>{

    fetch(`http://127.0.0.1:8000/chauffeur/pdf_upload/`,
        {
            method: 'POST',
            body: JSON.stringify(payload),
            headers: {
                'Content-Type': 'application/json'
            }
        }
    ).then(response => response.json()).catch(error => console.error('Error:', error));
};

Заголовки запроса

       Content-Type: multipart/form-data; boundary=----                       
       WebKitFormBoundaryEueEwtpzbquHU6Tb
       Origin: http://localhost:3000
       Referer: http://localhost:3000/contractinvoice
       User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko)
       Chrome/73.0.3683.86 Safari/537.36

Заголовки ответа

       Access-Control-Allow-Credentials: true
       Access-Control-Allow-Origin: http://localhost:3000
       Allow: GET, POST, HEAD, OPTIONS
       Content-Length: 76
       Content-Type: application/json
       Date: Wed, 10 Apr 2019 05:44:49 GMT
       Server: WSGIServer/0.2 CPython/3.5.2
       Vary: Accept, Cookie, Origin
       X-Frame-Options: SAMEORIGIN

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

Ответы [ 2 ]

1 голос
/ 09 апреля 2019

У вас есть ошибка здесь:

'Content-Type': 'application/json'

Если вы хотите отправить файл, вы должны использовать multipart / form-data

0 голосов
/ 09 апреля 2019

почему вы хотите преобразовать полезную нагрузку в JSON.stringify () ... полезная нагрузка не является json ... попробуйте это ...

postpdf=(payload)=>{

    fetch(`http://127.0.0.1:8000/chauffeur/pdf_upload/`,
        {
            method: 'POST',
            body: payload,
            headers: {
                'Content-Type': 'multipart/form-data'
            }
        }
    ).then(response => response.json()).catch(error => console.error('Error:', error));
};

...