как решить 746: неожиданный токен в 'в AJAX форме сообщения данных - PullRequest
0 голосов
/ 04 апреля 2020

Я отправляю объект файла на Ruby через AJAX примерно так:

var files = $("#upDOCS").prop('files'),
            formData = new FormData();

            for (var i = 0; i < files.length; i++) {
              var file = files[i];
              if (!file.type==='application/pdf') {
                continue;
              }
              formData.append(file.name, file);
            }

            $.ajax({
              xhr: function () {
                            var xhr = $.ajaxSettings.xhr();
                            xhr.upload.onprogress = function (e) {
                                console.log(Math.floor(e.loaded / e.total * 100) + '%');
                            };
                            return xhr;
                        },
                url: "medcon/adddocs",
                type: "POST",
                enctype: 'multipart/form-data',
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                success: function (locks) { ...

Но я получаю сообщение об ошибке, в котором говорится, что я отправляю неожиданный токен, который начинается с тире ----- Мне кажется, что у меня есть объект файла PDF, потому что ошибка также включает в себя данные PDF:

    746: unexpected token at '------WebKitFormBoundarybp8j3mTAsTL4JrAq
Content-Disposition: form-data; name="test.pdf"; filename="test.pdf"
Content-Type: application/pdf

%PDF-1.4
%����
1 0 obj
<</Creator (Mozilla/5.0 \(Windows NT 10.0; Win64; x64\) AppleWebKit/537.36 \(KHTML, like Gecko\) Chrome/70.0.3538.110 Safari/537.36)
/Producer (Skia/PDF m70)
/CreationDate (D:20181130205113+00'00')
/ModDate (D:20181130205113+00'00')>>
endobj
2 0 obj
<</Type /XObject
/Subtype /Image
/Width 17
/Height 17
/ColorSpace /DeviceRGB
/SMask 3 0 R
/BitsPerComponent 8
/Filter /FlateDecode
/Length 144>> stream
x���I� ��S�7�M�'9eʈ���'�i3�1�d;��ӫ��9�;�h��X�����8��uV?�p����b�?���4ӵ�/����0䵍�����Z+?P���(C���@gjޏ~�f������?v��N
endstream
endobj
3 0 obj
<</Type /XObject
/Subtype /Image
/Width 17
/Height 17
/ColorSpace /DeviceGray
/BitsPerComponent 8
/Filter /FlateDecode
/Length 121>> stream
x�c`'

Где я ошибаюсь? Какой маркер Ialleagal я ввел или какое форматирование я пропустил?

1 Ответ

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

Я обнаружил, что нам не нужен весь объект формы для загрузки файла на сервер. Нам просто нужны символы base64. Чтобы получить их, мне пришлось использовать событие onload, что означает, что AJAX должен быть синхронизирован, а не асинхронен; то есть AJAX должен быть внутри триггера события onload. Это сработало для меня:

function _docs_submit() {
          event.preventDefault();
          upDOCS_btn.html("Uploading...");

            var fileReader = new FileReader(),
                base64;                    

            // Define file reader function to read the file content and convert to base64
            fileReader.onload = function(file) {
                base64 = file.target.result;

                data["file_base64"] = base64.split(/,/)[1];

                /* Ajax - has to go in the onload event because this has to be synchronous*/
            $.ajax({
              xhr: function () {
                            var xhr = $.ajaxSettings.xhr();
                            xhr.upload.onprogress = function (e) {
                                console.log(Math.floor(e.loaded / e.total * 100) + '%');
                            };
                            return xhr;
                        },
                url: "medcon/adddocs",
                type: "POST",
                enctype: 'multipart/form-data',
                dataType: "json",  
                data: JSON.stringify(data),
                cache: false,
                contentType: false,
                processData: false,
                success: function (locks) {
                  alert('Thank you.\nDocument(s) received.');
                  //$('#gscForm')[0].reset();
                  self.element.remove();
                  $("#medcon-3").empty();
                  $("#medcon-3").append($('<div id="medcon">').medconlist());
                  $("#medcon-2").empty();
                  $("#medcon-2").append($('<div id="medcon">').medcon());
                  $("#medcon-1").empty();
                  //$("#medcon-1").append($('<div id="medconoverview">').medcongsc());
                  $("#medcons").tabs('select', '#medcon-1');
                },
                error: function(e) {
                        alert("There was an error submitting your documents:\n" + e.responseText);
                        console.log(e.responseText);
                      }
              });

            };

            var file = $("#upDOCS").prop('files')[0],
                data = {
                  "filename":file.name,
                  "filetype":file.type,
                  "filesize":file.size
                }

                fileReader.readAsDataURL(file);
        }
...