Использование JSZip с веб-сайта для загрузки файла из хранилища BLOB-объектов Azure

Question

Я храню некоторый видеоконтент в хранилище BLOB-объектов Azure. Когда пользователь нажимает кнопку на веб-сайте, я хочу сжать этот видеофайл и заставить его скачать его. URL-адрес, который я даю в качестве входных данных, является прямым URL-адресом файла Azure BLOB-объекта, например: https://xxxxx.blob.core.windows.net/user-content/yyyy.mp4. Когда я запускаю приведенный ниже код, я получаю сообщение об ошибке:

XMLHttpRequest не может загрузить https://xxxxx.blob.core.windows.net/user-content/yyyy.mp4. В запрошенном ресурсе отсутствует заголовок "Access-Control-Allow-Origin". Поэтому происхождение ' http://xxx.yyy.io/' не разрешено.

page-project.js: 2810 Uncaught Ошибка: InvalidStateError: Не удалось прочитать свойство responseText из "XMLHttpRequest": значение доступно только в том случае, если "responseType" объекта является "" или "text" (был "arraybuffer"). в XMLHttpRequest.xhr.onreadystatechange (jszip-utils.js:93)

Когда я получаю доступ к URL-адресу блоба прямо в браузере, я могу загрузить файл. Я даже включил CORS в Azure BLOB-объекте, чтобы разрешить запросы от любого источника и все заголовки все еще я получаю ошибку. Как это решить? Или есть какой-то другой способ сделать ту же функциональность?

JS CODE:

function download(url){ 
var zip = new JSZip();
var zipFilename = "downloadvideo.zip";


JSZipUtils.getBinaryContent(url, function (err, data) {
     if(err) {
        throw err; // or handle the error
     }
     try {
        JSZip.loadAsync(data).then(function () {
            zip.file(url, data, {binary:true});
            zip.generateAsync({type:'blob'}).then(function(content) {
                saveAs(content, zipFilename);
            });
        });  
    }
    catch(e) {
        showError(e);
    }
    });
}

Answer 1

Согласно вашему описанию, я полагаю, вы могли бы перепроверить, что вы уже включили настройку CORS для хранилища Azure, а не таблицу / файл.

Если вы уже установили двоичный объект CORS, я предлагаю попробовать удалить его и сбросить заново.

Изображение как это:

Мои настройки:

Я также создал тестовую демонстрацию в соответствии с вашими кодами, после установки CORS я мог загрузить файл.

Результат: