Используя модуль @ 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 '.