Невозможно загрузить в хранилище BLOB-объектов, отсутствует заголовок Access-Control-Allow-Origin

Используя модуль @ azure / storage-blob в браузере, невозможно напрямую загрузить в хранилище Azure. Он жалуется на отсутствующий заголовок запроса. Загрузка выполняется из приложения ReactJS, работающего как надстройка Office.

В соответствии с требованиями Microsoft CORS был включен в учетной записи хранения для больших двоичных объектов.

Я попытался найти способ добавить пользовательские заголовки HTTP, однако ни один из них не работал.

Вот код загрузки

import { Credential, BlobServiceClient} from "@azure/storage-blob/browser/azure-storage-blob.min.js";

export function uploadToStorage(storageAccountName: string, storageAccountKey: string, file: SelectedFile) {
    return async (dispatch) => {
        try {
            const account = storageAccountName;
            const accountKey = storageAccountKey;
            const sharedKeyCredential = new Credential(account, accountKey);
            const blobServiceClient = new BlobServiceClient(
                `https://${account}.blob.core.windows.net`,
                sharedKeyCredential
            );
            const containerClient = blobServiceClient.getContainerClient("container-name");
            const blobClient = containerClient.getBlobClient(file.name);
            const blockBlobClient = blobClient.getBlockBlobClient();
            const uploadBlobResponse = await blockBlobClient.uploadBrowserData(file.data, {
                maxSingleShotSize: 4 * 1024 * 1024
              }, { "blobHTTPHeaders": { "blobContentType": file.mimeType } });
        }
        catch (error) { 
            console.error(error);
        }
    }
}

Ошибка отладчика Chrome выглядит следующим образом:

Доступ к XMLHttpRequest по адресу 'https://somestorageaccountsomewhere.blob.core.windows.net/blablablacontainer/Somefile-2018.5-en.docx 'from origin' https://localhost:3000 'заблокирован политикой CORS: ответ на предпечатный запрос не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок' Access-Control-Allow-Origin '.


person Étienne Brouillard    schedule 12.09.2019    source источник