Google Storage + JQuery -File-Upload + Django + URL-адрес со знаком, как мне изменить submit () и соответствующие параметры? - PullRequest
0 голосов
/ 04 апреля 2020

У меня есть следующий код js, и он использует API со знаком URL, чтобы получить подписанные URL для загрузки контента в хранилище Google через Django API.

Когда я использую его со следующим кодом:

xhr.open("PUT", data.signed_url); 
xhr.setRequestHeader('Content-Type', file.type); 
xhr.send(file);

Он отлично работает, и я могу загружать в Google Storage очень большие файлы. Но, очевидно, что когда я это делаю, я не могу использовать какие-либо индикаторы выполнения jquery -file-upload.

Не могли бы вы подсказать, как мне изменить data.submit (), где я должен поставить его, и как я должен изменить параметры или настройки перед отправкой. Должен ли я переопределять добавление или отправку обратного вызова?

Мне кажется, что отсутствует поддержка Google Storage с Jquery -file-upload, так как единственный пример охватывает только непонятный Google Blobstore по следующей ссылке: https://github.com/blueimp/jQuery-File-Upload/wiki/Google-App-Engine

$("#fileupload").fileupload({
dataType: 'json',
type: 'PUT',
sequentialUploads: true,

submit: function(e, data) {
    var $this = $(this);
    $.each(data.files, function(index, file) {
        // pack our data to get signature url
        var formData = new FormData();
        formData.append('filename', file.name);
        formData.append('type', file.type);
        formData.append('size', file.size);

        // Step 3: get our signature URL
        $.ajax({
            url:  '/api/getsignedurl/',
            type: 'POST',
            processData: false,
            contentType: false,
            dataType: 'json',
            headers: {
                'X-CSRFToken': Cookies.get('csrftoken'),
            },
            primary_data: data,
            data: formData
        }).done(function (data) {
            // Step 5: got our url, push to GCS
            const xhr = new XMLHttpRequest();
            if ('withCredentials' in xhr) {
                console.log("With credentials");
                xhr.open("PUT", data.signed_url, true);
            }
            else if (typeof XDomainRequest !== 'undefined') {
                console.log("With domainrequest");
                xhr = new XDomainRequest();
                xhr.open("PUT", data.signed_url);
            }
            else {
                console.log("With null");
                xhr = null;
            }

            //What shall I do to make the following work for uploading GS
            this.primary_data.url = data.signed_url;
            this.primary_data.headers={'Content-Type': file.type};
            this.primary_data.submit();

            xhr.onload = () => {
                const status = xhr.status;
                if (status === 200) {

                } else {
                    alert("Failed to upload 1: " + status);
                }
            };

            xhr.onerror = () => {
                alert("Failed to upload 2");
            };
            //When the code below uncommented, it uploads to GS succesfully.
            //xhr.setRequestHeader('Content-Type', file.type);
            //xhr.send(file);
        });
    });
},

Также это моя установка для cors для GS Bucket.

 [
  {
    "origin": ["*"],
    "responseHeader": ["Content-Type", "Access-Control-Allow-Origin"],
    "method": ["GET", "PUT", "OPTIONS"],
    "maxAgeSeconds": 60
  }
]
...